@sevenfold/setto-client 0.34.0 → 0.36.0

package/dist/setto-client.js

@@ -21461,8 +21461,9 @@ class ThemeStore {
 }
 const PAGES_MANIFEST_VERSION = 1;
 const PAGES_PATH = "src/content/pages.json";
-const BUILTIN_SECTION_TYPES = ["text"];
+const BUILTIN_SECTION_TYPES = ["text", "blog", "blog-latest"];
 const ID = /^[a-z0-9][a-z0-9-]{0,62}$/;
+const POST_SLUG = /^[a-z0-9]+(?:-[a-z0-9]+)*$/;
 const PATH = /^\/(?:[a-z0-9][a-z0-9-]*(?:\/[a-z0-9][a-z0-9-]*)*)?$/;
 function isRecord$1(value) {
   return typeof value === "object" && value !== null && !Array.isArray(value);
@@ -21529,6 +21530,15 @@ function parseManifest(input) {
       sections
     });
   });
+  const blogs = pages.flatMap(
+    (p, i) => p.sections.flatMap((s, j) => s.type === "blog" ? [{ page: p, at: `pages[${i}].sections[${j}]` }] : [])
+  );
+  if (blogs.length > 1) {
+    issues.push({ at: blogs[1].at, message: "a site has one blog; another blog section is already on a page" });
+  }
+  for (const blog of blogs) {
+    if (blog.page.path === "/") issues.push({ at: blog.at, message: "the blog cannot be the front page" });
+  }
   const menu = parseMenu(input.menu, "menu", issues);
   const footer2 = parseMenu(input.footer, "footer", issues);
   if (issues.length > 0) return { ok: false, issues };
