@xiwebdesign/xicms-core 4.17.1

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/blocks/builtins/Gallery.tsx"],"sourcesContent":["\"use client\";\n\nimport { useCallback, useEffect, useRef, useState } from \"react\";\nimport { createPortal } from \"react-dom\";\nimport type { z } from \"zod\";\nimport { GalleryBlockSchema } from \"../../schema/blocks\";\nimport { defineBlock, type BlockRenderProps } from \"../registry\";\nimport { useModuleSettings } from \"../../modules/context\";\nimport { Grid } from \"../ui\";\nimport { Img } from \"../../media/ImageContext\";\n\ntype Gallery = z.infer<typeof GalleryBlockSchema>;\ntype Item = Gallery[\"items\"][number];\n\n/** Per-site instelbaar via `modules.gallery.config` (door de agent of in /beheer). */\nexport interface GallerySettings {\n  columns?: number;\n  lightbox?: boolean;\n}\n\n/**\n * Eigen lightbox-overlay: rendert via een portal naar `document.body` (zo raakt geen enkele\n * ancestor-transform — bv. de scroll-reveal — de full-screen positionering). Sluit op klik náást\n * de foto én op Escape; vorige/volgende met teller; herstelt focus zónder de pagina te laten\n * verspringen (`preventScroll`) en zet de body-scroll vast zolang hij open is.\n */\nexport function LightboxOverlay({\n  items,\n  index,\n  onIndex,\n  onClose,\n}: {\n  items: Item[];\n  index: number;\n  onIndex: (i: number) => void;\n  onClose: () => void;\n}) {\n  const it = items[index];\n  const total = items.length;\n  const overlayRef = useRef<HTMLDivElement | null>(null);\n  const prev = useCallback(() => onIndex((index - 1 + total) % total), [index, total, onIndex]);\n  const next = useCallback(() => onIndex((index + 1) % total), [index, total, onIndex]);\n  // Swipe (pointer events, werkt voor touch én muis-sleep): horizontaal > 40px = vorige/volgende.\n  const swipeStart = useRef<number | null>(null);\n  const onPointerDown = (e: React.PointerEvent) => {\n    swipeStart.current = e.clientX;\n  };\n  const onPointerUp = (e: React.PointerEvent) => {\n    if (swipeStart.current === null || total < 2) return;\n    const dx = e.clientX - swipeStart.current;\n    swipeStart.current = null;\n    if (dx > 40) prev();\n    else if (dx < -40) next();\n  };\n\n  useEffect(() => {\n    const onKey = (e: KeyboardEvent) => {\n      if (e.key === \"Escape\") onClose();\n      else if (e.key === \"ArrowLeft\") prev();\n      else if (e.key === \"ArrowRight\") next();\n      else if (e.key === \"Tab\") {\n        // Focus-trap (aria-modal): Tab cirkelt binnen de dialog i.p.v. naar de pagina eronder.\n        const el = overlayRef.current;\n        const focusables = el ? [...el.querySelectorAll<HTMLElement>(\"button, a[href]\")] : [];\n        if (focusables.length === 0) return;\n        const first = focusables[0];\n        const last = focusables[focusables.length - 1];\n        const active = document.activeElement;\n        if (e.shiftKey && (active === first || !el?.contains(active))) {\n          e.preventDefault();\n          last.focus();\n        } else if (!e.shiftKey && (active === last || !el?.contains(active))) {\n          e.preventDefault();\n          first.focus();\n        }\n      }\n    };\n    document.addEventListener(\"keydown\", onKey);\n    const prevOverflow = document.body.style.overflow;\n    document.body.style.overflow = \"hidden\"; // scroll-lock terwijl open\n    // Initiële focus in de dialog (dialog-conventie; toetsenbord/screenreader landt niet \"achter\" de overlay).\n    overlayRef.current?.querySelector<HTMLElement>(\".xicms-lightbox__close\")?.focus({ preventScroll: true });\n    return () => {\n      document.removeEventListener(\"keydown\", onKey);\n      document.body.style.overflow = prevOverflow;\n    };\n  }, [onClose, prev, next]);\n\n  if (typeof document === \"undefined\") return null;\n  return createPortal(\n    <div\n      ref={overlayRef}\n      className=\"xicms-lightbox\"\n      role=\"dialog\"\n      aria-modal=\"true\"\n      aria-label={it.alt || it.caption || \"Foto\"}\n      onClick={onClose}\n    >\n      <button type=\"button\" className=\"xicms-lightbox__close\" aria-label=\"Sluiten\" onClick={onClose}>✕</button>\n      {total > 1 && (\n        <>\n          <button type=\"button\" className=\"xicms-lightbox__nav xicms-lightbox__nav--prev\" aria-label=\"Vorige\" onClick={(e) => { e.stopPropagation(); prev(); }}>‹</button>\n          <button type=\"button\" className=\"xicms-lightbox__nav xicms-lightbox__nav--next\" aria-label=\"Volgende\" onClick={(e) => { e.stopPropagation(); next(); }}>›</button>\n          <span className=\"xicms-lightbox__counter\">{index + 1} / {total}</span>\n        </>\n      )}\n      {/* Klik op de foto/onderschrift sluit NIET (stopPropagation); klik op de rand wel.\n          touchAction pan-y: verticaal scrollen blijft van de browser, horizontaal is swipen. */}\n      <figure\n        className=\"xicms-lightbox__figure\"\n        onClick={(e) => e.stopPropagation()}\n        onPointerDown={onPointerDown}\n        onPointerUp={onPointerUp}\n        style={{ touchAction: \"pan-y\" }}\n      >\n        {/* eslint-disable-next-line @next/next/no-img-element */}\n        <img src={it.url} alt={it.alt ?? \"\"} />\n        {it.caption && <figcaption>{it.caption}</figcaption>}\n      </figure>\n    </div>,\n    document.body,\n  );\n}\n\n/** Galerij — responsive grid met instelbare beeldverhouding en optionele lightbox. */\nfunction GalleryRender({ block }: BlockRenderProps<Gallery>) {\n  const settings = useModuleSettings<GallerySettings>(\"gallery\");\n  const allItems = (block.items ?? []).filter((i) => i.url);\n  const [open, setOpen] = useState(false);\n  const [index, setIndex] = useState(0);\n  const [activeTag, setActiveTag] = useState<string | null>(null);\n  const triggerRef = useRef<HTMLButtonElement | null>(null);\n\n  // Filterbalk op item-tags (opt-in): lightbox-navigatie volgt de gefilterde lijst.\n  const tags = block.showFilter ? [...new Set(allItems.map((i) => i.tag).filter((t): t is string => Boolean(t)))] : [];\n  const items = activeTag ? allItems.filter((i) => i.tag === activeTag) : allItems;\n\n  if (allItems.length === 0) return null;\n\n  const cols = block.columns && block.columns > 0 ? block.columns : settings.columns ?? 3;\n  const lightbox =\n    block.lightbox === \"on\" ? true : block.lightbox === \"off\" ? false : settings.lightbox ?? true;\n  const ar = block.aspectRatio ?? \"1/1\";\n\n  const imgStyle = {\n    width: \"100%\",\n    aspectRatio: ar === \"auto\" ? undefined : ar.replace(\"/\", \" / \"),\n    objectFit: \"cover\" as const,\n    borderRadius: \"var(--radius-element)\",\n    display: \"block\",\n  };\n\n  const close = () => {\n    setOpen(false);\n    triggerRef.current?.focus({ preventScroll: true }); // geen page-jump bij sluiten\n  };\n\n  return (\n    <div className=\"xicms-gallery\">\n      {tags.length > 0 && (\n        <div className=\"xicms-gallery__filter\" role=\"group\" aria-label=\"Filter op categorie\">\n          <button type=\"button\" className=\"xicms-gallery__filterbtn\" data-active={activeTag === null ? \"1\" : \"0\"} onClick={() => { setActiveTag(null); setIndex(0); }}>\n            Alles\n          </button>\n          {tags.map((t) => (\n            <button key={t} type=\"button\" className=\"xicms-gallery__filterbtn\" data-active={activeTag === t ? \"1\" : \"0\"} onClick={() => { setActiveTag(t); setIndex(0); }}>\n              {t}\n            </button>\n          ))}\n        </div>\n      )}\n      <Grid columns={{ minWidth: 160, max: Math.min(cols, 6) }} gap={2}>\n        {items.map((i, idx) => (\n          <figure key={idx} style={{ margin: 0 }} className=\"xicms-gallery__item\">\n            {lightbox ? (\n              <button\n                type=\"button\"\n                onClick={(e) => { triggerRef.current = e.currentTarget; setIndex(idx); setOpen(true); }}\n                aria-label={i.alt || i.caption || `Foto ${idx + 1} vergroten`}\n                style={{ display: \"block\", width: \"100%\", padding: 0, border: 0, background: \"none\", cursor: \"zoom-in\" }}\n              >\n                <Img src={i.url as string} alt={i.alt ?? \"\"} width={600} height={600} sizes=\"(max-width: 640px) 50vw, 280px\" style={imgStyle} />\n              </button>\n            ) : (\n              <Img src={i.url as string} alt={i.alt ?? \"\"} width={600} height={600} sizes=\"(max-width: 640px) 50vw, 280px\" style={imgStyle} />\n            )}\n            {i.caption && (\n              <figcaption className=\"xicms-gallery__caption\" style={{ marginTop: \"0.4rem\", fontSize: \"0.85rem\", color: \"var(--color-text-secondary)\" }}>\n                {i.caption}\n              </figcaption>\n            )}\n          </figure>\n        ))}\n      </Grid>\n\n      {lightbox && open && (\n        <LightboxOverlay items={items} index={index} onIndex={setIndex} onClose={close} />\n      )}\n    </div>\n  );\n}\n\nexport const galleryBlock = defineBlock({\n  type: \"gallery\",\n  schema: GalleryBlockSchema,\n  Render: GalleryRender,\n  label: \"Galerij\",\n  icon: \"🖼\",\n  defaults: () => ({ items: [], columns: 0, lightbox: \"inherit\", aspectRatio: \"1/1\" }),\n});\n"],"mappings":"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","names":[]}

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

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

