@sonordev/site-kit 4.3.2 → 5.1.0

package/dist/blog/index.mjs

@@ -1,428 +1,68 @@
 'use client';
 export { BlogFAQ } from '../chunk-O237KKCX.mjs';
-export { BlogList, BlogPost, ClusterNavigation, ServiceCallout, ServiceCallouts, addExternalLinkTargets, normalizeSiteHost, resolveBlogSiteUrl } from '../chunk-JJS63TDR.mjs';
+import { NewsletterShell } from '../chunk-AK6JZ3OE.mjs';
+import { getAuthorSocialLinks, readingTimeMinutes } from '../chunk-A3VGZAZQ.mjs';
+export { BlogLayout, BlogList, BlogPage, BlogPost, BlogPostPage, BlogSidebar, CategoryPage, ClusterNavigation, RelatedPosts, ServiceCallout, ServiceCallouts, addExternalLinkTargets, normalizeSiteHost, resolveBlogSiteUrl } from '../chunk-A3VGZAZQ.mjs';
+import '../chunk-YFX3Q56O.mjs';
 import { generateAuthorSchema } from '../chunk-CGCYZJYX.mjs';
 import { safeJsonLd } from '../chunk-662YHKWW.mjs';
 import '../chunk-BEXTDHO4.mjs';
-import { jsxs, jsx } from 'react/jsx-runtime';
-import { useState, useEffect } from 'react';
+import React, { useState, Suspense, useEffect } from 'react';
+import { jsx, jsxs } from 'react/jsx-runtime';
 