@@ -21572,7 +21582,23 @@ function normalisePath(path2) {
 }
 function pageForPath(manifest, path2) {
   const wanted = normalisePath(path2);
-  return manifest.pages.find((p) => p.path === wanted) ?? null;
+  return manifest.pages.find((p) => p.path === wanted) ?? (blogSlugForPath(manifest, path2) ? blogPage(manifest).page : null);
+}
+function blogPage(manifest) {
+  for (const page of manifest.pages) {
+    const section = page.sections.find((s) => s.type === "blog");
+    if (section) return { page, section };
+  }
+  return null;
+}
+function blogSlugForPath(manifest, path2) {
+  const blog = blogPage(manifest);
+  if (!blog || blog.page.path === "/") return null;
+  const wanted = normalisePath(path2);
+  const prefix = `${blog.page.path}/`;
+  if (!wanted.startsWith(prefix)) return null;
+  const slug = wanted.slice(prefix.length);
+  return slug.length <= 80 && POST_SLUG.test(slug) ? slug : null;
 }
 function pageById(manifest, id) {
   return manifest.pages.find((p) => p.id === id) ?? null;
@@ -22124,7 +22150,7 @@ function withoutCheckoutIntent() {
 }
 const FAB_SIZE = 52;
 const FAB_INSET = 16;
-const STYLE_ID$2 = "setto-edit-layout";
+const STYLE_ID$3 = "setto-edit-layout";
 const HTML_CLASS = "setto-edit-mode";
 function useSettoDocumentLayout(active) {
   useEffect(() => {
@@ -22133,10 +22159,10 @@ function useSettoDocumentLayout(active) {
     html2.classList.add(HTML_CLASS);
     html2.style.setProperty("--setto-fab-size", `${FAB_SIZE}px`);
     html2.style.setProperty("--setto-fab-inset", `${FAB_INSET}px`);
-    let styleEl = document.getElementById(STYLE_ID$2);
+    let styleEl = document.getElementById(STYLE_ID$3);
     if (!styleEl) {
       styleEl = document.createElement("style");
-      styleEl.id = STYLE_ID$2;
+      styleEl.id = STYLE_ID$3;
       styleEl.textContent = `
         html.setto-edit-mode {
           width: 100%;
@@ -33040,7 +33066,7 @@ function formatHeadingAsSetext(node2, state) {
   );
 }
 function heading(node2, _, state, info) {
-  const rank = Math.max(Math.min(6, node2.depth || 1), 1);
+  const rank2 = Math.max(Math.min(6, node2.depth || 1), 1);
   const tracker = state.createTracker(info);
   if (formatHeadingAsSetext(node2, state)) {
     const exit3 = state.enter("headingSetext");
@@ -33052,14 +33078,14 @@ function heading(node2, _, state, info) {
     });
     subexit2();
     exit3();
-    return value2 + "\n" + (rank === 1 ? "=" : "-").repeat(
+    return value2 + "\n" + (rank2 === 1 ? "=" : "-").repeat(
       // The whole size…
       value2.length - // Minus the position of the character after the last EOL (or
       // 0 if there is none)…
       (Math.max(value2.lastIndexOf("\r"), value2.lastIndexOf("\n")) + 1)
     );
   }
-  const sequence = "#".repeat(rank);
+  const sequence = "#".repeat(rank2);
   const exit2 = state.enter("headingAtx");
   const subexit = state.enter("phrasing");
   tracker.move(sequence + " ");
@@ -37714,6 +37740,18 @@ function SettoIcon({ k, icons, size = 24, className, style }) {
     )
   ] });
 }
+const SETTO_MEDIA_HOST = "3adyw42hy72dtzjo.public.blob.vercel-storage.com";
+const SETTO_MEDIA_BLOG_PREFIX = "/blog/";
+function isSettoMediaUrl(src) {
+  if (!src) return false;
+  try {
+    const url = new URL(src);
+    return url.protocol === "https:" && url.hostname === SETTO_MEDIA_HOST && !url.username && !url.password && url.port === "" && url.pathname.startsWith(SETTO_MEDIA_BLOG_PREFIX);
+  } catch {
+    return false;
+  }
+}
+const escapeRegExp = (value) => value.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
 const SETTO_IMAGE_WIDTHS = [384, 640, 828, 1080, 1440, 1920, 2560];
 const SETTO_IMAGE_QUALITY = 75;
 const settoVercelImagesConfig = {
@@ -37721,12 +37759,23 @@ const settoVercelImagesConfig = {
   qualities: [SETTO_IMAGE_QUALITY],
   formats: ["image/avif", "image/webp"],
   localPatterns: [{ pathname: "^/images/.*$", search: "" }],
+  // Vercel reads hostname and pathname as regular expressions; anchored so a
+  // look-alike host cannot borrow the optimizer. Checked on a deployment
+  // (R24): this form resizes, an unlisted host or path is refused with 400.
+  remotePatterns: [
+    {
+      protocol: "https",
+      hostname: `^${escapeRegExp(SETTO_MEDIA_HOST)}$`,
+      pathname: `^${escapeRegExp(SETTO_MEDIA_BLOG_PREFIX)}.*$`
+    }
+  ],
   minimumCacheTTL: 2678400
 };
 const OPTIMIZABLE = /\.(jpe?g|png|webp|avif)$/i;
 function isOptimizable(src) {
-  if (!src || !src.startsWith("/images/")) return false;
-  return OPTIMIZABLE.test(src.split(/[?#]/)[0]);
+  if (!src) return false;
+  if (src.startsWith("/images/")) return OPTIMIZABLE.test(src.split(/[?#]/)[0]);
+  return isSettoMediaUrl(src) && OPTIMIZABLE.test(new URL(src).pathname);
 }
 function hasNoOptimizer(hostname) {
   return hostname === "localhost" || hostname === "127.0.0.1" || hostname === "[::1]" || hostname.endsWith(".localhost");
@@ -37980,12 +38029,12 @@ function SettoImage({ srcKey, alt, className, style, ...rest }) {
     )
   ] });
 }
-const STYLE_ID$1 = "setto-repeater-styles";
+const STYLE_ID$2 = "setto-repeater-styles";
 function useRepeaterStyles() {
   useEffect(() => {
-    if (document.getElementById(STYLE_ID$1)) return;
+    if (document.getElementById(STYLE_ID$2)) return;
     const el = document.createElement("style");
-    el.id = STYLE_ID$1;
+    el.id = STYLE_ID$2;
     el.textContent = `
       .setto-repeater-remove {
         opacity: 0;
@@ -38111,6 +38160,695 @@ const removeBtnStyle = {
   boxShadow: "0 1px 4px rgba(0,0,0,0.18)",
   fontFamily: 'system-ui, -apple-system, "Segoe UI", sans-serif'
 };
+function usePageManifest() {
+  const { pageStore, config } = useSetto();
+  const snap = useSyncExternalStore(
+    (cb) => pageStore?.subscribe(() => cb()) ?? (() => {
+    }),
+    () => pageStore?.snapshot() ?? EMPTY_PAGE_STORE_SNAPSHOT,
+    () => pageStore?.snapshot() ?? EMPTY_PAGE_STORE_SNAPSHOT
+  );
+  return pageStore ? snap.manifest : bundledManifest(config.pages);
+}
+function useSettoMenu(list2 = "menu") {
+  const manifest = usePageManifest();
+  return manifest ? visibleMenu(manifest, list2) : null;
+}
+function SettoPage({ pageId, path: path2, sections = {}, builtins, fallback = null }) {
+  const manifest = usePageManifest();
+  const { editMode } = useSetto();
+  if (!manifest) {
+    if (!pageId && path2 !== void 0 && path2 !== "/" && path2 !== "") return /* @__PURE__ */ jsx(Fragment, { children: fallback });
+    return /* @__PURE__ */ jsx(Fragment, { children: Object.entries(sections).map(([id, Component]) => /* @__PURE__ */ jsx(Component, {}, id)) });
+  }
+  const page = pageId ? pageById(manifest, pageId) : pageForPath(manifest, path2 ?? "/");
+  if (!page) {
+    if (pageId) {
+      return /* @__PURE__ */ jsx(Fragment, { children: Object.entries(sections).map(([id, Component]) => /* @__PURE__ */ jsx(Component, {}, id)) });
+    }
+    return /* @__PURE__ */ jsx(Fragment, { children: fallback });
+  }
+  if (page.hidden && !editMode) return /* @__PURE__ */ jsx(Fragment, { children: fallback });
+  return /* @__PURE__ */ jsx(PageBody, { page, sections, builtins, editMode, manifest });
+}
+function PageBody({
+  page,
+  sections,
+  builtins,
+  editMode,
+  manifest
+}) {
+  usePageTitle(page);
+  const HiddenPageNote = useSettoChromeSlot("hidden-page");
+  const listed = new Set(manifest.pages.flatMap((p) => p.sections.map((s) => s.id)));
+  const unlisted = Object.keys(sections).filter((id) => !listed.has(id));
+  const firstVisible = page.sections.find((s) => !s.hidden && (s.type || sections[s.id]))?.id;
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    page.hidden && editMode ? HiddenPageNote ? /* @__PURE__ */ jsx(HiddenPageNote, { pageId: page.id }) : /* @__PURE__ */ jsx(HiddenNote, { text: "Denne siden er skjult for besøkende." }) : null,
+    page.sections.map((section) => /* @__PURE__ */ jsx(Fragment$1, { children: renderSection(section, sections, builtins, editMode, section.id === firstVisible) }, section.id)),
+    unlisted.map((id) => {
+      const Component = sections[id];
+      return /* @__PURE__ */ jsx(Component, {}, id);
+    })
+  ] });
+}
+function renderSection(section, sections, builtins, editMode, first) {
+  if (section.hidden) {
+    return editMode ? /* @__PURE__ */ jsx(HiddenSection, { section }) : null;
+  }
+  if (section.type) {
+    const Builtin = builtins?.[section.type] ?? BUILTIN_RENDERERS[section.type];
+    return /* @__PURE__ */ jsx(Builtin, { sectionId: section.id, first });
+  }
+  const Component = sections[section.id];
+  if (!Component) {
+    warnOnce(section.id);
+    return null;
+  }
+  return /* @__PURE__ */ jsx(Component, {});
+}
+const warned = /* @__PURE__ */ new Set();
+function warnOnce(id) {
+  if (warned.has(id)) return;
+  warned.add(id);
+  console.warn(`[setto] section "${id}" is in pages.json but the page does not provide it`);
+}
+function HiddenSection({ section }) {
+  const { pageStore } = useSetto();
+  const Offered = useSettoChromeSlot("hidden-section");
+  const label = section.label ?? section.id;
+  if (Offered) return /* @__PURE__ */ jsx(Offered, { sectionId: section.id, label });
+  return /* @__PURE__ */ jsxs("div", { "data-setto-ui": true, style: hiddenBarStyle, children: [
+    /* @__PURE__ */ jsxs("span", { children: [
+      "Skjult: ",
+      label
+    ] }),
+    pageStore ? /* @__PURE__ */ jsx(
+      "button",
+      {
+        type: "button",
+        "data-setto-ui": true,
+        style: hiddenBtnStyle,
+        onClick: () => pageStore.apply([{ op: "show_section", sectionId: section.id }]),
+        children: "Vis"
+      }
+    ) : null
+  ] });
+}
+function HiddenNote({ text: text2 }) {
+  return /* @__PURE__ */ jsx("div", { "data-setto-ui": true, style: hiddenBarStyle, children: /* @__PURE__ */ jsx("span", { children: text2 }) });
+}
+function usePageTitle(page) {
+  const { t } = useTranslation();
+  const original = useRef(null);
+  const title = page.path === "/" ? null : t(page.titleKey);
+  useEffect(() => {
+    if (!title || typeof document === "undefined") return;
+    original.current ??= document.title;
+    const base = original.current;
+    document.title = base ? `${title} · ${base}` : title;
+    return () => {
+      document.title = base;
+    };
+  }, [title]);
+}
+function SettoTextSection({ sectionId, first }) {
+  const keys2 = builtinKeys(sectionId);
+  const { i18n } = useTranslation();
+  const { store, editMode } = useSetto();
+  const intro2 = store ? store.get(keys2.intro, i18n.language) : i18n.t(keys2.intro, { defaultValue: "" });
+  const Heading = first ? "h1" : "h2";
+  return /* @__PURE__ */ jsx(SettoSection, { sectionId, style: textSectionStyle, children: /* @__PURE__ */ jsxs("div", { style: textInnerStyle, children: [
+    /* @__PURE__ */ jsx(Heading, { style: first ? textH1Style : textH2Style, children: /* @__PURE__ */ jsx(T, { k: keys2.heading }) }),
+    intro2 || editMode ? /* @__PURE__ */ jsx("p", { style: textIntroStyle, children: /* @__PURE__ */ jsx(T, { k: keys2.intro }) }) : null,
+    /* @__PURE__ */ jsx(
+      SettoRepeater,
+      {
+        itemsKey: keys2.items,
+        defaultItem: { heading: "Overskrift", text: "Tekst" },
+        itemLabel: "avsnitt",
+        children: (itemKey) => /* @__PURE__ */ jsx(TextItem, { sectionId, itemKey })
+      }
+    )
+  ] }) });
+}
+function TextItem({ sectionId, itemKey }) {
+  const keys2 = builtinKeys(sectionId);
+  const { i18n } = useTranslation();
+  const { store, editMode } = useSetto();
+  const heading2 = store ? store.get(keys2.itemHeading(itemKey), i18n.language) : i18n.t(keys2.itemHeading(itemKey), { defaultValue: "" });
+  return /* @__PURE__ */ jsxs("div", { style: textItemStyle, children: [
+    heading2 || editMode ? /* @__PURE__ */ jsx("h3", { style: textH3Style, children: /* @__PURE__ */ jsx(T, { k: keys2.itemHeading(itemKey) }) }) : null,
+    /* @__PURE__ */ jsx("p", { style: textParagraphStyle, children: /* @__PURE__ */ jsx(T, { k: keys2.itemText(itemKey) }) })
+  ] });
+}
+const BUILTIN_RENDERERS = {
+  text: SettoTextSection,
+  blog: SettoBlogSection,
+  "blog-latest": SettoBlogLatest
+};
+const textSectionStyle = { padding: "clamp(48px, 8vw, 96px) 16px" };
+const textInnerStyle = { maxWidth: "68ch", margin: "0 auto" };
+const textH1Style = {
+  fontFamily: "var(--setto-display-font, inherit)",
+  fontSize: "clamp(2rem, 4vw, 2.75rem)",
+  lineHeight: 1.15,
+  fontWeight: 600,
+  margin: "0 0 0.75em"
+};
+const textH2Style = { ...textH1Style, fontSize: "clamp(1.5rem, 3vw, 2rem)" };
+const textH3Style = {
+  fontFamily: "var(--setto-display-font, inherit)",
+  fontSize: "1.125rem",
+  lineHeight: 1.3,
+  fontWeight: 600,
+  margin: "0 0 0.4em"
+};
+const textIntroStyle = { fontSize: "1.125rem", lineHeight: 1.6, opacity: 0.85, margin: "0 0 2em" };
+const textItemStyle = { margin: "0 0 1.75em" };
+const textParagraphStyle = { lineHeight: 1.7, margin: 0, whiteSpace: "pre-line" };
+const hiddenBarStyle = {
+  display: "flex",
+  alignItems: "center",
+  justifyContent: "center",
+  gap: 12,
+  padding: "10px 16px",
+  margin: "4px 0",
+  border: "1px dashed rgba(100, 10, 255, 0.45)",
+  borderRadius: 8,
+  background: "rgba(100, 10, 255, 0.05)",
+  color: "#3b2a66",
+  font: '500 13px system-ui, -apple-system, "Segoe UI", sans-serif'
+};
+const hiddenBtnStyle = {
+  border: "none",
+  borderRadius: 999,
+  padding: "4px 12px",
+  background: "#640AFF",
+  color: "#fff",
+  font: '600 12px system-ui, -apple-system, "Segoe UI", sans-serif',
+  cursor: "pointer"
+};
+const BLOG_ROUTE = "/blogg";
+const BLOG_SLUG_PATTERN = /^[a-z0-9]+(?:-[a-z0-9]+)*$/;
+const BLOG_SLUG_MAX = 80;
+const YOUTUBE_ID_PATTERN = /^[A-Za-z0-9_-]{11}$/;
+function isValidBlogSlug(slug) {
+  return slug.length <= BLOG_SLUG_MAX && BLOG_SLUG_PATTERN.test(slug);
+}
+function byDateDesc(a, b) {
+  return a.date === b.date ? a.slug.localeCompare(b.slug) : a.date < b.date ? 1 : -1;
+}
+function postsForLanguage(posts, language, fallbackLanguage) {
+  const bySlug = /* @__PURE__ */ new Map();
+  for (const post2 of posts) {
+    const current = bySlug.get(post2.slug);
+    if (!current || rank(post2, language, fallbackLanguage) < rank(current, language, fallbackLanguage)) {
+      bySlug.set(post2.slug, post2);
+    }
+  }
+  return [...bySlug.values()].sort(byDateDesc);
+}
+function postForSlug(posts, slug, language, fallbackLanguage) {
+  return postsForLanguage(posts.filter((p) => p.slug === slug), language, fallbackLanguage)[0] ?? null;
+}
+function rank(post2, language, fallbackLanguage) {
+  if (post2.locale === language) return 0;
+  if (post2.locale === fallbackLanguage) return 1;
+  return 2;
+}
+function formatPostDate(date, language) {
+  const parsed = /* @__PURE__ */ new Date(`${date}T12:00:00Z`);
+  if (Number.isNaN(parsed.getTime())) return date;
+  const locale = language === "no" || language === "nb" || language === "nn" ? "nb-NO" : language;
+  try {
+    return new Intl.DateTimeFormat(locale, { day: "numeric", month: "long", year: "numeric", timeZone: "UTC" }).format(parsed);
+  } catch {
+    return date;
+  }
+}
+const NO = {
+  blog: "Blogg",
+  latest: "Fra bloggen",
+  allPosts: "Alle innlegg",
+  readMore: "Les mer",
+  back: "Alle innlegg",
+  empty: "Ingen innlegg ennå.",
+  notFound: "Fant ikke innlegget.",
+  loading: "Henter innlegget …",
+  share: "Del",
+  moreShare: "Flere valg …",
+  copyLink: "Kopier lenke",
+  copied: "Lenken er kopiert",
+  email: "E-post",
+  video: "Video",
+  play: "Spill av"
+};
+const EN = {
+  blog: "Blog",
+  latest: "From the blog",
+  allPosts: "All posts",
+  readMore: "Read more",
+  back: "All posts",
+  empty: "No posts yet.",
+  notFound: "That post could not be found.",
+  loading: "Loading the post …",
+  share: "Share",
+  moreShare: "More …",
+  copyLink: "Copy link",
+  copied: "Link copied",
+  email: "Email",
+  video: "Video",
+  play: "Play"
+};
+function blogStrings(language) {
+  return language === "no" || language === "nb" || language === "nn" ? NO : EN;
+}
+function BlogBody({ nodes, language }) {
+  return /* @__PURE__ */ jsx(Fragment, { children: nodes.map((node2, i) => renderFlow(node2, i, language)) });
+}
+function renderFlow(node2, key, language) {
+  switch (node2.type) {
+    case "paragraph":
+      return /* @__PURE__ */ jsx("p", { children: renderPhrasing(node2.children) }, key);
+    case "heading": {
+      const Tag = node2.depth === 2 ? "h2" : node2.depth === 3 ? "h3" : "h4";
+      return /* @__PURE__ */ jsx(Tag, { children: renderPhrasing(node2.children) }, key);
+    }
+    case "list": {
+      const items = node2.children.map((item, i) => /* @__PURE__ */ jsx("li", { children: item.children.map((child, j) => renderListChild(child, j, item.spread === true, language)) }, i));
+      return node2.ordered ? /* @__PURE__ */ jsx("ol", { start: node2.start ?? void 0, children: items }, key) : /* @__PURE__ */ jsx("ul", { children: items }, key);
+    }
+    case "blockquote":
+      return /* @__PURE__ */ jsx("blockquote", { children: node2.children.map((child, i) => renderFlow(child, i, language)) }, key);
+    case "thematicBreak":
+      return /* @__PURE__ */ jsx("hr", {}, key);
+    case "code":
+      return /* @__PURE__ */ jsx("pre", { children: /* @__PURE__ */ jsx("code", { children: node2.value }) }, key);
+    case "table":
+      return /* @__PURE__ */ jsx(BlogTable, { table: node2 }, key);
+    case "mdxJsxFlowElement":
+      return /* @__PURE__ */ jsx(BlogComponent, { element: node2, language }, key);
+    default:
+      return null;
+  }
+}
+function renderListChild(child, key, spread, language) {
+  if (child.type === "paragraph" && !spread) return /* @__PURE__ */ jsx("span", { children: renderPhrasing(child.children) }, key);
+  return renderFlow(child, key, language);
+}
+function renderPhrasing(children) {
+  return children.map((child, i) => {
+    switch (child.type) {
+      case "text":
+        return child.value;
+      case "emphasis":
+        return /* @__PURE__ */ jsx("em", { children: renderPhrasing(child.children) }, i);
+      case "strong":
+        return /* @__PURE__ */ jsx("strong", { children: renderPhrasing(child.children) }, i);
+      case "delete":
+        return /* @__PURE__ */ jsx("del", { children: renderPhrasing(child.children) }, i);
+      case "inlineCode":
+        return /* @__PURE__ */ jsx("code", { children: child.value }, i);
+      case "break":
+        return /* @__PURE__ */ jsx("br", {}, i);
+      case "link": {
+        const safe = isSafeHref(child.url);
+        if (!safe) return /* @__PURE__ */ jsx("span", { children: renderPhrasing(child.children) }, i);
+        const external = /^https?:\/\//i.test(child.url);
+        return /* @__PURE__ */ jsx("a", { href: child.url, ...external ? { rel: "noopener noreferrer" } : {}, children: renderPhrasing(child.children) }, i);
+      }
+      default:
+        return null;
+    }
+  });
+}
+function BlogTable({ table: table2 }) {
+  const [head2, ...rows] = table2.children;
+  const align = (i) => table2.align?.[i] ?? void 0;
+  return /* @__PURE__ */ jsx("div", { className: "setto-blog__table", children: /* @__PURE__ */ jsxs("table", { children: [
+    head2 ? /* @__PURE__ */ jsx("thead", { children: /* @__PURE__ */ jsx("tr", { children: head2.children.map((cell, i) => /* @__PURE__ */ jsx("th", { style: { textAlign: align(i) }, children: renderPhrasing(cell.children) }, i)) }) }) : null,
+    /* @__PURE__ */ jsx("tbody", { children: rows.map((row, r) => /* @__PURE__ */ jsx("tr", { children: row.children.map((cell, i) => /* @__PURE__ */ jsx("td", { style: { textAlign: align(i) }, children: renderPhrasing(cell.children) }, i)) }, r)) })
+  ] }) });
+}
+function attrs(element2) {
+  const out = {};
+  for (const attribute of element2.attributes) {
+    const a = attribute;
+    if (a.type === "mdxJsxAttribute" && typeof a.value === "string") out[a.name] = a.value;
+  }
+  return out;
+}
+function BlogComponent({ element: element2, language }) {
+  const props = attrs(element2);
+  switch (element2.name) {
+    case "Image":
+      return props.src && props.alt !== void 0 ? /* @__PURE__ */ jsxs("figure", { className: "setto-blog__figure", children: [
+        /* @__PURE__ */ jsx(BlogImg, { src: props.src, alt: props.alt, sizes: "(min-width: 760px) 720px, 100vw" }),
+        props.caption ? /* @__PURE__ */ jsx("figcaption", { children: props.caption }) : null
+      ] }) : null;
+    case "Gallery": {
+      const images = element2.children.filter(
+        (child) => child.type === "mdxJsxFlowElement" && child.name === "Image"
+      );
+      return /* @__PURE__ */ jsxs("figure", { className: "setto-blog__gallery", children: [
+        /* @__PURE__ */ jsx("div", { className: "setto-blog__gallery-grid", children: images.map((image2, i) => {
+          const a = attrs(image2);
+          return a.src ? /* @__PURE__ */ jsxs("figure", { className: "setto-blog__gallery-item", children: [
+            /* @__PURE__ */ jsx(BlogImg, { src: a.src, alt: a.alt ?? "", sizes: "(min-width: 760px) 360px, 50vw" }),
+            a.caption ? /* @__PURE__ */ jsx("figcaption", { children: a.caption }) : null
+          ] }, i) : null;
+        }) }),
+        props.caption ? /* @__PURE__ */ jsx("figcaption", { children: props.caption }) : null
+      ] });
+    }
+    case "YouTube":
+      return props.id && YOUTUBE_ID_PATTERN.test(props.id) ? /* @__PURE__ */ jsx(YouTubeEmbed, { id: props.id, title: props.title, language }) : null;
+    case "Callout":
+      return /* @__PURE__ */ jsx("aside", { className: "setto-blog__callout", "data-tone": props.tone ?? "info", children: element2.children.map((child, i) => renderFlow(child, i, language)) });
+    default:
+      return null;
+  }
+}
+function BlogImg({ src, alt, sizes, className }) {
+  const { config } = useSetto();
+  const [failed, setFailed] = useState(false);
+  const optimize = config.images?.optimize === true && !failed && isOptimizable(src) && !(typeof window !== "undefined" && hasNoOptimizer(window.location.hostname));
+  if (!optimize) return /* @__PURE__ */ jsx("img", { src, alt, loading: "lazy", decoding: "async", className });
+  return /* @__PURE__ */ jsx(
+    "img",
+    {
+      src: optimizedUrl(src, 1080),
+      srcSet: optimizedSrcSet(src),
+      sizes,
+      alt,
+      loading: "lazy",
+      decoding: "async",
+      className,
+      onError: () => setFailed(true)
+    }
+  );
+}
+function YouTubeEmbed({ id, title, language }) {
+  const [playing, setPlaying] = useState(false);
+  const strings = blogStrings(language);
+  const label = title ?? strings.video;
+  return /* @__PURE__ */ jsxs("figure", { className: "setto-blog__video", children: [
+    /* @__PURE__ */ jsx("div", { className: "setto-blog__video-frame", children: playing ? /* @__PURE__ */ jsx(
+      "iframe",
+      {
+        src: `https://www.youtube-nocookie.com/embed/${id}?autoplay=1&rel=0`,
+        title: label,
+        allow: "accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture",
+        allowFullScreen: true,
+        referrerPolicy: "strict-origin-when-cross-origin"
+      }
+    ) : /* @__PURE__ */ jsxs("button", { type: "button", className: "setto-blog__video-play", onClick: () => setPlaying(true), "aria-label": `${strings.play}: ${label}`, children: [
+      /* @__PURE__ */ jsx("img", { src: `https://i.ytimg.com/vi/${id}/hqdefault.jpg`, alt: "", loading: "lazy", decoding: "async" }),
+      /* @__PURE__ */ jsx("span", { "aria-hidden": "true", className: "setto-blog__video-icon", children: /* @__PURE__ */ jsxs("svg", { viewBox: "0 0 68 48", width: "68", height: "48", children: [
+        /* @__PURE__ */ jsx("path", { d: "M66.5 7.7A8.5 8.5 0 0 0 60.5 1.7C55.2.3 34 .3 34 .3s-21.2 0-26.5 1.4A8.5 8.5 0 0 0 1.5 7.7C.1 13 .1 24 .1 24s0 11 1.4 16.3a8.5 8.5 0 0 0 6 6c5.3 1.4 26.5 1.4 26.5 1.4s21.2 0 26.5-1.4a8.5 8.5 0 0 0 6-6C67.9 35 67.9 24 67.9 24s0-11-1.4-16.3z", fill: "#f00" }),
+        /* @__PURE__ */ jsx("path", { d: "M45 24 27 14v20", fill: "#fff" })
+      ] }) })
+    ] }) }),
+    title ? /* @__PURE__ */ jsx("figcaption", { children: title }) : null
+  ] });
+}
+const LATEST_COUNT = 3;
+function useBlogContext() {
+  const { config } = useSetto();
+  const { i18n, t } = useTranslation();
+  const manifest = usePageManifest();
+  const language = i18n.language || config.languages?.[0] || "no";
+  const fallbackLanguage = config.languages?.[0] ?? "no";
+  const route = typeof window === "undefined" ? { basename: "", rest: "/" } : languageFromPath(window.location.pathname, config.languages ?? [fallbackLanguage]);
+  const href = (path2) => `${route.basename}${path2}`;
+  return { config, t, manifest, language, fallbackLanguage, strings: blogStrings(language), path: route.rest, href };
+}
+function blogPathOf(manifest) {
+  return manifest && blogPage(manifest)?.page.path || BLOG_ROUTE;
+}
+function SettoBlogSection({ sectionId, first }) {
+  useBlogStyles();
+  const ctx = useBlogContext();
+  const slug = ctx.manifest ? blogSlugForPath(ctx.manifest, ctx.path) : null;
+  const page = ctx.manifest ? findSection(ctx.manifest, sectionId)?.page : void 0;
+  const title = page ? ctx.t(page.titleKey, { defaultValue: ctx.strings.blog }) : ctx.strings.blog;
+  const blogPath = blogPathOf(ctx.manifest);
+  const inner = useRef(null);
+  const clear = useClearFixedHeader(inner, first);
+  return /* @__PURE__ */ jsx(SettoSection, { sectionId, className: "setto-blog", children: /* @__PURE__ */ jsx("div", { className: "setto-blog__inner", ref: inner, style: clear ? { paddingTop: clear } : void 0, children: slug ? /* @__PURE__ */ jsx(BlogPostView, { slug, blogPath, ctx }) : /* @__PURE__ */ jsx(BlogIndexView, { title, first, blogPath, ctx }) }) });
+}
+function SettoBlog({ basePath = BLOG_ROUTE, title }) {
+  useBlogStyles();
+  const ctx = useBlogContext();
+  const base = normalisePath(basePath);
+  const here = normalisePath(ctx.path);
+  const rest = here.startsWith(`${base}/`) ? here.slice(base.length + 1) : "";
+  const slug = rest && isValidBlogSlug(rest) ? rest : null;
+  const inner = useRef(null);
+  const clear = useClearFixedHeader(inner, true);
+  return /* @__PURE__ */ jsx("section", { className: "setto-blog", children: /* @__PURE__ */ jsx("div", { className: "setto-blog__inner", ref: inner, style: clear ? { paddingTop: clear } : void 0, children: slug ? /* @__PURE__ */ jsx(BlogPostView, { slug, blogPath: base, ctx }) : /* @__PURE__ */ jsx(BlogIndexView, { title: title ?? ctx.strings.blog, first: true, blogPath: base, ctx }) }) });
+}
+function useClearFixedHeader(ref, enabled) {
+  const [clear, setClear] = useState(0);
+  useLayoutEffect(() => {
+    if (!enabled || typeof window === "undefined") return;
+    const measure = () => {
+      const el = ref.current;
+      if (!el) return;
+      const covering = document.elementsFromPoint(window.innerWidth / 2, 1).map((node2) => fixedAncestor(node2)).find((node2) => node2 !== null && !node2.contains(el));
+      const headerBottom = covering ? covering.getBoundingClientRect().bottom : 0;
+      const start = el.getBoundingClientRect().top + window.scrollY;
+      const overlap = Math.ceil(headerBottom + 16 - start);
+      setClear(overlap > 0 ? overlap : 0);
+    };
+    measure();
+    window.addEventListener("resize", measure);
+    return () => window.removeEventListener("resize", measure);
+  }, [ref, enabled]);
+  return clear;
+}
+function fixedAncestor(node2) {
+  for (let at = node2; at && at !== document.body; at = at.parentElement) {
+    if (getComputedStyle(at).position === "fixed") return at;
+  }
+  return null;
+}
+function BlogIndexView({ title, first, blogPath, ctx }) {
+  const posts = ctx.config.blog ? postsForLanguage(ctx.config.blog.posts, ctx.language, ctx.fallbackLanguage) : [];
+  const Heading = first ? "h1" : "h2";
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(Heading, { className: "setto-blog__title", children: title }),
+    posts.length === 0 ? /* @__PURE__ */ jsx("p", { className: "setto-blog__empty", children: ctx.strings.empty }) : /* @__PURE__ */ jsx("div", { className: "setto-blog__list", children: posts.map((post2) => /* @__PURE__ */ jsx(PostCard, { post: post2, blogPath, ctx, headingLevel: first ? "h2" : "h3" }, post2.slug)) })
+  ] });
+}
+function PostCard({
+  post: post2,
+  blogPath,
+  ctx,
+  headingLevel
+}) {
+  const Heading = headingLevel;
+  const href = ctx.href(`${blogPath}/${post2.slug}`);
+  return /* @__PURE__ */ jsxs("article", { className: "setto-blog__card", children: [
+    post2.cover ? /* @__PURE__ */ jsx("a", { href, className: "setto-blog__card-cover", tabIndex: -1, "aria-hidden": "true", children: /* @__PURE__ */ jsx(BlogImg, { src: post2.cover, alt: "", sizes: "(min-width: 960px) 360px, (min-width: 640px) 50vw, 100vw" }) }) : null,
+    /* @__PURE__ */ jsxs("div", { className: "setto-blog__card-body", children: [
+      /* @__PURE__ */ jsx("time", { className: "setto-blog__date", dateTime: post2.date, children: formatPostDate(post2.date, ctx.language) }),
+      /* @__PURE__ */ jsx(Heading, { className: "setto-blog__card-title", children: /* @__PURE__ */ jsx("a", { href, children: post2.title }) }),
+      /* @__PURE__ */ jsx("p", { className: "setto-blog__card-lead", children: post2.description }),
+      /* @__PURE__ */ jsxs("a", { href, className: "setto-blog__more", "aria-label": `${ctx.strings.readMore}: ${post2.title}`, children: [
+        ctx.strings.readMore,
+        " ",
+        /* @__PURE__ */ jsx("span", { "aria-hidden": "true", children: "→" })
+      ] })
+    ] })
+  ] });
+}
+function BlogPostView({ slug, blogPath, ctx }) {
+  const blog = ctx.config.blog;
+  const summary = blog ? postForSlug(blog.posts, slug, ctx.language, ctx.fallbackLanguage) : null;
+  const [post2, setPost] = useState(null);
+  const [state, setState] = useState(summary ? "loading" : "missing");
+  useEffect(() => {
+    if (!blog || !summary) {
+      setState("missing");
+      return;
+    }
+    let live = true;
+    setState("loading");
+    blog.load(summary.slug, summary.locale).then((loaded) => {
+      if (!live) return;
+      setPost(loaded);
+      setState(loaded ? "ready" : "missing");
+    }).catch(() => live && setState("missing"));
+    return () => {
+      live = false;
+    };
+  }, [blog, summary?.slug, summary?.locale]);
+  usePostTitle(summary?.title ?? null, ctx.config.displayName);
+  const back = /* @__PURE__ */ jsxs("a", { href: ctx.href(blogPath), className: "setto-blog__back", children: [
+    /* @__PURE__ */ jsx("span", { "aria-hidden": "true", children: "←" }),
+    " ",
+    ctx.strings.back
+  ] });
+  if (!summary || state === "missing") {
+    return /* @__PURE__ */ jsxs("div", { className: "setto-blog__post", children: [
+      back,
+      /* @__PURE__ */ jsx("p", { className: "setto-blog__empty", children: ctx.strings.notFound })
+    ] });
+  }
+  const fm = post2?.frontmatter ?? summary;
+  return /* @__PURE__ */ jsxs("article", { className: "setto-blog__post", lang: fm.locale, children: [
+    back,
+    /* @__PURE__ */ jsxs("header", { className: "setto-blog__post-header", children: [
+      /* @__PURE__ */ jsx("time", { className: "setto-blog__date", dateTime: fm.date, children: formatPostDate(fm.date, ctx.language) }),
+      /* @__PURE__ */ jsx("h1", { className: "setto-blog__post-title", children: fm.title }),
+      /* @__PURE__ */ jsx("p", { className: "setto-blog__lead", children: fm.description })
+    ] }),
+    fm.cover ? /* @__PURE__ */ jsx("figure", { className: "setto-blog__cover", children: /* @__PURE__ */ jsx(BlogImg, { src: fm.cover, alt: "", sizes: "(min-width: 1040px) 960px, 100vw" }) }) : null,
+    state === "ready" && post2 ? /* @__PURE__ */ jsx("div", { className: "setto-blog__prose", children: /* @__PURE__ */ jsx(BlogBody, { nodes: post2.body.children, language: ctx.language }) }) : /* @__PURE__ */ jsx("p", { className: "setto-blog__loading", "aria-live": "polite", children: ctx.strings.loading }),
+    /* @__PURE__ */ jsx(ShareBar, { title: fm.title, strings: ctx.strings })
+  ] });
+}
+function usePostTitle(title, siteName) {
+  useEffect(() => {
+    if (!title || typeof document === "undefined") return;
+    const previous2 = document.title;
+    const timer = window.setTimeout(() => {
+      document.title = siteName ? `${title} · ${siteName}` : title;
+    }, 0);
+    return () => {
+      window.clearTimeout(timer);
+      document.title = previous2;
+    };
+  }, [title, siteName]);
+}
+function ShareBar({ title, strings }) {
+  const [copied, setCopied] = useState(false);
+  const [native, setNative] = useState(false);
+  useEffect(() => setNative(typeof navigator !== "undefined" && typeof navigator.share === "function"), []);
+  const url = typeof window === "undefined" ? "" : `${window.location.origin}${window.location.pathname}`;
+  const u = encodeURIComponent(url);
+  const t = encodeURIComponent(title);
+  return /* @__PURE__ */ jsxs("div", { className: "setto-blog__share", "aria-label": strings.share, children: [
+    /* @__PURE__ */ jsx("span", { className: "setto-blog__share-label", children: strings.share }),
+    native ? /* @__PURE__ */ jsx("button", { type: "button", onClick: () => void navigator.share({ title, url }).catch(() => void 0), children: strings.moreShare }) : null,
+    /* @__PURE__ */ jsx("a", { href: `https://www.facebook.com/sharer/sharer.php?u=${u}`, target: "_blank", rel: "noopener noreferrer", children: "Facebook" }),
+    /* @__PURE__ */ jsx("a", { href: `https://www.linkedin.com/sharing/share-offsite/?url=${u}`, target: "_blank", rel: "noopener noreferrer", children: "LinkedIn" }),
+    /* @__PURE__ */ jsx("a", { href: `mailto:?subject=${t}&body=${u}`, children: strings.email }),
+    /* @__PURE__ */ jsx(
+      "button",
+      {
+        type: "button",
+        onClick: () => {
+          void navigator.clipboard?.writeText(url).then(() => {
+            setCopied(true);
+            window.setTimeout(() => setCopied(false), 2e3);
+          });
+        },
+        children: copied ? strings.copied : strings.copyLink
+      }
+    )
+  ] });
+}
+function SettoBlogLatest({ sectionId, first }) {
+  useBlogStyles();
+  const ctx = useBlogContext();
+  if (!ctx.config.blog) return null;
+  const posts = postsForLanguage(ctx.config.blog.posts, ctx.language, ctx.fallbackLanguage).slice(0, LATEST_COUNT);
+  if (posts.length === 0) return null;
+  const blogPath = blogPathOf(ctx.manifest);
+  const Heading = first ? "h1" : "h2";
+  return /* @__PURE__ */ jsx(SettoSection, { sectionId, className: "setto-blog setto-blog--latest", children: /* @__PURE__ */ jsxs("div", { className: "setto-blog__inner setto-blog__inner--wide", children: [
+    /* @__PURE__ */ jsxs("div", { className: "setto-blog__latest-head", children: [
+      /* @__PURE__ */ jsx(Heading, { className: "setto-blog__title", children: ctx.strings.latest }),
+      /* @__PURE__ */ jsxs("a", { href: ctx.href(blogPath), className: "setto-blog__more", children: [
+        ctx.strings.allPosts,
+        " ",
+        /* @__PURE__ */ jsx("span", { "aria-hidden": "true", children: "→" })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: "setto-blog__list", children: posts.map((post2) => /* @__PURE__ */ jsx(PostCard, { post: post2, blogPath, ctx, headingLevel: "h3" }, post2.slug)) })
+  ] }) });
+}
+const STYLE_ID$1 = "setto-blog-styles";
+const BLOG_CSS = `
+.setto-blog{padding:clamp(48px,8vw,96px) 16px}
+.setto-blog :where(.setto-blog__inner){max-width:68ch;margin:0 auto}
+.setto-blog :where(.setto-blog__inner--wide){max-width:1120px}
+.setto-blog :where(.setto-blog__title){font-family:var(--setto-display-font,inherit);font-size:clamp(2rem,4vw,2.75rem);line-height:1.15;font-weight:600;margin:0 0 .75em}
+.setto-blog :where(.setto-blog__list){display:grid;gap:clamp(1.5rem,3vw,2.5rem);grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr))}
+.setto-blog :where(.setto-blog__card){display:grid;gap:.9rem;align-content:start}
+.setto-blog :where(.setto-blog__card-cover){display:block;overflow:hidden;border-radius:.9rem;aspect-ratio:16/10}
+.setto-blog :where(.setto-blog__card-cover img,.setto-blog__cover img,.setto-blog__figure img,.setto-blog__gallery-item img){display:block;width:100%;height:100%;object-fit:cover}
+.setto-blog :where(.setto-blog__card-body){display:grid;gap:.45rem}
+.setto-blog :where(.setto-blog__card-title){font-family:var(--setto-display-font,inherit);font-size:1.3rem;line-height:1.25;font-weight:600;margin:0}
+.setto-blog :where(.setto-blog__card-lead){margin:0;line-height:1.55}
+.setto-blog :where(.setto-blog__date){font-size:.875rem;letter-spacing:.01em}
+.setto-blog :where(.setto-blog__more,.setto-blog__back){display:inline-flex;gap:.35em;align-items:center;font-weight:500;width:fit-content}
+.setto-blog :where(.setto-blog__back){margin-bottom:2rem}
+.setto-blog :where(.setto-blog__latest-head){display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:.5rem 1.5rem;margin-bottom:1.75rem}
+.setto-blog :where(.setto-blog__latest-head .setto-blog__title){margin:0}
+.setto-blog :where(.setto-blog__post-header){display:grid;gap:.6rem;margin-bottom:2rem}
+.setto-blog :where(.setto-blog__post-title){font-family:var(--setto-display-font,inherit);font-size:clamp(2rem,5vw,3rem);line-height:1.1;font-weight:600;margin:0}
+.setto-blog :where(.setto-blog__lead){font-size:1.2rem;line-height:1.5;margin:0}
+.setto-blog :where(.setto-blog__cover){margin:0 0 2.5rem;overflow:hidden;border-radius:1rem;aspect-ratio:16/9}
+.setto-blog :where(.setto-blog__prose){font-size:1.075rem;line-height:1.7}
+.setto-blog :where(.setto-blog__prose > * + *){margin-top:1.15em}
+.setto-blog :where(.setto-blog__prose h2,.setto-blog__prose h3,.setto-blog__prose h4){font-family:var(--setto-display-font,inherit);line-height:1.25;font-weight:600;margin:1.8em 0 0}
+.setto-blog :where(.setto-blog__prose h2){font-size:1.6rem}
+.setto-blog :where(.setto-blog__prose h3){font-size:1.3rem}
+.setto-blog :where(.setto-blog__prose h4){font-size:1.1rem}
+.setto-blog :where(.setto-blog__prose ul,.setto-blog__prose ol){padding-left:1.4em}
+.setto-blog :where(.setto-blog__prose ul){list-style:disc}
+.setto-blog :where(.setto-blog__prose ol){list-style:decimal}
+.setto-blog :where(.setto-blog__prose li + li){margin-top:.35em}
+.setto-blog :where(.setto-blog__prose blockquote){margin-left:0;padding-left:1.1em;border-left-width:3px;border-left-style:solid;font-style:italic}
+.setto-blog :where(.setto-blog__prose pre){overflow-x:auto;padding:1em;border-radius:.6rem;font-size:.9em}
+.setto-blog :where(.setto-blog__prose code){font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.92em}
+.setto-blog :where(.setto-blog__prose hr){border:0;border-top-width:1px;border-top-style:solid;margin:2.5em 0}
+.setto-blog :where(.setto-blog__prose a){text-decoration:underline;text-underline-offset:.18em}
+.setto-blog :where(.setto-blog__table){overflow-x:auto}
+.setto-blog :where(.setto-blog__table table){border-collapse:collapse;width:100%;font-size:.95em}
+.setto-blog :where(.setto-blog__table th,.setto-blog__table td){padding:.55em .8em;border-bottom-width:1px;border-bottom-style:solid;text-align:left}
+.setto-blog :where(.setto-blog__figure,.setto-blog__gallery,.setto-blog__video){margin:2em 0}
+.setto-blog :where(.setto-blog__figure img){border-radius:.8rem;height:auto}
+.setto-blog :where(figcaption){font-size:.9rem;margin-top:.6em;opacity:.75}
+.setto-blog :where(.setto-blog__gallery-grid){display:grid;gap:.6rem;grid-template-columns:repeat(auto-fit,minmax(min(100%,150px),1fr))}
+.setto-blog :where(.setto-blog__gallery-item){margin:0}
+.setto-blog :where(.setto-blog__gallery-item img){border-radius:.6rem;aspect-ratio:4/3}
+.setto-blog :where(.setto-blog__video-frame){position:relative;aspect-ratio:16/9;border-radius:.8rem;overflow:hidden}
+.setto-blog :where(.setto-blog__video-frame iframe){position:absolute;inset:0;width:100%;height:100%;border:0}
+.setto-blog :where(.setto-blog__video-play){position:absolute;inset:0;width:100%;height:100%;padding:0;border:0;cursor:pointer;display:grid;place-items:center}
+.setto-blog :where(.setto-blog__video-play img){position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
+.setto-blog :where(.setto-blog__video-icon){position:relative;display:block;line-height:0}
+.setto-blog :where(.setto-blog__callout){padding:1.1em 1.3em;border-radius:.8rem;border-left-width:4px;border-left-style:solid}
+.setto-blog :where(.setto-blog__callout > * + *){margin-top:.7em}
+.setto-blog :where(.setto-blog__callout ul,.setto-blog__callout ol){padding-left:1.3em;list-style:disc}
+.setto-blog :where(.setto-blog__share){display:flex;flex-wrap:wrap;gap:.5rem .9rem;align-items:center;margin-top:3rem;padding-top:1.5rem;border-top-width:1px;border-top-style:solid}
+.setto-blog :where(.setto-blog__share-label){font-weight:600}
+.setto-blog :where(.setto-blog__share a,.setto-blog__share button){font:inherit;padding:.35rem .85rem;border-radius:999px;border-width:1px;border-style:solid;cursor:pointer;text-decoration:none;line-height:1.4}
+.setto-blog :where(.setto-blog__empty,.setto-blog__loading){opacity:.75}
+:where(.setto-blog){color:inherit}
+:where(.setto-blog__date){opacity:.7}
+:where(.setto-blog a){color:inherit}
+:where(.setto-blog__prose blockquote,.setto-blog__prose hr,.setto-blog__table th,.setto-blog__table td,.setto-blog__share){border-color:color-mix(in srgb,currentColor 18%,transparent)}
+:where(.setto-blog__prose pre,.setto-blog__card-cover){background:color-mix(in srgb,currentColor 6%,transparent)}
+:where(.setto-blog__share a,.setto-blog__share button){border-color:color-mix(in srgb,currentColor 30%,transparent);background:transparent;color:inherit}
+:where(.setto-blog__callout){background:color-mix(in srgb,currentColor 5%,transparent);border-left-color:color-mix(in srgb,currentColor 40%,transparent)}
+:where(.setto-blog__callout[data-tone="tip"]){border-left-color:#0f7b4f}
+:where(.setto-blog__callout[data-tone="warning"]){border-left-color:#b54708}
+:where(.setto-blog__video-frame){background:#000}
+`;
+function useBlogStyles() {
+  useInsertionEffect(() => {
+    if (typeof document === "undefined" || document.getElementById(STYLE_ID$1)) return;
+    const el = document.createElement("style");
+    el.id = STYLE_ID$1;
+    el.textContent = BLOG_CSS;
+    document.head.appendChild(el);
+  }, []);
+}
 const FORM_FIELD_TYPES = [
   "text",
   "email",
@@ -39113,193 +39851,6 @@ const iframeStyle = {
   height: "100%",
   border: 0
 };
-function usePageManifest() {
-  const { pageStore, config } = useSetto();
-  const snap = useSyncExternalStore(
-    (cb) => pageStore?.subscribe(() => cb()) ?? (() => {
-    }),
-    () => pageStore?.snapshot() ?? EMPTY_PAGE_STORE_SNAPSHOT,
-    () => pageStore?.snapshot() ?? EMPTY_PAGE_STORE_SNAPSHOT
-  );
-  return pageStore ? snap.manifest : bundledManifest(config.pages);
-}
-function useSettoMenu(list2 = "menu") {
-  const manifest = usePageManifest();
-  return manifest ? visibleMenu(manifest, list2) : null;
-}
-function SettoPage({ pageId, path: path2, sections = {}, builtins, fallback = null }) {
-  const manifest = usePageManifest();
-  const { editMode } = useSetto();
-  if (!manifest) {
-    if (!pageId && path2 !== void 0 && path2 !== "/" && path2 !== "") return /* @__PURE__ */ jsx(Fragment, { children: fallback });
-    return /* @__PURE__ */ jsx(Fragment, { children: Object.entries(sections).map(([id, Component]) => /* @__PURE__ */ jsx(Component, {}, id)) });
-  }
-  const page = pageId ? pageById(manifest, pageId) : pageForPath(manifest, path2 ?? "/");
-  if (!page) {
-    if (pageId) {
-      return /* @__PURE__ */ jsx(Fragment, { children: Object.entries(sections).map(([id, Component]) => /* @__PURE__ */ jsx(Component, {}, id)) });
-    }
-    return /* @__PURE__ */ jsx(Fragment, { children: fallback });
-  }
-  if (page.hidden && !editMode) return /* @__PURE__ */ jsx(Fragment, { children: fallback });
-  return /* @__PURE__ */ jsx(PageBody, { page, sections, builtins, editMode, manifest });
-}
-function PageBody({
-  page,
-  sections,
-  builtins,
-  editMode,
-  manifest
-}) {
-  usePageTitle(page);
-  const HiddenPageNote = useSettoChromeSlot("hidden-page");
-  const listed = new Set(manifest.pages.flatMap((p) => p.sections.map((s) => s.id)));
-  const unlisted = Object.keys(sections).filter((id) => !listed.has(id));
-  const firstVisible = page.sections.find((s) => !s.hidden && (s.type || sections[s.id]))?.id;
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    page.hidden && editMode ? HiddenPageNote ? /* @__PURE__ */ jsx(HiddenPageNote, { pageId: page.id }) : /* @__PURE__ */ jsx(HiddenNote, { text: "Denne siden er skjult for besøkende." }) : null,
-    page.sections.map((section) => /* @__PURE__ */ jsx(Fragment$1, { children: renderSection(section, sections, builtins, editMode, section.id === firstVisible) }, section.id)),
-    unlisted.map((id) => {
-      const Component = sections[id];
-      return /* @__PURE__ */ jsx(Component, {}, id);
-    })
-  ] });
-}
-function renderSection(section, sections, builtins, editMode, first) {
-  if (section.hidden) {
-    return editMode ? /* @__PURE__ */ jsx(HiddenSection, { section }) : null;
-  }
-  if (section.type) {
-    const Builtin = builtins?.[section.type] ?? BUILTIN_RENDERERS[section.type];
-    return /* @__PURE__ */ jsx(Builtin, { sectionId: section.id, first });
-  }
-  const Component = sections[section.id];
-  if (!Component) {
-    warnOnce(section.id);
-    return null;
-  }
-  return /* @__PURE__ */ jsx(Component, {});
-}
-const warned = /* @__PURE__ */ new Set();
-function warnOnce(id) {
-  if (warned.has(id)) return;
-  warned.add(id);
-  console.warn(`[setto] section "${id}" is in pages.json but the page does not provide it`);
-}
-function HiddenSection({ section }) {
-  const { pageStore } = useSetto();
-  const Offered = useSettoChromeSlot("hidden-section");
-  const label = section.label ?? section.id;
-  if (Offered) return /* @__PURE__ */ jsx(Offered, { sectionId: section.id, label });
-  return /* @__PURE__ */ jsxs("div", { "data-setto-ui": true, style: hiddenBarStyle, children: [
-    /* @__PURE__ */ jsxs("span", { children: [
-      "Skjult: ",
-      label
-    ] }),
-    pageStore ? /* @__PURE__ */ jsx(
-      "button",
-      {
-        type: "button",
-        "data-setto-ui": true,
-        style: hiddenBtnStyle,
-        onClick: () => pageStore.apply([{ op: "show_section", sectionId: section.id }]),
-        children: "Vis"
-      }
-    ) : null
-  ] });
-}
-function HiddenNote({ text: text2 }) {
-  return /* @__PURE__ */ jsx("div", { "data-setto-ui": true, style: hiddenBarStyle, children: /* @__PURE__ */ jsx("span", { children: text2 }) });
-}
-function usePageTitle(page) {
-  const { t } = useTranslation();
-  const original = useRef(null);
-  const title = page.path === "/" ? null : t(page.titleKey);
-  useEffect(() => {
-    if (!title || typeof document === "undefined") return;
-    original.current ??= document.title;
-    const base = original.current;
-    document.title = base ? `${title} · ${base}` : title;
-    return () => {
-      document.title = base;
-    };
-  }, [title]);
-}
-function SettoTextSection({ sectionId, first }) {
-  const keys2 = builtinKeys(sectionId);
-  const { i18n } = useTranslation();
-  const { store, editMode } = useSetto();
-  const intro2 = store ? store.get(keys2.intro, i18n.language) : i18n.t(keys2.intro, { defaultValue: "" });
-  const Heading = first ? "h1" : "h2";
-  return /* @__PURE__ */ jsx(SettoSection, { sectionId, style: textSectionStyle, children: /* @__PURE__ */ jsxs("div", { style: textInnerStyle, children: [
-    /* @__PURE__ */ jsx(Heading, { style: first ? textH1Style : textH2Style, children: /* @__PURE__ */ jsx(T, { k: keys2.heading }) }),
-    intro2 || editMode ? /* @__PURE__ */ jsx("p", { style: textIntroStyle, children: /* @__PURE__ */ jsx(T, { k: keys2.intro }) }) : null,
-    /* @__PURE__ */ jsx(
-      SettoRepeater,
-      {
-        itemsKey: keys2.items,
-        defaultItem: { heading: "Overskrift", text: "Tekst" },
-        itemLabel: "avsnitt",
-        children: (itemKey) => /* @__PURE__ */ jsx(TextItem, { sectionId, itemKey })
-      }
-    )
-  ] }) });
-}
-function TextItem({ sectionId, itemKey }) {
-  const keys2 = builtinKeys(sectionId);
-  const { i18n } = useTranslation();
-  const { store, editMode } = useSetto();
-  const heading2 = store ? store.get(keys2.itemHeading(itemKey), i18n.language) : i18n.t(keys2.itemHeading(itemKey), { defaultValue: "" });
-  return /* @__PURE__ */ jsxs("div", { style: textItemStyle, children: [
-    heading2 || editMode ? /* @__PURE__ */ jsx("h3", { style: textH3Style, children: /* @__PURE__ */ jsx(T, { k: keys2.itemHeading(itemKey) }) }) : null,
-    /* @__PURE__ */ jsx("p", { style: textParagraphStyle, children: /* @__PURE__ */ jsx(T, { k: keys2.itemText(itemKey) }) })
-  ] });
-}
-const BUILTIN_RENDERERS = {
-  text: SettoTextSection
-};
-const textSectionStyle = { padding: "clamp(48px, 8vw, 96px) 16px" };
-const textInnerStyle = { maxWidth: "68ch", margin: "0 auto" };
-const textH1Style = {
-  fontFamily: "var(--setto-display-font, inherit)",
-  fontSize: "clamp(2rem, 4vw, 2.75rem)",
-  lineHeight: 1.15,
-  fontWeight: 600,
-  margin: "0 0 0.75em"
-};
-const textH2Style = { ...textH1Style, fontSize: "clamp(1.5rem, 3vw, 2rem)" };
-const textH3Style = {
-  fontFamily: "var(--setto-display-font, inherit)",
-  fontSize: "1.125rem",
-  lineHeight: 1.3,
-  fontWeight: 600,
-  margin: "0 0 0.4em"
-};
-const textIntroStyle = { fontSize: "1.125rem", lineHeight: 1.6, opacity: 0.85, margin: "0 0 2em" };
-const textItemStyle = { margin: "0 0 1.75em" };
-const textParagraphStyle = { lineHeight: 1.7, margin: 0, whiteSpace: "pre-line" };
-const hiddenBarStyle = {
-  display: "flex",
-  alignItems: "center",
-  justifyContent: "center",
-  gap: 12,
-  padding: "10px 16px",
-  margin: "4px 0",
-  border: "1px dashed rgba(100, 10, 255, 0.45)",
-  borderRadius: 8,
-  background: "rgba(100, 10, 255, 0.05)",
-  color: "#3b2a66",
-  font: '500 13px system-ui, -apple-system, "Segoe UI", sans-serif'
-};
-const hiddenBtnStyle = {
-  border: "none",
-  borderRadius: 999,
-  padding: "4px 12px",
-  background: "#640AFF",
-  color: "#fff",
-  font: '600 12px system-ui, -apple-system, "Segoe UI", sans-serif',
-  cursor: "pointer"
-};
 const DEFAULT_DURATION = {
   fadeIn: 600,
   slideUp: 700,
@@ -40262,6 +40813,7 @@ export {
   AuthGate,
   BLOCK_REGISTRY,
   BLOCK_TYPES,
+  BLOG_CSS,
   BUILTIN_SECTION_TYPES,
   CHECKOUT_INTENT,
   DEFAULT_LANGUAGE,
@@ -40280,11 +40832,15 @@ export {
   SETTO_BASE,
   SETTO_IMAGE_QUALITY,
   SETTO_IMAGE_WIDTHS,
+  SETTO_MEDIA_HOST,
   SETTO_MODULES,
   SettoAdminApp,
   SettoAnimation,
   SettoBlock,
   SettoBlockTree,
+  SettoBlog,
+  SettoBlogLatest,
+  SettoBlogSection,
   SettoChat,
   SettoChrome,
   SettoContext,
@@ -40306,6 +40862,8 @@ export {
   alternateLinks,
   applyOp,
   applyOps,
+  blogPage,
+  blogSlugForPath,
   builtinKeys,
   checkoutIntentUrl,
   countChanges,
@@ -40315,6 +40873,7 @@ export {
   fieldTypeHasPlaceholder,
   findSection,
   formFieldsPrefix,
+  formatPostDate,
   isAdminDeploymentView,
   isAdminPanelView,
   isAdminRoute,
@@ -40322,6 +40881,7 @@ export {
   isLinkContext,
   isOptimizable,
   isSafeHref,
+  isSettoMediaUrl,
   languageFromPath,
   languageName,
   nodeChildren,
@@ -40335,6 +40895,8 @@ export {
   parseManifest,
   pathForLanguage,
   pickInitialLanguage,
+  postForSlug,
+  postsForLanguage,
   readLocaleFields,
   redirectForVisitor,
   serialiseManifest,