package/dist/blocks/builtins/Hero.js

@@ -0,0 +1,47 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { HeroBlockSchema } from "../../schema/blocks";
+import { defineBlock } from "../registry";
+import { Heading, Text } from "../ui";
+import { useLinkComponent } from "@astryxdesign/core/Link";
+import { Img } from "../../media/ImageContext";
+function HeroRender({ block }) {
+  const LinkC = useLinkComponent();
+  const overlay = block.overlayOpacity > 0 ? { background: block.overlayColor ?? "#000000", opacity: block.overlayOpacity / 100 } : null;
+  const coverMedia = Boolean(block.videoUrl || block.imageUrl) && block.minHeight !== "auto";
+  const light = coverMedia ? { color: "#ffffff", textShadow: "0 2px 14px rgba(0,0,0,.45)" } : void 0;
+  const buttons = block.buttons ?? [];
+  return /* @__PURE__ */ jsxs(
+    "section",
+    {
+      className: "xicms-hero",
+      "data-align": block.align,
+      "data-valign": block.vAlign,
+      "data-height": block.minHeight,
+      "data-media": coverMedia ? "cover" : void 0,
+      children: [
+        block.videoUrl ? /* @__PURE__ */ jsx("video", { className: "xicms-hero__media", src: block.videoUrl, autoPlay: true, muted: true, loop: true, playsInline: true, "aria-hidden": "true" }) : block.imageUrl ? /* @__PURE__ */ jsx(Img, { src: block.imageUrl, alt: "", className: "xicms-hero__media", width: 1600, height: 900, sizes: "100vw", priority: true, editField: "imageUrl", editFill: true }) : null,
+        overlay && /* @__PURE__ */ jsx("div", { className: "xicms-hero__overlay", style: overlay, "aria-hidden": "true" }),
+        block.overlayGradient && coverMedia && /* @__PURE__ */ jsx("div", { className: "xicms-hero__gradient", "aria-hidden": "true" }),
+        /* @__PURE__ */ jsxs("div", { className: "xicms-hero__inner", children: [
+          block.eyebrow && /* @__PURE__ */ jsx(Text, { type: "label", className: "xicms-hero__eyebrow", style: light, "data-xicms-edit": "eyebrow", children: block.eyebrow }),
+          block.title && /* @__PURE__ */ jsx(Heading, { level: 1, type: "display-1", className: "xicms-hero__title", style: light, children: block.title }),
+          block.subtitle && /* @__PURE__ */ jsx(Text, { type: "large", className: "xicms-hero__sub", style: light, children: block.subtitle }),
+          buttons.length > 0 && /* @__PURE__ */ jsx("div", { className: "xicms-hero__buttons", children: buttons.filter((b) => b.label).map((b, i) => /* @__PURE__ */ jsx(LinkC, { className: `xicms-btn xicms-btn--${b.variant}`, href: b.href, children: b.label }, i)) })
+        ] })
+      ]
+    }
+  );
+}
+const heroBlock = defineBlock({
+  type: "hero",
+  schema: HeroBlockSchema,
+  Render: HeroRender,
+  label: "Hero",
+  icon: "\u2728",
+  defaults: () => ({ title: "Welkom", subtitle: "", align: "left", vAlign: "center", minHeight: "auto", overlayOpacity: 0, buttons: [] })
+});
+export {
+  heroBlock
+};
+//# sourceMappingURL=Hero.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/blocks/builtins/Hero.tsx"],"sourcesContent":["\"use client\";\n\nimport type { CSSProperties } from \"react\";\nimport type { z } from \"zod\";\nimport { HeroBlockSchema } from \"../../schema/blocks\";\nimport { defineBlock, type BlockRenderProps } from \"../registry\";\nimport { Heading, Text } from \"../ui\";\nimport { useLinkComponent } from \"@astryxdesign/core/Link\";\nimport { Img } from \"../../media/ImageContext\";\n\ntype Hero = z.infer<typeof HeroBlockSchema>;\n\nfunction HeroRender({ block }: BlockRenderProps<Hero>) {\n  const LinkC = useLinkComponent();\n  const overlay =\n    block.overlayOpacity > 0\n      ? { background: block.overlayColor ?? \"#000000\", opacity: block.overlayOpacity / 100 }\n      : null;\n  // Beeld/video als dekkende achtergrond (niet bij height \"auto\"): dan moet de tekst licht zijn.\n  const coverMedia = Boolean(block.videoUrl || block.imageUrl) && block.minHeight !== \"auto\";\n  const light: CSSProperties | undefined = coverMedia\n    ? { color: \"#ffffff\", textShadow: \"0 2px 14px rgba(0,0,0,.45)\" }\n    : undefined;\n  const buttons = block.buttons ?? [];\n\n  return (\n    <section\n      className=\"xicms-hero\"\n      data-align={block.align}\n      data-valign={block.vAlign}\n      data-height={block.minHeight}\n      data-media={coverMedia ? \"cover\" : undefined}\n    >\n      {block.videoUrl ? (\n        <video className=\"xicms-hero__media\" src={block.videoUrl} autoPlay muted loop playsInline aria-hidden=\"true\" />\n      ) : block.imageUrl ? (\n        <Img src={block.imageUrl} alt=\"\" className=\"xicms-hero__media\" width={1600} height={900} sizes=\"100vw\" priority editField=\"imageUrl\" editFill />\n      ) : null}\n      {overlay && <div className=\"xicms-hero__overlay\" style={overlay} aria-hidden=\"true\" />}\n      {/* Gradient (donker onderaan → transparant): leesbare tekst zonder de hele foto te dimmen. */}\n      {block.overlayGradient && coverMedia && <div className=\"xicms-hero__gradient\" aria-hidden=\"true\" />}\n      <div className=\"xicms-hero__inner\">\n        {block.eyebrow && (\n          <Text type=\"label\" className=\"xicms-hero__eyebrow\" style={light} data-xicms-edit=\"eyebrow\">\n            {block.eyebrow}\n          </Text>\n        )}\n        {block.title && (\n          <Heading level={1} type=\"display-1\" className=\"xicms-hero__title\" style={light}>\n            {block.title}\n          </Heading>\n        )}\n        {block.subtitle && (\n          <Text type=\"large\" className=\"xicms-hero__sub\" style={light}>\n            {block.subtitle}\n          </Text>\n        )}\n        {buttons.length > 0 && (\n          <div className=\"xicms-hero__buttons\">\n            {buttons.filter((b) => b.label).map((b, i) => (\n              <LinkC key={i} className={`xicms-btn xicms-btn--${b.variant}`} href={b.href}>\n                {b.label}\n              </LinkC>\n            ))}\n          </div>\n        )}\n      </div>\n    </section>\n  );\n}\n\nexport const heroBlock = defineBlock({\n  type: \"hero\",\n  schema: HeroBlockSchema,\n  Render: HeroRender,\n  label: \"Hero\",\n  icon: \"✨\",\n  defaults: () => ({ title: \"Welkom\", subtitle: \"\", align: \"left\", vAlign: \"center\", minHeight: \"auto\", overlayOpacity: 0, buttons: [] }),\n});\n"],"mappings":";AAkCQ,cAOF,YAPE;AA9BR,SAAS,uBAAuB;AAChC,SAAS,mBAA0C;AACnD,SAAS,SAAS,YAAY;AAC9B,SAAS,wBAAwB;AACjC,SAAS,WAAW;AAIpB,SAAS,WAAW,EAAE,MAAM,GAA2B;AACrD,QAAM,QAAQ,iBAAiB;AAC/B,QAAM,UACJ,MAAM,iBAAiB,IACnB,EAAE,YAAY,MAAM,gBAAgB,WAAW,SAAS,MAAM,iBAAiB,IAAI,IACnF;AAEN,QAAM,aAAa,QAAQ,MAAM,YAAY,MAAM,QAAQ,KAAK,MAAM,cAAc;AACpF,QAAM,QAAmC,aACrC,EAAE,OAAO,WAAW,YAAY,6BAA6B,IAC7D;AACJ,QAAM,UAAU,MAAM,WAAW,CAAC;AAElC,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAU;AAAA,MACV,cAAY,MAAM;AAAA,MAClB,eAAa,MAAM;AAAA,MACnB,eAAa,MAAM;AAAA,MACnB,cAAY,aAAa,UAAU;AAAA,MAElC;AAAA,cAAM,WACL,oBAAC,WAAM,WAAU,qBAAoB,KAAK,MAAM,UAAU,UAAQ,MAAC,OAAK,MAAC,MAAI,MAAC,aAAW,MAAC,eAAY,QAAO,IAC3G,MAAM,WACR,oBAAC,OAAI,KAAK,MAAM,UAAU,KAAI,IAAG,WAAU,qBAAoB,OAAO,MAAM,QAAQ,KAAK,OAAM,SAAQ,UAAQ,MAAC,WAAU,YAAW,UAAQ,MAAC,IAC5I;AAAA,QACH,WAAW,oBAAC,SAAI,WAAU,uBAAsB,OAAO,SAAS,eAAY,QAAO;AAAA,QAEnF,MAAM,mBAAmB,cAAc,oBAAC,SAAI,WAAU,wBAAuB,eAAY,QAAO;AAAA,QACjG,qBAAC,SAAI,WAAU,qBACZ;AAAA,gBAAM,WACL,oBAAC,QAAK,MAAK,SAAQ,WAAU,uBAAsB,OAAO,OAAO,mBAAgB,WAC9E,gBAAM,SACT;AAAA,UAED,MAAM,SACL,oBAAC,WAAQ,OAAO,GAAG,MAAK,aAAY,WAAU,qBAAoB,OAAO,OACtE,gBAAM,OACT;AAAA,UAED,MAAM,YACL,oBAAC,QAAK,MAAK,SAAQ,WAAU,mBAAkB,OAAO,OACnD,gBAAM,UACT;AAAA,UAED,QAAQ,SAAS,KAChB,oBAAC,SAAI,WAAU,uBACZ,kBAAQ,OAAO,CAAC,MAAM,EAAE,KAAK,EAAE,IAAI,CAAC,GAAG,MACtC,oBAAC,SAAc,WAAW,wBAAwB,EAAE,OAAO,IAAI,MAAM,EAAE,MACpE,YAAE,SADO,CAEZ,CACD,GACH;AAAA,WAEJ;AAAA;AAAA;AAAA,EACF;AAEJ;AAEO,MAAM,YAAY,YAAY;AAAA,EACnC,MAAM;AAAA,EACN,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,OAAO;AAAA,EACP,MAAM;AAAA,EACN,UAAU,OAAO,EAAE,OAAO,UAAU,UAAU,IAAI,OAAO,QAAQ,QAAQ,UAAU,WAAW,QAAQ,gBAAgB,GAAG,SAAS,CAAC,EAAE;AACvI,CAAC;","names":[]}

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

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