-async function fetchRecentPosts(apiUrl, apiKey, limit = 5) {
-  try {
-    const response = await fetch(`${apiUrl}/public/blog/recent?limit=${limit}`, {
-      headers: { "x-api-key": apiKey },
-      next: { revalidate: 300 }
-    });
-    if (!response.ok) return [];
-    const data = await response.json();
-    return data.posts || [];
-  } catch (error) {
-    console.error("[Blog] Error fetching recent posts:", error);
-    return [];
-  }
-}
-async function fetchCategories(apiUrl, apiKey) {
-  try {
-    const response = await fetch(`${apiUrl}/public/blog/categories`, {
-      headers: { "x-api-key": apiKey },
-      next: { revalidate: 300 }
-    });
-    if (!response.ok) return [];
-    const data = await response.json();
-    return data.categories || [];
-  } catch (error) {
-    console.error("[Blog] Error fetching categories:", error);
-    return [];
-  }
-}
-async function fetchTags(apiUrl, apiKey) {
-  try {
-    const response = await fetch(`${apiUrl}/public/blog/tags`, {
-      headers: { "x-api-key": apiKey },
-      next: { revalidate: 300 }
-    });
-    if (!response.ok) return [];
-    const data = await response.json();
-    return data.tags || [];
-  } catch (error) {
-    console.error("[Blog] Error fetching tags:", error);
-    return [];
-  }
-}
-async function BlogSidebar({
-  apiUrl = process.env.SONOR_API_URL || "https://api.sonor.io",
-  apiKey = process.env.SONOR_API_KEY || "",
-  showCategories = true,
-  showRecentPosts = true,
-  recentPostsCount = 5,
-  showTags = true,
-  showSearch = true,
-  basePath = "/blog",
-  className,
-  currentCategory,
-  children
-}) {
-  if (!apiKey) {
-    console.warn("[Blog] No API key configured for sidebar");
-    return null;
-  }
-  const [categories, recentPosts, tags] = await Promise.all([
-    showCategories ? fetchCategories(apiUrl, apiKey) : Promise.resolve([]),
-    showRecentPosts ? fetchRecentPosts(apiUrl, apiKey, recentPostsCount) : Promise.resolve([]),
-    showTags ? fetchTags(apiUrl, apiKey) : Promise.resolve([])
-  ]);
-  return /* @__PURE__ */ jsxs("aside", { className, style: { display: "flex", flexDirection: "column", gap: 32 }, children: [
-    showSearch && /* @__PURE__ */ jsx(SearchWidget, { basePath }),
-    showCategories && categories.length > 0 && /* @__PURE__ */ jsx(
-      CategoriesWidget,
-      {
-        categories,
-        basePath,
-        currentCategory
-      }
-    ),
-    showRecentPosts && recentPosts.length > 0 && /* @__PURE__ */ jsx(RecentPostsWidget, { posts: recentPosts, basePath }),
-    showTags && tags.length > 0 && /* @__PURE__ */ jsx(TagsWidget, { tags, basePath }),
-    children
-  ] });
-}
-function SearchWidget({ basePath }) {
-  return /* @__PURE__ */ jsxs("div", { style: widgetStyle, children: [
-    /* @__PURE__ */ jsx("h4", { style: widgetTitleStyle, children: "Search" }),
-    /* @__PURE__ */ jsx("form", { action: basePath, method: "get", children: /* @__PURE__ */ jsx(
-      "input",
-      {
-        type: "search",
-        name: "search",
-        placeholder: "Search posts...",
-        style: {
-          width: "100%",
-          padding: "10px 12px",
-          border: "1px solid var(--sk-border)",
-          borderRadius: 8,
-          fontSize: 14
-        }
-      }
-    ) })
-  ] });
-}
-function CategoriesWidget({
-  categories,
-  basePath,
-  currentCategory
-}) {
-  return /* @__PURE__ */ jsxs("div", { style: widgetStyle, children: [
-    /* @__PURE__ */ jsx("h4", { style: widgetTitleStyle, children: "Categories" }),
-    /* @__PURE__ */ jsxs("ul", { style: { listStyle: "none", margin: 0, padding: 0 }, children: [
-      /* @__PURE__ */ jsx("li", { style: { marginBottom: 8 }, children: /* @__PURE__ */ jsx(
-        "a",
-        {
-          href: basePath,
-          style: {
-            ...categoryLinkStyle,
-            fontWeight: !currentCategory ? 600 : 400,
-            color: !currentCategory ? "var(--sk-primary)" : "var(--sk-text-primary)"
-          },
-          children: "All Posts"
-        }
-      ) }),
-      categories.map((cat) => /* @__PURE__ */ jsx("li", { style: { marginBottom: 8 }, children: /* @__PURE__ */ jsxs(
-        "a",
-        {
-          href: `${basePath}?category=${cat.slug}`,
-          style: {
-            ...categoryLinkStyle,
-            fontWeight: currentCategory === cat.slug ? 600 : 400,
-            color: currentCategory === cat.slug ? "var(--sk-primary)" : "var(--sk-text-primary)"
-          },
-          children: [
-            cat.name,
-            /* @__PURE__ */ jsxs("span", { style: { color: "var(--sk-text-tertiary)", marginLeft: 8 }, children: [
-              "(",
-              cat.post_count,
-              ")"
-            ] })
-          ]
-        }
-      ) }, cat.slug))
-    ] })
-  ] });
-}
-function RecentPostsWidget({
-  posts,
-  basePath
-}) {
-  return /* @__PURE__ */ jsxs("div", { style: widgetStyle, children: [
-    /* @__PURE__ */ jsx("h4", { style: widgetTitleStyle, children: "Recent Posts" }),
-    /* @__PURE__ */ jsx("ul", { style: { listStyle: "none", margin: 0, padding: 0 }, children: posts.map((post) => {
-      const date = post.published_at ? new Date(post.published_at).toLocaleDateString("en-US", {
-        month: "short",
-        day: "numeric"
-      }) : null;
-      return /* @__PURE__ */ jsx(
-        "li",
-        {
-          style: {
-            marginBottom: 16,
-            paddingBottom: 16,
-            borderBottom: "1px solid var(--sk-border)"
-          },
-          children: /* @__PURE__ */ jsxs("div", { style: { display: "flex", gap: 12 }, children: [
-            post.featured_image && /* @__PURE__ */ jsx("a", { href: `${basePath}/${post.slug}`, children: /* @__PURE__ */ jsx(
-              "img",
-              {
-                src: post.featured_image,
-                alt: "",
-                style: {
-                  width: 64,
-                  height: 48,
-                  objectFit: "cover",
-                  borderRadius: 6,
-                  flexShrink: 0
-                }
-              }
-            ) }),
-            /* @__PURE__ */ jsxs("div", { style: { flex: 1, minWidth: 0 }, children: [
-              /* @__PURE__ */ jsx(
-                "a",
-                {
-                  href: `${basePath}/${post.slug}`,
-                  style: {
-                    fontSize: 14,
-                    fontWeight: 500,
-                    color: "var(--sk-text-primary)",
-                    textDecoration: "none",
-                    display: "-webkit-box",
-                    WebkitLineClamp: 2,
-                    WebkitBoxOrient: "vertical",
-                    overflow: "hidden"
-                  },
-                  children: post.title
-                }
-              ),
-              date && /* @__PURE__ */ jsx("span", { style: { fontSize: 12, color: "var(--sk-text-tertiary)", display: "block", marginTop: 4 }, children: date })
-            ] })
-          ] })
-        },
-        post.id
-      );
-    }) })
-  ] });
-}
-function TagsWidget({
-  tags,
-  basePath
-}) {
-  return /* @__PURE__ */ jsxs("div", { style: widgetStyle, children: [
-    /* @__PURE__ */ jsx("h4", { style: widgetTitleStyle, children: "Popular Tags" }),
-    /* @__PURE__ */ jsx("div", { style: { display: "flex", flexWrap: "wrap", gap: 8 }, children: tags.slice(0, 15).map((tag) => /* @__PURE__ */ jsx(
-      "a",
-      {
-        href: `${basePath}?tag=${tag.slug}`,
-        style: {
-          padding: "4px 10px",
-          backgroundColor: "var(--sk-bg-elevated)",
-          borderRadius: 9999,
-          fontSize: 12,
-          color: "var(--sk-text-primary)",
-          textDecoration: "none",
-          transition: "background-color 0.2s"
-        },
-        children: tag.name
-      },
-      tag.slug
-    )) })
-  ] });
-}
+var ManagedNewsletterForm = React.lazy(() => import('../ManagedNewsletterForm-YKYW7B6P.mjs'));
 function NewsletterWidget({
   title = "Subscribe to Our Newsletter",
   description = "Get the latest posts delivered straight to your inbox.",
-  buttonText = "Subscribe"
-}) {
-  return /* @__PURE__ */ jsxs("div", { style: { ...widgetStyle, backgroundColor: "rgba(var(--sk-primary-rgb), 0.1)" }, children: [
-    /* @__PURE__ */ jsx("h4", { style: { ...widgetTitleStyle, color: "var(--sk-primary)" }, children: title }),
-    /* @__PURE__ */ jsx("p", { style: { fontSize: 14, color: "var(--sk-text-secondary)", marginBottom: 16 }, children: description }),
-    /* @__PURE__ */ jsxs(
-      "form",
-      {
-        onSubmit: (e) => {
-          e.preventDefault();
-        },
-        style: { display: "flex", gap: 8 },
-        children: [
-          /* @__PURE__ */ jsx(
-            "input",
-            {
-              type: "email",
-              name: "email",
-              placeholder: "Enter your email",
-              required: true,
-              style: {
-                flex: 1,
-                padding: "10px 12px",
-                border: "1px solid var(--sk-border)",
-                borderRadius: 8,
-                fontSize: 14
-              }
-            }
-          ),
-          /* @__PURE__ */ jsx(
-            "button",
-            {
-              type: "submit",
-              style: {
-                padding: "10px 16px",
-                backgroundColor: "var(--sk-primary)",
-                color: "var(--sk-bg)",
-                border: "none",
-                borderRadius: 8,
-                fontSize: 14,
-                fontWeight: 500,
-                cursor: "pointer"
-              },
-              children: buttonText
-            }
-          )
-        ]
-      }
-    )
-  ] });
-}
-var widgetStyle = {
-  padding: 20,
-  backgroundColor: "var(--sk-bg-elevated)",
-  borderRadius: 12
-};
-var widgetTitleStyle = {
-  margin: "0 0 16px",
-  fontSize: 16,
-  fontWeight: 600,
-  color: "var(--sk-text-primary)"
-};
-var categoryLinkStyle = {
-  display: "flex",
-  alignItems: "center",
-  fontSize: 14,
-  textDecoration: "none"
-};
-async function BlogLayout({
-  apiUrl = process.env.SONOR_API_URL || "https://api.sonor.io",
-  apiKey = process.env.SONOR_API_KEY || "",
-  layout = "sidebar-right",
-  showSidebar = true,
-  sidebarProps = {},
-  hero,
-  maxWidth = 1280,
-  basePath = "/blog",
-  className,
-  currentCategory,
-  children
+  buttonText = "Subscribe",
+  onSubmit,
+  formSlug,
+  successMessage = "You're subscribed \u2014 thanks!"
 }) {
-  const hasSidebar = showSidebar && layout !== "full-width";
-  return /* @__PURE__ */ jsxs("div", { className, children: [
-    hero && /* @__PURE__ */ jsx(
-      "section",
+  const [email, setEmail] = useState("");
+  const [status, setStatus] = useState("idle");
+  const [errorMessage, setErrorMessage] = useState(null);
+  if (!onSubmit && formSlug) {
+    return /* @__PURE__ */ jsx(Suspense, { fallback: null, children: /* @__PURE__ */ jsx(
+      ManagedNewsletterForm,
       {
-        style: {
-          padding: "60px 20px",
-          backgroundColor: hero.backgroundColor || "var(--sk-primary)",
-          backgroundImage: hero.backgroundImage ? `url(${hero.backgroundImage})` : void 0,
-          backgroundSize: "cover",
-          backgroundPosition: "center",
-          color: "var(--sk-bg)",
-          textAlign: "center"
-        },
-        children: /* @__PURE__ */ jsxs("div", { style: { maxWidth, margin: "0 auto" }, children: [
-          hero.title && /* @__PURE__ */ jsx(
-            "h1",
-            {
-              style: {
-                fontSize: "clamp(32px, 5vw, 48px)",
-                fontWeight: 700,
-                marginBottom: 16
-              },
-              children: hero.title
-            }
-          ),
-          hero.subtitle && /* @__PURE__ */ jsx(
-            "p",
-            {
-              style: {
-                fontSize: "clamp(16px, 2vw, 20px)",
-                opacity: 0.9,
-                maxWidth: 600,
-                margin: "0 auto"
-              },
-              children: hero.subtitle
-            }
-          )
-        ] })
-      }
-    ),
-    /* @__PURE__ */ jsx(
-      "div",
-      {
-        style: {
-          maxWidth,
-          margin: "0 auto",
-          padding: "40px 20px"
-        },
-        children: /* @__PURE__ */ jsxs(
-          "div",
-          {
-            style: {
-              display: hasSidebar ? "grid" : "block",
-              gridTemplateColumns: hasSidebar ? layout === "sidebar-left" ? "300px 1fr" : "1fr 300px" : void 0,
-              gap: 48
-            },
-            children: [
-              hasSidebar && layout === "sidebar-left" && /* @__PURE__ */ jsx(
-                BlogSidebar,
-                {
-                  apiUrl,
-                  apiKey,
-                  basePath,
-                  currentCategory,
-                  ...sidebarProps
-                }
-              ),
-              /* @__PURE__ */ jsx("main", { style: { minWidth: 0 }, children }),
-              hasSidebar && layout === "sidebar-right" && /* @__PURE__ */ jsx(
-                BlogSidebar,
-                {
-                  apiUrl,
-                  apiKey,
-                  basePath,
-                  currentCategory,
-                  ...sidebarProps
-                }
-              )
-            ]
-          }
-        )
-      }
-    )
-  ] });
-}
-async function BlogPage({ listComponent, ...layoutProps }) {
-  return /* @__PURE__ */ jsx(BlogLayout, { ...layoutProps, children: listComponent });
-}
-async function BlogPostPage({ postComponent, ...layoutProps }) {
-  return /* @__PURE__ */ jsx(BlogLayout, { ...layoutProps, showSidebar: false, layout: "full-width", children: /* @__PURE__ */ jsx("div", { style: { maxWidth: 800, margin: "0 auto" }, children: postComponent }) });
-}
-async function CategoryPage({
-  category,
-  categoryName,
-  listComponent,
-  hero,
-  ...layoutProps
-}) {
-  const categoryHero = hero || {
-    title: categoryName || category,
-    subtitle: `Browse all posts in ${categoryName || category}`,
-    backgroundColor: "var(--sk-primary)"
-  };
-  return /* @__PURE__ */ jsx(BlogLayout, { ...layoutProps, hero: categoryHero, currentCategory: category, children: listComponent });
+        formSlug,
+        title,
+        description,
+        buttonText,
+        successMessage
+      },
+      formSlug
+    ) });
+  }
+  if (!onSubmit) {
+    console.warn(
+      "[Blog] NewsletterWidget needs an onSubmit callback or a formSlug \u2014 rendering nothing rather than a form that discards emails."
+    );
+    return null;
+  }
+  return /* @__PURE__ */ jsx(
+    NewsletterShell,
+    {
+      title,
+      description,
+      buttonText,
+      email,
+      onEmailChange: setEmail,
+      onFormSubmit: (e) => {
+        e.preventDefault();
+        setStatus("submitting");
+        setErrorMessage(null);
+        onSubmit(email).then(() => setStatus("success")).catch((err) => {
+          setStatus("error");
+          setErrorMessage(err instanceof Error ? err.message : null);
+        });
+      },
+      status,
+      successMessage,
+      errorMessage
+    }
+  );
 }
 function TrustBlock({ author }) {
   const hasYears = typeof author.years_experience === "number" && author.years_experience > 0;
@@ -561,11 +201,7 @@ function AuthorCard({ author, showBio = true, showSocial = true, showTrustBlock
           author.company ? ` at ${author.company}` : ""
         ] }),
         showBio && author.bio && /* @__PURE__ */ jsx("p", { style: { margin: "4px 0", color: "var(--sk-text-secondary)", fontSize: 14 }, children: author.bio }),