package/dist/blocks/builtins/ImageBlock.js

@@ -0,0 +1,24 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { ImageBlockSchema } from "../../schema/blocks";
+import { defineBlock } from "../registry";
+import { ResponsiveImage } from "../../components/ResponsiveImage";
+function ImageRender({ block }) {
+  if (!block.url) return null;
+  const img = /* @__PURE__ */ jsx(ResponsiveImage, { url: block.url, alt: block.alt });
+  return /* @__PURE__ */ jsxs("figure", { className: "xicms-image", "data-align": block.align, "data-ratio": block.aspectRatio, children: [
+    block.href ? /* @__PURE__ */ jsx("a", { href: block.href, children: img }) : img,
+    block.caption && /* @__PURE__ */ jsx("figcaption", { children: block.caption })
+  ] });
+}
+const imageBlock = defineBlock({
+  type: "image",
+  schema: ImageBlockSchema,
+  Render: ImageRender,
+  label: "Afbeelding",
+  icon: "\u{1F5BC}\uFE0F",
+  defaults: () => ({ alt: "", align: "center", aspectRatio: "auto" })
+});
+export {
+  imageBlock
+};
+//# sourceMappingURL=ImageBlock.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/blocks/builtins/ImageBlock.tsx"],"sourcesContent":["import type { z } from \"zod\";\nimport { ImageBlockSchema } from \"../../schema/blocks\";\nimport { defineBlock, type BlockRenderProps } from \"../registry\";\nimport { ResponsiveImage } from \"../../components/ResponsiveImage\";\n\ntype ImageBlk = z.infer<typeof ImageBlockSchema>;\n\nfunction ImageRender({ block }: BlockRenderProps<ImageBlk>) {\n  if (!block.url) return null;\n  const img = (\n    <ResponsiveImage url={block.url} alt={block.alt} />\n  );\n  return (\n    <figure className=\"xicms-image\" data-align={block.align} data-ratio={block.aspectRatio}>\n      {block.href ? <a href={block.href}>{img}</a> : img}\n      {block.caption && <figcaption>{block.caption}</figcaption>}\n    </figure>\n  );\n}\n\nexport const imageBlock = defineBlock({\n  type: \"image\",\n  schema: ImageBlockSchema,\n  Render: ImageRender,\n  label: \"Afbeelding\",\n  icon: \"🖼️\",\n  defaults: () => ({ alt: \"\", align: \"center\", aspectRatio: \"auto\" }),\n});\n"],"mappings":"AAUI,cAGA,YAHA;AATJ,SAAS,wBAAwB;AACjC,SAAS,mBAA0C;AACnD,SAAS,uBAAuB;AAIhC,SAAS,YAAY,EAAE,MAAM,GAA+B;AAC1D,MAAI,CAAC,MAAM,IAAK,QAAO;AACvB,QAAM,MACJ,oBAAC,mBAAgB,KAAK,MAAM,KAAK,KAAK,MAAM,KAAK;AAEnD,SACE,qBAAC,YAAO,WAAU,eAAc,cAAY,MAAM,OAAO,cAAY,MAAM,aACxE;AAAA,UAAM,OAAO,oBAAC,OAAE,MAAM,MAAM,MAAO,eAAI,IAAO;AAAA,IAC9C,MAAM,WAAW,oBAAC,gBAAY,gBAAM,SAAQ;AAAA,KAC/C;AAEJ;AAEO,MAAM,aAAa,YAAY;AAAA,EACpC,MAAM;AAAA,EACN,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,OAAO;AAAA,EACP,MAAM;AAAA,EACN,UAAU,OAAO,EAAE,KAAK,IAAI,OAAO,UAAU,aAAa,OAAO;AACnE,CAAC;","names":[]}

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

@@ -0,0 +1,8 @@
+import type { z } from "zod";
+import { JobsBlockSchema } from "../../schema/blocks";
+type Jobs = z.infer<typeof JobsBlockSchema>;
+type JobItem = Jobs["items"][number];
+/** JobPosting-JSON-LD per vacature (Google Jobs). Puur en getest. */
+export declare function jobsJsonLd(items: JobItem[], orgName: string): Array<Record<string, unknown>>;
+export declare const jobsBlock: import("..").BlockDefinition<z.ZodTypeAny>;
+export {};

package/dist/blocks/builtins/Jobs.js

@@ -0,0 +1,65 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { JobsBlockSchema } from "../../schema/blocks";
+import { defineBlock } from "../registry";
+import { useSiteConfig } from "../../config";
+import { VStack, Card, Heading, Text, Btn } from "../ui";
+function jobsJsonLd(items, orgName) {
+  return items.filter((j) => j.title).map((j) => ({
+    "@context": "https://schema.org",
+    "@type": "JobPosting",
+    title: j.title,
+    hiringOrganization: { "@type": "Organization", name: orgName },
+    ...j.description ? { description: j.description } : {},
+    ...j.datePosted ? { datePosted: j.datePosted } : {},
+    ...j.employmentType ? { employmentType: j.employmentType } : {},
+    ...j.location ? { jobLocation: { "@type": "Place", address: { "@type": "PostalAddress", addressLocality: j.location } } } : {},
+    ...j.salary ? { baseSalary: j.salary } : {},
+    ...j.applyUrl ? { url: j.applyUrl } : {}
+  }));
+}
+function JobsRender({ block }) {
+  const { name } = useSiteConfig();
+  const items = (block.items ?? []).filter((j) => j.title);
+  if (items.length === 0 && !block.heading) return null;
+  return /* @__PURE__ */ jsxs(VStack, { gap: 4, as: "section", className: "xicms-jobs", children: [
+    (block.heading || block.intro) && /* @__PURE__ */ jsxs(VStack, { gap: 1, children: [
+      block.heading && /* @__PURE__ */ jsx(Heading, { level: 2, "data-xicms-edit": "heading", children: block.heading }),
+      block.intro && /* @__PURE__ */ jsx(Text, { color: "secondary", "data-xicms-edit": "intro", children: block.intro })
+    ] }),
+    items.length === 0 && /* @__PURE__ */ jsx(Text, { color: "secondary", children: "Er zijn op dit moment geen openstaande vacatures." }),
+    /* @__PURE__ */ jsx(VStack, { gap: 3, children: items.map((j, i) => /* @__PURE__ */ jsx(Card, { padding: 4, className: "xicms-jobs__item", children: /* @__PURE__ */ jsxs(VStack, { gap: 1.5, children: [
+      /* @__PURE__ */ jsxs("div", { className: "xicms-jobs__head", children: [
+        /* @__PURE__ */ jsx(Heading, { level: 3, "data-xicms-edit": `items.${i}.title`, children: j.title }),
+        /* @__PURE__ */ jsx("span", { className: "xicms-jobs__meta", children: [j.employmentType, j.location, j.salary].filter(Boolean).join(" \xB7 ") })
+      ] }),
+      j.description && /* @__PURE__ */ jsx(Text, { color: "secondary", "data-xicms-edit": `items.${i}.description`, children: j.description }),
+      j.applyUrl && /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(Btn, { label: "Solliciteer", href: j.applyUrl, variant: "primary" }) })
+    ] }) }, i)) }),
+    block.jsonLd && jobsJsonLd(items, name).map((ld, i) => /* @__PURE__ */ jsx(
+      "script",
+      {
+        type: "application/ld+json",
+        dangerouslySetInnerHTML: { __html: JSON.stringify(ld) }
+      },
+      i
+    ))
+  ] });
+}
+const jobsBlock = defineBlock({
+  type: "jobs",
+  schema: JobsBlockSchema,
+  Render: JobsRender,
+  label: "Vacatures",
+  icon: "\u{1F9D1}\u200D\u{1F527}",
+  defaults: () => ({
+    heading: "Vacatures",
+    items: [{ title: "Vacaturetitel", employmentType: "Fulltime", location: "" }],
+    jsonLd: true
+  })
+});
+export {
+  jobsBlock,
+  jobsJsonLd
+};
+//# sourceMappingURL=Jobs.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/blocks/builtins/Jobs.tsx"],"sourcesContent":["\"use client\";\n\nimport type { z } from \"zod\";\nimport { JobsBlockSchema } from \"../../schema/blocks\";\nimport { defineBlock, type BlockRenderProps } from \"../registry\";\nimport { useSiteConfig } from \"../../config\";\nimport { VStack, Card, Heading, Text, Btn } from \"../ui\";\n\ntype Jobs = z.infer<typeof JobsBlockSchema>;\ntype JobItem = Jobs[\"items\"][number];\n\n/** JobPosting-JSON-LD per vacature (Google Jobs). Puur en getest. */\nexport function jobsJsonLd(items: JobItem[], orgName: string): Array<Record<string, unknown>> {\n  return items\n    .filter((j) => j.title)\n    .map((j) => ({\n      \"@context\": \"https://schema.org\",\n      \"@type\": \"JobPosting\",\n      title: j.title,\n      hiringOrganization: { \"@type\": \"Organization\", name: orgName },\n      ...(j.description ? { description: j.description } : {}),\n      ...(j.datePosted ? { datePosted: j.datePosted } : {}),\n      ...(j.employmentType ? { employmentType: j.employmentType } : {}),\n      ...(j.location\n        ? { jobLocation: { \"@type\": \"Place\", address: { \"@type\": \"PostalAddress\", addressLocality: j.location } } }\n        : {}),\n      ...(j.salary ? { baseSalary: j.salary } : {}),\n      ...(j.applyUrl ? { url: j.applyUrl } : {}),\n    }));\n}\n\n/** Vacature-overzicht met JobPosting-JSON-LD — vindbaar via Google Jobs. */\nfunction JobsRender({ block }: BlockRenderProps<Jobs>) {\n  const { name } = useSiteConfig();\n  const items = (block.items ?? []).filter((j) => j.title);\n  if (items.length === 0 && !block.heading) return null;\n  return (\n    <VStack gap={4} as=\"section\" className=\"xicms-jobs\">\n      {(block.heading || block.intro) && (\n        <VStack gap={1}>\n          {block.heading && <Heading level={2} data-xicms-edit=\"heading\">{block.heading}</Heading>}\n          {block.intro && <Text color=\"secondary\" data-xicms-edit=\"intro\">{block.intro}</Text>}\n        </VStack>\n      )}\n      {items.length === 0 && <Text color=\"secondary\">Er zijn op dit moment geen openstaande vacatures.</Text>}\n      <VStack gap={3}>\n        {items.map((j, i) => (\n          <Card key={i} padding={4} className=\"xicms-jobs__item\">\n            <VStack gap={1.5}>\n              <div className=\"xicms-jobs__head\">\n                <Heading level={3} data-xicms-edit={`items.${i}.title`}>{j.title}</Heading>\n                <span className=\"xicms-jobs__meta\">\n                  {[j.employmentType, j.location, j.salary].filter(Boolean).join(\" · \")}\n                </span>\n              </div>\n              {j.description && <Text color=\"secondary\" data-xicms-edit={`items.${i}.description`}>{j.description}</Text>}\n              {j.applyUrl && (\n                <div>\n                  <Btn label=\"Solliciteer\" href={j.applyUrl} variant=\"primary\" />\n                </div>\n              )}\n            </VStack>\n          </Card>\n        ))}\n      </VStack>\n      {block.jsonLd &&\n        jobsJsonLd(items, name).map((ld, i) => (\n          <script\n            key={i}\n            type=\"application/ld+json\"\n            // eslint-disable-next-line react/no-danger\n            dangerouslySetInnerHTML={{ __html: JSON.stringify(ld) }}\n          />\n        ))}\n    </VStack>\n  );\n}\n\nexport const jobsBlock = defineBlock({\n  type: \"jobs\",\n  schema: JobsBlockSchema,\n  Render: JobsRender,\n  label: \"Vacatures\",\n  icon: \"🧑‍🔧\",\n  defaults: () => ({\n    heading: \"Vacatures\",\n    items: [{ title: \"Vacaturetitel\", employmentType: \"Fulltime\", location: \"\" }],\n    jsonLd: true,\n  }),\n});\n"],"mappings":"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","names":[]}

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

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

package/dist/blocks/builtins/Layout.js