-        showSocial && author.social_links && /* @__PURE__ */ jsxs("div", { style: { display: "flex", gap: 12, marginTop: 8 }, children: [
-          author.social_links.twitter && /* @__PURE__ */ jsx("a", { href: `https://twitter.com/${author.social_links.twitter}`, target: "_blank", rel: "noopener noreferrer", children: "Twitter" }),
-          author.social_links.linkedin && /* @__PURE__ */ jsx("a", { href: author.social_links.linkedin, target: "_blank", rel: "noopener noreferrer", children: "LinkedIn" }),
-          author.social_links.github && /* @__PURE__ */ jsx("a", { href: `https://github.com/${author.social_links.github}`, target: "_blank", rel: "noopener noreferrer", children: "GitHub" })
-        ] })
+        showSocial && getAuthorSocialLinks(author).length > 0 && /* @__PURE__ */ jsx("div", { style: { display: "flex", gap: 12, marginTop: 8 }, children: getAuthorSocialLinks(author).map((link) => /* @__PURE__ */ jsx("a", { href: link.href, target: "_blank", rel: "noopener noreferrer", children: link.label }, link.label)) })
       ] })
     ] }),
     showTrustBlock && /* @__PURE__ */ jsx(TrustBlock, { author })
@@ -626,13 +262,7 @@ function AuthorHero({ author }) {
   );
 }
 function SocialLinks({ author }) {
-  const links = [];
-  if (author.linkedin_url) links.push({ label: "LinkedIn", href: author.linkedin_url });
-  else if (author.social_links?.linkedin) links.push({ label: "LinkedIn", href: author.social_links.linkedin });
-  if (author.twitter_url) links.push({ label: "Twitter", href: author.twitter_url });
-  else if (author.social_links?.twitter) links.push({ label: "Twitter", href: `https://twitter.com/${author.social_links.twitter}` });
-  if (author.website_url) links.push({ label: "Website", href: author.website_url });
-  else if (author.website) links.push({ label: "Website", href: author.website });
+  const links = getAuthorSocialLinks(author);
   if (links.length === 0) return null;
   return /* @__PURE__ */ jsx("div", { style: { display: "flex", gap: 16, marginTop: 16 }, children: links.map((link) => /* @__PURE__ */ jsx(
     "a",
@@ -687,8 +317,8 @@ function PostCard({ post, basePath }) {
           date && /* @__PURE__ */ jsx("time", { style: { fontSize: 12, color: "var(--sk-text-tertiary, #6b7280)", marginBottom: 6 }, children: date }),
           /* @__PURE__ */ jsx("a", { href, style: { textDecoration: "none", color: "inherit" }, children: /* @__PURE__ */ jsx("h3", { style: { margin: "0 0 8px", fontSize: 18, fontWeight: 600, lineHeight: 1.3, color: "var(--sk-text-primary, #111827)" }, children: post.title }) }),
           post.excerpt && /* @__PURE__ */ jsx("p", { style: { margin: 0, fontSize: 14, lineHeight: 1.6, color: "var(--sk-text-secondary, #4b5563)", flex: 1 }, children: post.excerpt }),
-          post.reading_time_minutes && /* @__PURE__ */ jsxs("span", { style: { fontSize: 12, color: "var(--sk-text-tertiary, #6b7280)", marginTop: 12 }, children: [
-            post.reading_time_minutes,
+          readingTimeMinutes(post) && /* @__PURE__ */ jsxs("span", { style: { fontSize: 12, color: "var(--sk-text-tertiary, #6b7280)", marginTop: 12 }, children: [
+            readingTimeMinutes(post),
             " min read"
           ] })
         ] })
@@ -733,68 +363,6 @@ function AuthorPage({ author, posts, basePath = "/blog" }) {
     ] })
   ] });
 }