@@ -0,0 +1,67 @@
+"use client";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useState } from "react";
+import { WithSidebarBlockSchema, TabsBlockSchema } from "../../schema/blocks";
+import { defineBlock } from "../registry";
+import { BlockRenderer } from "../BlockRenderer";
+import { useRegistry } from "../context";
+import { TabList, Tab } from "@astryxdesign/core/TabList";
+function WithSidebarRender({ block, siteId, mode }) {
+  const registry = useRegistry();
+  const main = /* @__PURE__ */ jsx("div", { className: "xicms-sidebar__main", children: /* @__PURE__ */ jsx(BlockRenderer, { blocks: block.main, registry, siteId, mode }) });
+  const aside = /* @__PURE__ */ jsx("aside", { "aria-label": "Zijbalk", className: `xicms-sidebar__aside${block.sticky ? " xicms-sidebar__aside--sticky" : ""}`, children: /* @__PURE__ */ jsx(BlockRenderer, { blocks: block.aside, registry, siteId, mode }) });
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: "xicms-sidebar",
+      "data-side": block.side,
+      "data-width": block.sidebarWidth,
+      children: block.side === "left" ? /* @__PURE__ */ jsxs(Fragment, { children: [
+        aside,
+        main
+      ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+        main,
+        aside
+      ] })
+    }
+  );
+}
+const withSidebarBlock = defineBlock({
+  type: "withSidebar",
+  schema: WithSidebarBlockSchema,
+  Render: WithSidebarRender,
+  label: "Met zijbalk",
+  icon: "\u25A4",
+  category: "layout",
+  defaults: () => ({ main: [], aside: [], side: "right", sidebarWidth: "md", sticky: true })
+});
+function TabsRender({ block, siteId, mode }) {
+  const registry = useRegistry();
+  const tabs = block.tabs ?? [];
+  const [active, setActive] = useState("0");
+  if (tabs.length === 0) return null;
+  const current = Math.min(Math.max(Number(active) || 0, 0), tabs.length - 1);
+  return /* @__PURE__ */ jsxs("section", { className: "xicms-tabs", children: [
+    /* @__PURE__ */ jsx(TabList, { value: String(current), onChange: setActive, hasDivider: true, children: tabs.map((t, i) => /* @__PURE__ */ jsx(Tab, { value: String(i), label: t.label || `Tab ${i + 1}` }, i)) }),
+    /* @__PURE__ */ jsx("div", { role: "tabpanel", "aria-label": tabs[current].label || `Tab ${current + 1}`, style: { marginTop: "1.25rem" }, children: /* @__PURE__ */ jsx(BlockRenderer, { blocks: tabs[current].blocks, registry, siteId, mode }) })
+  ] });
+}
+const tabsBlock = defineBlock({
+  type: "tabs",
+  schema: TabsBlockSchema,
+  Render: TabsRender,
+  label: "Tabbladen",
+  icon: "\u{1F5C2}\uFE0F",
+  category: "layout",
+  defaults: () => ({
+    tabs: [
+      { label: "Tab 1", blocks: [] },
+      { label: "Tab 2", blocks: [] }
+    ]
+  })
+});
+export {
+  tabsBlock,
+  withSidebarBlock
+};
+//# sourceMappingURL=Layout.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/blocks/builtins/Layout.tsx"],"sourcesContent":["\"use client\";\n\nimport { useState } from \"react\";\nimport type { z } from \"zod\";\nimport { WithSidebarBlockSchema, TabsBlockSchema } from \"../../schema/blocks\";\nimport { defineBlock, type BlockRenderProps } from \"../registry\";\nimport { BlockRenderer } from \"../BlockRenderer\";\nimport { useRegistry } from \"../context\";\nimport { TabList, Tab } from \"@astryxdesign/core/TabList\";\n\n/* ── Met zijbalk ───────────────────────────────────────────────────────────\n * Brede hoofdkolom + smalle (sticky) zijbalk. De zijbalk is dé plek voor de compacte\n * widget-varianten (\"laatste nieuws\", \"komende agenda\", contact, …). Beide kanten zijn\n * gewone block-arrays, dus alles wat op een pagina kan, kan ook hier. */\ntype WithSidebar = z.infer<typeof WithSidebarBlockSchema>;\n\nfunction WithSidebarRender({ block, siteId, mode }: BlockRenderProps<WithSidebar>) {\n  const registry = useRegistry();\n  const main = (\n    <div className=\"xicms-sidebar__main\">\n      <BlockRenderer blocks={block.main} registry={registry} siteId={siteId} mode={mode} />\n    </div>\n  );\n  const aside = (\n    <aside aria-label=\"Zijbalk\" className={`xicms-sidebar__aside${block.sticky ? \" xicms-sidebar__aside--sticky\" : \"\"}`}>\n      <BlockRenderer blocks={block.aside} registry={registry} siteId={siteId} mode={mode} />\n    </aside>\n  );\n  return (\n    <div\n      className=\"xicms-sidebar\"\n      data-side={block.side}\n      data-width={block.sidebarWidth}\n    >\n      {block.side === \"left\" ? (\n        <>\n          {aside}\n          {main}\n        </>\n      ) : (\n        <>\n          {main}\n          {aside}\n        </>\n      )}\n    </div>\n  );\n}\n\nexport const withSidebarBlock = defineBlock({\n  type: \"withSidebar\",\n  schema: WithSidebarBlockSchema,\n  Render: WithSidebarRender,\n  label: \"Met zijbalk\",\n  icon: \"▤\",\n  category: \"layout\",\n  defaults: () => ({ main: [], aside: [], side: \"right\", sidebarWidth: \"md\", sticky: true }),\n});\n\n/* ── Tabbladen ─────────────────────────────────────────────────────────────\n * Per tab een eigen set blokken. Toegankelijk (role=tab/tabpanel, pijltjes-navigatie via\n * de browser-default focus). */\ntype Tabs = z.infer<typeof TabsBlockSchema>;\n\nfunction TabsRender({ block, siteId, mode }: BlockRenderProps<Tabs>) {\n  const registry = useRegistry();\n  const tabs = block.tabs ?? [];\n  const [active, setActive] = useState(\"0\");\n  if (tabs.length === 0) return null;\n  const current = Math.min(Math.max(Number(active) || 0, 0), tabs.length - 1);\n  return (\n    <section className=\"xicms-tabs\">\n      <TabList value={String(current)} onChange={setActive} hasDivider>\n        {tabs.map((t, i) => (\n          <Tab key={i} value={String(i)} label={t.label || `Tab ${i + 1}`} />\n        ))}\n      </TabList>\n      <div role=\"tabpanel\" aria-label={tabs[current].label || `Tab ${current + 1}`} style={{ marginTop: \"1.25rem\" }}>\n        <BlockRenderer blocks={tabs[current].blocks} registry={registry} siteId={siteId} mode={mode} />\n      </div>\n    </section>\n  );\n}\n\nexport const tabsBlock = defineBlock({\n  type: \"tabs\",\n  schema: TabsBlockSchema,\n  Render: TabsRender,\n  label: \"Tabbladen\",\n  icon: \"🗂️\",\n  category: \"layout\",\n  defaults: () => ({\n    tabs: [\n      { label: \"Tab 1\", blocks: [] },\n      { label: \"Tab 2\", blocks: [] },\n    ],\n  }),\n});\n"],"mappings":";AAoBM,SAeE,UAfF,KAeE,YAfF;AAlBN,SAAS,gBAAgB;AAEzB,SAAS,wBAAwB,uBAAuB;AACxD,SAAS,mBAA0C;AACnD,SAAS,qBAAqB;AAC9B,SAAS,mBAAmB;AAC5B,SAAS,SAAS,WAAW;AAQ7B,SAAS,kBAAkB,EAAE,OAAO,QAAQ,KAAK,GAAkC;AACjF,QAAM,WAAW,YAAY;AAC7B,QAAM,OACJ,oBAAC,SAAI,WAAU,uBACb,8BAAC,iBAAc,QAAQ,MAAM,MAAM,UAAoB,QAAgB,MAAY,GACrF;AAEF,QAAM,QACJ,oBAAC,WAAM,cAAW,WAAU,WAAW,uBAAuB,MAAM,SAAS,kCAAkC,EAAE,IAC/G,8BAAC,iBAAc,QAAQ,MAAM,OAAO,UAAoB,QAAgB,MAAY,GACtF;AAEF,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAU;AAAA,MACV,aAAW,MAAM;AAAA,MACjB,cAAY,MAAM;AAAA,MAEjB,gBAAM,SAAS,SACd,iCACG;AAAA;AAAA,QACA;AAAA,SACH,IAEA,iCACG;AAAA;AAAA,QACA;AAAA,SACH;AAAA;AAAA,EAEJ;AAEJ;AAEO,MAAM,mBAAmB,YAAY;AAAA,EAC1C,MAAM;AAAA,EACN,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,OAAO;AAAA,EACP,MAAM;AAAA,EACN,UAAU;AAAA,EACV,UAAU,OAAO,EAAE,MAAM,CAAC,GAAG,OAAO,CAAC,GAAG,MAAM,SAAS,cAAc,MAAM,QAAQ,KAAK;AAC1F,CAAC;AAOD,SAAS,WAAW,EAAE,OAAO,QAAQ,KAAK,GAA2B;AACnE,QAAM,WAAW,YAAY;AAC7B,QAAM,OAAO,MAAM,QAAQ,CAAC;AAC5B,QAAM,CAAC,QAAQ,SAAS,IAAI,SAAS,GAAG;AACxC,MAAI,KAAK,WAAW,EAAG,QAAO;AAC9B,QAAM,UAAU,KAAK,IAAI,KAAK,IAAI,OAAO,MAAM,KAAK,GAAG,CAAC,GAAG,KAAK,SAAS,CAAC;AAC1E,SACE,qBAAC,aAAQ,WAAU,cACjB;AAAA,wBAAC,WAAQ,OAAO,OAAO,OAAO,GAAG,UAAU,WAAW,YAAU,MAC7D,eAAK,IAAI,CAAC,GAAG,MACZ,oBAAC,OAAY,OAAO,OAAO,CAAC,GAAG,OAAO,EAAE,SAAS,OAAO,IAAI,CAAC,MAAnD,CAAuD,CAClE,GACH;AAAA,IACA,oBAAC,SAAI,MAAK,YAAW,cAAY,KAAK,OAAO,EAAE,SAAS,OAAO,UAAU,CAAC,IAAI,OAAO,EAAE,WAAW,UAAU,GAC1G,8BAAC,iBAAc,QAAQ,KAAK,OAAO,EAAE,QAAQ,UAAoB,QAAgB,MAAY,GAC/F;AAAA,KACF;AAEJ;AAEO,MAAM,YAAY,YAAY;AAAA,EACnC,MAAM;AAAA,EACN,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,OAAO;AAAA,EACP,MAAM;AAAA,EACN,UAAU;AAAA,EACV,UAAU,OAAO;AAAA,IACf,MAAM;AAAA,MACJ,EAAE,OAAO,SAAS,QAAQ,CAAC,EAAE;AAAA,MAC7B,EAAE,OAAO,SAAS,QAAQ,CAAC,EAAE;AAAA,IAC/B;AAAA,EACF;AACF,CAAC;","names":[]}

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

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

package/dist/blocks/builtins/MapBlock.js

@@ -0,0 +1,31 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+import { MapBlockSchema } from "../../schema/blocks";
+import { defineBlock } from "../registry";
+import { ConsentEmbed } from "./consentEmbed";
+function MapRender({ block, mode }) {
+  if (!block.query) return null;
+  const src = block.provider === "google" ? block.query : `https://www.openstreetmap.org/export/embed.html?layer=mapnik&marker=&bbox=&q=${encodeURIComponent(block.query)}`;
+  return /* @__PURE__ */ jsx("div", { className: "xicms-map", style: { height: `${block.height}px` }, children: /* @__PURE__ */ jsx(ConsentEmbed, { gated: block.consentGated, preview: mode === "preview", label: "Kaart", children: /* @__PURE__ */ jsx(
+    "iframe",
+    {
+      src,
+      title: "Kaart",
+      loading: "lazy",
+      style: { border: 0, width: "100%", height: "100%" },
+      referrerPolicy: "no-referrer-when-downgrade"
+    }
+  ) }) });
+}
+const mapBlock = defineBlock({
+  type: "map",
+  schema: MapBlockSchema,
+  Render: MapRender,
+  label: "Kaart",
+  icon: "\u{1F5FA}\uFE0F",
+  defaults: () => ({ provider: "osm", query: "", zoom: 14, height: 360, consentGated: true })
+});
+export {
+  mapBlock
+};
+//# sourceMappingURL=MapBlock.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/blocks/builtins/MapBlock.tsx"],"sourcesContent":["\"use client\";\n\nimport type { z } from \"zod\";\nimport { MapBlockSchema } from \"../../schema/blocks\";\nimport { defineBlock, type BlockRenderProps } from \"../registry\";\nimport { ConsentEmbed } from \"./consentEmbed\";\n\ntype MapBlk = z.infer<typeof MapBlockSchema>;\n\nfunction MapRender({ block, mode }: BlockRenderProps<MapBlk>) {\n  if (!block.query) return null;\n  const src =\n    block.provider === \"google\"\n      ? block.query // bij google verwacht je een volledige embed-URL\n      : `https://www.openstreetmap.org/export/embed.html?layer=mapnik&marker=&bbox=&q=${encodeURIComponent(block.query)}`;\n  return (\n    <div className=\"xicms-map\" style={{ height: `${block.height}px` }}>\n      <ConsentEmbed gated={block.consentGated} preview={mode === \"preview\"} label=\"Kaart\">\n        <iframe\n          src={src}\n          title=\"Kaart\"\n          loading=\"lazy\"\n          style={{ border: 0, width: \"100%\", height: \"100%\" }}\n          referrerPolicy=\"no-referrer-when-downgrade\"\n        />\n      </ConsentEmbed>\n    </div>\n  );\n}\n\nexport const mapBlock = defineBlock({\n  type: \"map\",\n  schema: MapBlockSchema,\n  Render: MapRender,\n  label: \"Kaart\",\n  icon: \"🗺️\",\n  defaults: () => ({ provider: \"osm\", query: \"\", zoom: 14, height: 360, consentGated: true }),\n});\n"],"mappings":";AAkBQ;AAfR,SAAS,sBAAsB;AAC/B,SAAS,mBAA0C;AACnD,SAAS,oBAAoB;AAI7B,SAAS,UAAU,EAAE,OAAO,KAAK,GAA6B;AAC5D,MAAI,CAAC,MAAM,MAAO,QAAO;AACzB,QAAM,MACJ,MAAM,aAAa,WACf,MAAM,QACN,gFAAgF,mBAAmB,MAAM,KAAK,CAAC;AACrH,SACE,oBAAC,SAAI,WAAU,aAAY,OAAO,EAAE,QAAQ,GAAG,MAAM,MAAM,KAAK,GAC9D,8BAAC,gBAAa,OAAO,MAAM,cAAc,SAAS,SAAS,WAAW,OAAM,SAC1E;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,OAAM;AAAA,MACN,SAAQ;AAAA,MACR,OAAO,EAAE,QAAQ,GAAG,OAAO,QAAQ,QAAQ,OAAO;AAAA,MAClD,gBAAe;AAAA;AAAA,EACjB,GACF,GACF;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,UAAU,OAAO,OAAO,IAAI,MAAM,IAAI,QAAQ,KAAK,cAAc,KAAK;AAC3F,CAAC;","names":[]}

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

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

package/dist/blocks/builtins/NewsListBlock.js

@@ -0,0 +1,24 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { NewsListBlockSchema } from "../../schema/blocks";
+import { defineBlock } from "../registry";
+import { Heading } from "../ui";
+import { NewsList } from "../../components/News";
+function NewsListRender({ block }) {
+  return /* @__PURE__ */ jsxs("section", { className: "xicms-newslist", children: [
+    block.heading && /* @__PURE__ */ jsx(Heading, { level: 2, "data-xicms-edit": "heading", children: block.heading }),
+    /* @__PURE__ */ jsx(NewsList, { basePath: block.basePath, limit: block.limit, pageSize: block.pageSize })
+  ] });
+}
+const newsListBlock = defineBlock({
+  type: "newsList",
+  schema: NewsListBlockSchema,
+  Render: NewsListRender,
+  label: "Nieuwsoverzicht",
+  icon: "\u{1F5DE}\uFE0F",
+  defaults: () => ({ heading: "Laatste nieuws", limit: 6, basePath: "/nieuws" })
+});
+export {
+  newsListBlock
+};
+//# sourceMappingURL=NewsListBlock.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/blocks/builtins/NewsListBlock.tsx"],"sourcesContent":["\"use client\";\n\nimport type { z } from \"zod\";\nimport { NewsListBlockSchema } from \"../../schema/blocks\";\nimport { defineBlock, type BlockRenderProps } from \"../registry\";\nimport { Heading } from \"../ui\";\nimport { NewsList } from \"../../components/News\";\n\ntype NewsListBlk = z.infer<typeof NewsListBlockSchema>;\n\nfunction NewsListRender({ block }: BlockRenderProps<NewsListBlk>) {\n  return (\n    <section className=\"xicms-newslist\">\n      {block.heading && <Heading level={2} data-xicms-edit=\"heading\">{block.heading}</Heading>}\n      <NewsList basePath={block.basePath} limit={block.limit} pageSize={block.pageSize} />\n    </section>\n  );\n}\n\nexport const newsListBlock = defineBlock({\n  type: \"newsList\",\n  schema: NewsListBlockSchema,\n  Render: NewsListRender,\n  label: \"Nieuwsoverzicht\",\n  icon: \"🗞️\",\n  defaults: () => ({ heading: \"Laatste nieuws\", limit: 6, basePath: \"/nieuws\" }),\n});\n"],"mappings":";AAYI,SACoB,KADpB;AATJ,SAAS,2BAA2B;AACpC,SAAS,mBAA0C;AACnD,SAAS,eAAe;AACxB,SAAS,gBAAgB;AAIzB,SAAS,eAAe,EAAE,MAAM,GAAkC;AAChE,SACE,qBAAC,aAAQ,WAAU,kBAChB;AAAA,UAAM,WAAW,oBAAC,WAAQ,OAAO,GAAG,mBAAgB,WAAW,gBAAM,SAAQ;AAAA,IAC9E,oBAAC,YAAS,UAAU,MAAM,UAAU,OAAO,MAAM,OAAO,UAAU,MAAM,UAAU;AAAA,KACpF;AAEJ;AAEO,MAAM,gBAAgB,YAAY;AAAA,EACvC,MAAM;AAAA,EACN,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,OAAO;AAAA,EACP,MAAM;AAAA,EACN,UAAU,OAAO,EAAE,SAAS,kBAAkB,OAAO,GAAG,UAAU,UAAU;AAC9E,CAAC;","names":[]}

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

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

package/dist/blocks/builtins/Newsletter.js