-async function fetchRelatedPosts(apiUrl, apiKey, currentPostId, limit) {
-  try {
-    const response = await fetch(`${apiUrl}/api/public/blog/related`, {
-      method: "POST",
-      headers: {
-        "Content-Type": "application/json",
-        "x-api-key": apiKey
-      },
-      body: JSON.stringify({
-        currentPostId,
-        limit
-      })
-    });
-    if (!response.ok) {
-      console.error("Failed to fetch related posts:", response.statusText);
-      return [];
-    }
-    const data = await response.json();
-    return data.posts || [];
-  } catch (error) {
-    console.error("Failed to fetch related posts:", error);
-    return [];
-  }
-}
-async function RelatedPosts({
-  apiUrl = process.env.SONOR_API_URL || "https://api.sonor.io",
-  apiKey = process.env.SONOR_API_KEY || "",
-  currentPostId,
-  limit = 3,
-  className,
-  renderItem
-}) {
-  if (!apiKey) {
-    console.warn("[Blog] No API key configured for RelatedPosts");
-    return null;
-  }
-  const posts = await fetchRelatedPosts(apiUrl, apiKey, currentPostId, limit);
-  if (posts.length === 0) return null;
-  return /* @__PURE__ */ jsxs("section", { className, children: [
-    /* @__PURE__ */ jsx("h3", { style: { marginBottom: 16 }, children: "Related Posts" }),
-    /* @__PURE__ */ jsx("div", { style: { display: "grid", gap: 16 }, children: posts.map(
-      (post) => renderItem ? renderItem(post) : /* @__PURE__ */ jsxs("article", { style: { borderBottom: "1px solid var(--sk-border)", paddingBottom: 16 }, children: [
-        post.featured_image && /* @__PURE__ */ jsx(
-          "img",
-          {
-            src: post.featured_image,
-            alt: post.title,
-            style: {
-              width: "100%",
-              height: 120,
-              objectFit: "cover",
-              borderRadius: 8,
-              marginBottom: 8
-            }
-          }
-        ),
-        /* @__PURE__ */ jsx("a", { href: `/blog/${post.slug}`, style: { textDecoration: "none" }, children: /* @__PURE__ */ jsx("h4", { style: { margin: 0, color: "inherit" }, children: post.title }) }),
-        post.excerpt && /* @__PURE__ */ jsx("p", { style: { margin: "4px 0 0", fontSize: 14, color: "var(--sk-text-secondary)" }, children: post.excerpt })
-      ] }, post.id)
-    ) })
-  ] });
-}
 function parseHeadings(content) {
   const headingRegex = /<h([2-4])[^>]*id="([^"]*)"[^>]*>(.*?)<\/h[2-4]>/gi;
   const items = [];
@@ -876,6 +444,6 @@ function TableOfContents({
   ] });
 }
 
-export { AuthorCard, AuthorPage, BlogLayout, BlogPage, BlogPostPage, BlogSidebar, CategoryPage, NewsletterWidget, RelatedPosts, TableOfContents };
+export { AuthorCard, AuthorPage, NewsletterWidget, TableOfContents };
 //# sourceMappingURL=index.mjs.map
 //# sourceMappingURL=index.mjs.map