@@ -0,0 +1,84 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useState } from "react";
+import { NewsletterBlockSchema } from "../../schema/blocks";
+import { defineBlock } from "../registry";
+import { Button } from "@astryxdesign/core/Button";
+import { TextInput } from "@astryxdesign/core/TextInput";
+import { CheckboxInput } from "@astryxdesign/core/CheckboxInput";
+import { VStack, Card, Heading, Text } from "../ui";
+import { isDemoActive } from "../../demo/demoStore";
+import { getFirebaseApp } from "../../firebase/client";
+import { submitFormValues } from "./lib/submitForm";
+function NewsletterRender({ block, siteId, mode }) {
+  const [email, setEmail] = useState("");
+  const [agreed, setAgreed] = useState(false);
+  const [status, setStatus] = useState("idle");
+  const useXicmsForm = !block.actionUrl && Boolean(block.formId);
+  async function submitViaXicms(e) {
+    e.preventDefault();
+    if (mode === "preview" || !block.formId) return;
+    if (isDemoActive() || !getFirebaseApp()) {
+      setStatus("ok");
+      return;
+    }
+    setStatus("busy");
+    try {
+      await submitFormValues(siteId, block.formId, { email });
+      setStatus("ok");
+      setEmail("");
+    } catch {
+      setStatus("error");
+    }
+  }
+  const consentBox = block.consentText ? /* @__PURE__ */ jsx("div", { style: { textAlign: "left", maxWidth: 440, width: "100%" }, children: /* @__PURE__ */ jsx(CheckboxInput, { label: block.consentText, isRequired: true, value: agreed, onChange: setAgreed }) }) : null;
+  const emailInput = /* @__PURE__ */ jsx("div", { style: { flex: 1, minWidth: 200, textAlign: "left" }, children: /* @__PURE__ */ jsx(
+    TextInput,
+    {
+      label: "E-mailadres",
+      isLabelHidden: true,
+      type: "email",
+      htmlName: "EMAIL",
+      isRequired: true,
+      placeholder: "je@email.nl",
+      value: email,
+      onChange: setEmail
+    }
+  ) });
+  const rowStyle = { display: "flex", gap: "0.75rem", flexWrap: "wrap", alignItems: "end", justifyContent: "center", maxWidth: 440, width: "100%" };
+  return /* @__PURE__ */ jsx(Card, { padding: 5, variant: "muted", children: /* @__PURE__ */ jsxs(VStack, { gap: 2, hAlign: "center", style: { textAlign: "center" }, children: [
+    block.heading && /* @__PURE__ */ jsx(Heading, { level: 2, "data-xicms-edit": "heading", children: block.heading }),
+    block.text && /* @__PURE__ */ jsx(Text, { color: "secondary", "data-xicms-edit": "text", children: block.text }),
+    status === "ok" ? /* @__PURE__ */ jsx(Text, { role: "status", children: "Bedankt voor je aanmelding!" }) : block.actionUrl ? /* @__PURE__ */ jsxs("form", { action: block.actionUrl, method: "post", target: "_blank", style: rowStyle, children: [
+      emailInput,
+      consentBox,
+      /* @__PURE__ */ jsx(Button, { label: block.buttonLabel, variant: "primary", size: "lg", type: "submit" })
+    ] }) : useXicmsForm ? /* @__PURE__ */ jsxs("form", { onSubmit: submitViaXicms, style: rowStyle, children: [
+      emailInput,
+      consentBox,
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          label: status === "busy" ? "Aanmelden\u2026" : block.buttonLabel,
+          variant: "primary",
+          size: "lg",
+          type: "submit",
+          isLoading: status === "busy"
+        }
+      ),
+      status === "error" && /* @__PURE__ */ jsx(Text, { role: "alert", type: "supporting", style: { color: "var(--color-error, #c0392b)" }, children: "Aanmelden mislukt. Probeer het later opnieuw." })
+    ] }) : /* @__PURE__ */ jsx(Text, { type: "supporting", color: "secondary", children: "Configureer een aanmeld-URL of formulier in de editor." })
+  ] }) });
+}
+const newsletterBlock = defineBlock({
+  type: "newsletter",
+  schema: NewsletterBlockSchema,
+  Render: NewsletterRender,
+  label: "Nieuwsbrief",
+  icon: "\u2709\uFE0F",
+  defaults: () => ({ heading: "Blijf op de hoogte", buttonLabel: "Aanmelden" })
+});
+export {
+  newsletterBlock
+};
+//# sourceMappingURL=Newsletter.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/blocks/builtins/Newsletter.tsx"],"sourcesContent":["\"use client\";\n\nimport { useState, type FormEvent } from \"react\";\nimport type { z } from \"zod\";\nimport { NewsletterBlockSchema } from \"../../schema/blocks\";\nimport { defineBlock, type BlockRenderProps } from \"../registry\";\nimport { Button } from \"@astryxdesign/core/Button\";\nimport { TextInput } from \"@astryxdesign/core/TextInput\";\nimport { CheckboxInput } from \"@astryxdesign/core/CheckboxInput\";\nimport { VStack, Card, Heading, Text } from \"../ui\";\nimport { isDemoActive } from \"../../demo/demoStore\";\nimport { getFirebaseApp } from \"../../firebase/client\";\nimport { submitFormValues } from \"./lib/submitForm\";\n\ntype Newsletter = z.infer<typeof NewsletterBlockSchema>;\n\n/**\n * Nieuwsbrief-aanmelding. Twee modi:\n * - `actionUrl` (bv. de embed-action van Mailchimp/Brevo): native form-POST naar de provider.\n * - `formId` (zonder actionUrl): opslag via het XiCMS-formulier (submitForm-callable) — inzendingen\n *   verschijnen in /beheer → Formulieren, met dezelfde rate-limiting/validatie als het formulier-blok.\n * Optionele AVG-checkbox via `consentText`.\n */\nfunction NewsletterRender({ block, siteId, mode }: BlockRenderProps<Newsletter>) {\n  const [email, setEmail] = useState(\"\");\n  const [agreed, setAgreed] = useState(false);\n  const [status, setStatus] = useState<\"idle\" | \"busy\" | \"ok\" | \"error\">(\"idle\");\n  const useXicmsForm = !block.actionUrl && Boolean(block.formId);\n\n  async function submitViaXicms(e: FormEvent) {\n    e.preventDefault();\n    if (mode === \"preview\" || !block.formId) return;\n    // Zelfde vangnet als het formulier-blok: in demo of zonder Firebase-backend lokaal \"slagen\"\n    // i.p.v. een foutmelding tonen op een statische (referentie)site.\n    if (isDemoActive() || !getFirebaseApp()) {\n      setStatus(\"ok\");\n      return;\n    }\n    setStatus(\"busy\");\n    try {\n      await submitFormValues(siteId, block.formId, { email });\n      setStatus(\"ok\");\n      setEmail(\"\");\n    } catch {\n      setStatus(\"error\");\n    }\n  }\n\n  const consentBox = block.consentText ? (\n    <div style={{ textAlign: \"left\", maxWidth: 440, width: \"100%\" }}>\n      <CheckboxInput label={block.consentText} isRequired value={agreed} onChange={setAgreed} />\n    </div>\n  ) : null;\n\n  const emailInput = (\n    <div style={{ flex: 1, minWidth: 200, textAlign: \"left\" }}>\n      <TextInput\n        label=\"E-mailadres\"\n        isLabelHidden\n        type=\"email\"\n        htmlName=\"EMAIL\"\n        isRequired\n        placeholder=\"je@email.nl\"\n        value={email}\n        onChange={setEmail}\n      />\n    </div>\n  );\n  const rowStyle = { display: \"flex\", gap: \"0.75rem\", flexWrap: \"wrap\", alignItems: \"end\", justifyContent: \"center\", maxWidth: 440, width: \"100%\" } as const;\n\n  return (\n    <Card padding={5} variant=\"muted\">\n      <VStack gap={2} hAlign=\"center\" style={{ textAlign: \"center\" }}>\n        {block.heading && <Heading level={2} data-xicms-edit=\"heading\">{block.heading}</Heading>}\n        {block.text && <Text color=\"secondary\" data-xicms-edit=\"text\">{block.text}</Text>}\n        {status === \"ok\" ? (\n          <Text role=\"status\">Bedankt voor je aanmelding!</Text>\n        ) : block.actionUrl ? (\n          <form action={block.actionUrl} method=\"post\" target=\"_blank\" style={rowStyle}>\n            {emailInput}\n            {consentBox}\n            <Button label={block.buttonLabel} variant=\"primary\" size=\"lg\" type=\"submit\" />\n          </form>\n        ) : useXicmsForm ? (\n          <form onSubmit={submitViaXicms} style={rowStyle}>\n            {emailInput}\n            {consentBox}\n            <Button\n              label={status === \"busy\" ? \"Aanmelden…\" : block.buttonLabel}\n              variant=\"primary\"\n              size=\"lg\"\n              type=\"submit\"\n              isLoading={status === \"busy\"}\n            />\n            {status === \"error\" && (\n              <Text role=\"alert\" type=\"supporting\" style={{ color: \"var(--color-error, #c0392b)\" }}>\n                Aanmelden mislukt. Probeer het later opnieuw.\n              </Text>\n            )}\n          </form>\n        ) : (\n          <Text type=\"supporting\" color=\"secondary\">Configureer een aanmeld-URL of formulier in de editor.</Text>\n        )}\n      </VStack>\n    </Card>\n  );\n}\n\nexport const newsletterBlock = defineBlock({\n  type: \"newsletter\",\n  schema: NewsletterBlockSchema,\n  Render: NewsletterRender,\n  label: \"Nieuwsbrief\",\n  icon: \"✉️\",\n  defaults: () => ({ heading: \"Blijf op de hoogte\", buttonLabel: \"Aanmelden\" }),\n});\n"],"mappings":"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","names":[]}

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

@@ -0,0 +1,9 @@
+import { type HoursRow } from "./lib/openingHours";
+/**
+ * "Nu geopend / Nu gesloten"-badge bij openingstijden. Client-only en pas ná mount berekend
+ * (hydration-veilig: de servertijd kan afwijken van de bezoekerstijd). Toont niets wanneer de
+ * rijen niet betrouwbaar te parsen zijn — liever geen badge dan een foute.
+ */
+export declare function OpenNowBadge({ rows }: {
+    rows: HoursRow[];
+}): import("react").JSX.Element | null;

package/dist/blocks/builtins/OpenNowBadge.js

@@ -0,0 +1,20 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+import { useEffect, useState } from "react";
+import { isOpenNow } from "./lib/openingHours";
+function OpenNowBadge({ rows }) {
+  const [open, setOpen] = useState(null);
+  const rowsKey = JSON.stringify(rows);
+  useEffect(() => {
+    const parsed = JSON.parse(rowsKey);
+    setOpen(isOpenNow(parsed));
+    const id = setInterval(() => setOpen(isOpenNow(parsed)), 6e4);
+    return () => clearInterval(id);
+  }, [rowsKey]);
+  if (open === null) return null;
+  return /* @__PURE__ */ jsx("span", { className: "xicms-hours__badge", "data-open": open ? "1" : "0", children: open ? "\u25CF Nu geopend" : "\u25CF Nu gesloten" });
+}
+export {
+  OpenNowBadge
+};
+//# sourceMappingURL=OpenNowBadge.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/blocks/builtins/OpenNowBadge.tsx"],"sourcesContent":["\"use client\";\n\nimport { useEffect, useState } from \"react\";\nimport { isOpenNow, type HoursRow } from \"./lib/openingHours\";\n\n/**\n * \"Nu geopend / Nu gesloten\"-badge bij openingstijden. Client-only en pas ná mount berekend\n * (hydration-veilig: de servertijd kan afwijken van de bezoekerstijd). Toont niets wanneer de\n * rijen niet betrouwbaar te parsen zijn — liever geen badge dan een foute.\n */\nexport function OpenNowBadge({ rows }: { rows: HoursRow[] }) {\n  const [open, setOpen] = useState<boolean | null>(null);\n  // Op inhoud deppen, niet op referentie: de parent bouwt `rows` elke render opnieuw en zou de\n  // minuut-interval anders bij elke render resetten (badge die nooit ververst + effect-churn).\n  const rowsKey = JSON.stringify(rows);\n  useEffect(() => {\n    const parsed = JSON.parse(rowsKey) as HoursRow[];\n    setOpen(isOpenNow(parsed));\n    const id = setInterval(() => setOpen(isOpenNow(parsed)), 60_000);\n    return () => clearInterval(id);\n  }, [rowsKey]);\n  if (open === null) return null;\n  return (\n    <span className=\"xicms-hours__badge\" data-open={open ? \"1\" : \"0\"}>\n      {open ? \"● Nu geopend\" : \"● Nu gesloten\"}\n    </span>\n  );\n}\n"],"mappings":";AAuBI;AArBJ,SAAS,WAAW,gBAAgB;AACpC,SAAS,iBAAgC;AAOlC,SAAS,aAAa,EAAE,KAAK,GAAyB;AAC3D,QAAM,CAAC,MAAM,OAAO,IAAI,SAAyB,IAAI;AAGrD,QAAM,UAAU,KAAK,UAAU,IAAI;AACnC,YAAU,MAAM;AACd,UAAM,SAAS,KAAK,MAAM,OAAO;AACjC,YAAQ,UAAU,MAAM,CAAC;AACzB,UAAM,KAAK,YAAY,MAAM,QAAQ,UAAU,MAAM,CAAC,GAAG,GAAM;AAC/D,WAAO,MAAM,cAAc,EAAE;AAAA,EAC/B,GAAG,CAAC,OAAO,CAAC;AACZ,MAAI,SAAS,KAAM,QAAO;AAC1B,SACE,oBAAC,UAAK,WAAU,sBAAqB,aAAW,OAAO,MAAM,KAC1D,iBAAO,sBAAiB,sBAC3B;AAEJ;","names":[]}

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

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

package/dist/blocks/builtins/OpeningHours.js

@@ -0,0 +1,47 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { OpeningHoursBlockSchema } from "../../schema/blocks";
+import { defineBlock } from "../registry";
+import { Heading } from "../ui";
+import { OpenNowBadge } from "./OpenNowBadge";
+import { openingHoursSpecJsonLd } from "./lib/openingHours";
+function OpeningHoursRender({ block }) {
+  const rows = block.rows ?? [];
+  const spec = block.jsonLd ? openingHoursSpecJsonLd(rows) : [];
+  return /* @__PURE__ */ jsxs("section", { className: "xicms-hours", children: [
+    block.heading && /* @__PURE__ */ jsx(Heading, { level: 2, "data-xicms-edit": "heading", children: block.heading }),
+    block.showStatus && /* @__PURE__ */ jsx(OpenNowBadge, { rows }),
+    /* @__PURE__ */ jsx("table", { className: "xicms-hours-table", children: /* @__PURE__ */ jsx("tbody", { children: rows.map((r, i) => /* @__PURE__ */ jsxs("tr", { children: [
+      /* @__PURE__ */ jsx("th", { scope: "row", children: r.day }),
+      /* @__PURE__ */ jsx("td", { children: r.hours })
+    ] }, i)) }) }),
+    spec.length > 0 && /* @__PURE__ */ jsx(
+      "script",
+      {
+        type: "application/ld+json",
+        dangerouslySetInnerHTML: {
+          // Zelfde @id als contact-/layout-JSON-LD → Google voegt de drie samen tot één bedrijf.
+          __html: JSON.stringify({ "@context": "https://schema.org", "@type": "LocalBusiness", "@id": "#business", openingHoursSpecification: spec })
+        }
+      }
+    )
+  ] });
+}
+const openingHoursBlock = defineBlock({
+  type: "openingHours",
+  schema: OpeningHoursBlockSchema,
+  Render: OpeningHoursRender,
+  label: "Openingstijden",
+  icon: "\u{1F552}",
+  defaults: () => ({
+    heading: "Openingstijden",
+    rows: [
+      { day: "Maandag t/m vrijdag", hours: "09:00 \u2013 17:00" },
+      { day: "Zaterdag", hours: "10:00 \u2013 16:00" },
+      { day: "Zondag", hours: "Gesloten" }
+    ]
+  })
+});
+export {
+  openingHoursBlock
+};
+//# sourceMappingURL=OpeningHours.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/blocks/builtins/OpeningHours.tsx"],"sourcesContent":["import type { z } from \"zod\";\nimport { OpeningHoursBlockSchema } from \"../../schema/blocks\";\nimport { defineBlock, type BlockRenderProps } from \"../registry\";\nimport { Heading } from \"../ui\";\nimport { OpenNowBadge } from \"./OpenNowBadge\";\nimport { openingHoursSpecJsonLd } from \"./lib/openingHours\";\n\ntype OpeningHours = z.infer<typeof OpeningHoursBlockSchema>;\n\n/** Openingstijden-tabel. Server-safe; de optionele \"Nu geopend\"-badge is een client-eiland. */\nfunction OpeningHoursRender({ block }: BlockRenderProps<OpeningHours>) {\n  const rows = block.rows ?? [];\n  const spec = block.jsonLd ? openingHoursSpecJsonLd(rows) : [];\n  return (\n    <section className=\"xicms-hours\">\n      {block.heading && <Heading level={2} data-xicms-edit=\"heading\">{block.heading}</Heading>}\n      {block.showStatus && <OpenNowBadge rows={rows} />}\n      <table className=\"xicms-hours-table\">\n        <tbody>\n          {rows.map((r, i) => (\n            <tr key={i}>\n              <th scope=\"row\">{r.day}</th>\n              <td>{r.hours}</td>\n            </tr>\n          ))}\n        </tbody>\n      </table>\n      {spec.length > 0 && (\n        <script\n          type=\"application/ld+json\"\n          // eslint-disable-next-line react/no-danger\n          dangerouslySetInnerHTML={{\n            // Zelfde @id als contact-/layout-JSON-LD → Google voegt de drie samen tot één bedrijf.\n            __html: JSON.stringify({ \"@context\": \"https://schema.org\", \"@type\": \"LocalBusiness\", \"@id\": \"#business\", openingHoursSpecification: spec }),\n          }}\n        />\n      )}\n    </section>\n  );\n}\n\nexport const openingHoursBlock = defineBlock({\n  type: \"openingHours\",\n  schema: OpeningHoursBlockSchema,\n  Render: OpeningHoursRender,\n  label: \"Openingstijden\",\n  icon: \"🕒\",\n  defaults: () => ({\n    heading: \"Openingstijden\",\n    rows: [\n      { day: \"Maandag t/m vrijdag\", hours: \"09:00 – 17:00\" },\n      { day: \"Zaterdag\", hours: \"10:00 – 16:00\" },\n      { day: \"Zondag\", hours: \"Gesloten\" },\n    ],\n  }),\n});\n"],"mappings":"AAewB,cAKZ,YALY;AAdxB,SAAS,+BAA+B;AACxC,SAAS,mBAA0C;AACnD,SAAS,eAAe;AACxB,SAAS,oBAAoB;AAC7B,SAAS,8BAA8B;AAKvC,SAAS,mBAAmB,EAAE,MAAM,GAAmC;AACrE,QAAM,OAAO,MAAM,QAAQ,CAAC;AAC5B,QAAM,OAAO,MAAM,SAAS,uBAAuB,IAAI,IAAI,CAAC;AAC5D,SACE,qBAAC,aAAQ,WAAU,eAChB;AAAA,UAAM,WAAW,oBAAC,WAAQ,OAAO,GAAG,mBAAgB,WAAW,gBAAM,SAAQ;AAAA,IAC7E,MAAM,cAAc,oBAAC,gBAAa,MAAY;AAAA,IAC/C,oBAAC,WAAM,WAAU,qBACf,8BAAC,WACE,eAAK,IAAI,CAAC,GAAG,MACZ,qBAAC,QACC;AAAA,0BAAC,QAAG,OAAM,OAAO,YAAE,KAAI;AAAA,MACvB,oBAAC,QAAI,YAAE,OAAM;AAAA,SAFN,CAGT,CACD,GACH,GACF;AAAA,IACC,KAAK,SAAS,KACb;AAAA,MAAC;AAAA;AAAA,QACC,MAAK;AAAA,QAEL,yBAAyB;AAAA;AAAA,UAEvB,QAAQ,KAAK,UAAU,EAAE,YAAY,sBAAsB,SAAS,iBAAiB,OAAO,aAAa,2BAA2B,KAAK,CAAC;AAAA,QAC5I;AAAA;AAAA,IACF;AAAA,KAEJ;AAEJ;AAEO,MAAM,oBAAoB,YAAY;AAAA,EAC3C,MAAM;AAAA,EACN,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,OAAO;AAAA,EACP,MAAM;AAAA,EACN,UAAU,OAAO;AAAA,IACf,SAAS;AAAA,IACT,MAAM;AAAA,MACJ,EAAE,KAAK,uBAAuB,OAAO,qBAAgB;AAAA,MACrD,EAAE,KAAK,YAAY,OAAO,qBAAgB;AAAA,MAC1C,EAAE,KAAK,UAAU,OAAO,WAAW;AAAA,IACrC;AAAA,EACF;AACF,CAAC;","names":[]}

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

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