@sonordev/site-kit 2.5.0 → 2.5.2

package/dist/{chunk-T5UU7I4V.mjs → chunk-EHNJDXBY.mjs}

@@ -1,8 +1,8 @@
+import { getTopicCluster } from './chunk-2NM6RGAV.mjs';
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
 import { marked } from 'marked';
 import React from 'react';
 
-// src/blog/ServiceCallout.tsx
 var defaults = {
   featured: {
     wrapper: {
@@ -202,88 +202,116 @@ function ServiceCallouts({
   )) });
 }
 var clusterNavCss = `
-.sk-cluster-nav { margin: 1.5rem 0; }
-.sk-cluster-breadcrumb {
-  display: flex; align-items: center; gap: 0.5rem;
-  font-size: 0.875rem; color: #6b7280; margin-bottom: 1rem;
-}
-.sk-cluster-breadcrumb a { color: inherit; text-decoration: none; }
-.sk-cluster-breadcrumb a:hover { text-decoration: underline; }
-.sk-cluster-breadcrumb-sep { color: #d1d5db; }
-.sk-cluster-breadcrumb-current { color: #374151; font-weight: 500; }
+.sk-cluster-nav {
+  --_cn-primary: var(--sk-primary, currentColor);
+  --_cn-bg: var(--sk-bg-elevated, color-mix(in srgb, currentColor 6%, transparent));
+  --_cn-border: var(--sk-surface-border, color-mix(in srgb, currentColor 12%, transparent));
+  --_cn-text: var(--sk-text-primary, inherit);
+  --_cn-text2: var(--sk-text-secondary, color-mix(in srgb, currentColor 70%, transparent));
+  --_cn-text3: var(--sk-text-tertiary, color-mix(in srgb, currentColor 45%, transparent));
 
-.sk-cluster-pillar-banner {
-  display: flex; align-items: center; gap: 0.75rem;
-  padding: 0.875rem 1rem; border-radius: 0.5rem;
-  background: linear-gradient(135deg, rgba(59,130,246,0.06), rgba(59,130,246,0.02));
-  border: 1px solid rgba(59,130,246,0.15);
-  margin-bottom: 1.5rem;
-}
-.sk-cluster-pillar-banner-icon { font-size: 1.25rem; flex-shrink: 0; }
-.sk-cluster-pillar-banner-text { font-size: 0.875rem; color: #374151; }
-.sk-cluster-pillar-banner-text a {
-  color: #2563eb; font-weight: 600; text-decoration: none;
-}
-.sk-cluster-pillar-banner-text a:hover { text-decoration: underline; }
+  margin: 2rem 0;
+  padding: 1.5rem;
+  border-radius: 0.75rem;
+  background: var(--_cn-bg);
+  border: 1px solid var(--_cn-border);
+  color: var(--_cn-text);
+}
 
-.sk-cluster-siblings {
-  margin-top: 2rem; padding: 1.25rem;
-  border-radius: 0.5rem; background: #f9fafb;
-  border: 1px solid #e5e7eb;
+.sk-cluster-pillar-link {
+  margin-bottom: 1.25rem;
+  padding-bottom: 1.25rem;
+  border-bottom: 1px solid var(--_cn-border);
 }
+.sk-cluster-pillar-link-label {
+  font-size: 0.6875rem;
+  font-weight: 600;
+  text-transform: uppercase;
+  letter-spacing: 0.06em;
+  color: var(--_cn-text3);
+  margin: 0 0 0.375rem 0;
+}
+.sk-cluster-pillar-link a {
+  font-size: 0.9375rem;
+  font-weight: 600;
+  color: var(--_cn-primary);
+  text-decoration: none;
+  transition: opacity 0.15s;
+}
+.sk-cluster-pillar-link a:hover { opacity: 0.8; }
+
 .sk-cluster-siblings-title {
-  font-size: 0.875rem; font-weight: 600; color: #111827;
+  font-size: 0.6875rem;
+  font-weight: 600;
+  text-transform: uppercase;
+  letter-spacing: 0.06em;
+  color: var(--_cn-text3);
   margin: 0 0 0.75rem 0;
 }
 .sk-cluster-siblings-list {
-  list-style: none; margin: 0; padding: 0;
-  display: flex; flex-direction: column; gap: 0.5rem;
+  list-style: none;
+  margin: 0;
+  padding: 0;
+  display: flex;
+  flex-direction: column;
+  gap: 0.5rem;
 }
 .sk-cluster-siblings-item {
-  display: flex; align-items: center; gap: 0.5rem;
+  display: flex;
+  align-items: center;
+  gap: 0.5rem;
 }
 .sk-cluster-siblings-item a {
-  font-size: 0.875rem; color: #374151;
+  font-size: 0.875rem;
+  color: var(--_cn-text2);
   text-decoration: none;
+  transition: color 0.15s;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
 }
-.sk-cluster-siblings-item a:hover { color: #2563eb; text-decoration: underline; }
-.sk-cluster-siblings-type {
-  display: inline-flex; align-items: center;
-  padding: 0.125rem 0.375rem; border-radius: 9999px;
-  font-size: 0.6875rem; font-weight: 500;
-  background: rgba(99,102,241,0.08); color: #6366f1;
-  border: 1px solid rgba(99,102,241,0.15);
+.sk-cluster-siblings-item a:hover { color: var(--_cn-primary); }
+.sk-cluster-type-badge {
+  display: inline-flex;
+  align-items: center;
+  flex-shrink: 0;
+  padding: 0.125rem 0.4rem;
+  border-radius: 9999px;
+  font-size: 0.625rem;
+  font-weight: 500;
   text-transform: capitalize;
+  background: color-mix(in srgb, var(--_cn-primary) 10%, transparent);
+  color: var(--_cn-primary);
+  border: 1px solid color-mix(in srgb, var(--_cn-primary) 20%, transparent);
 }
 `;
 function ClusterNavigation({
   navigation,
   basePath = "/blog",
+  category,
   unstyled = false,
   className
 }) {
   if (!navigation) return null;
+  const siblings = (navigation.siblings || []).filter(
+    (s) => s.article_type !== "pillar"
+  );
+  const hasPillarLink = !navigation.is_pillar && navigation.pillar;
+  const hasSiblings = siblings.length > 0;
+  if (!hasPillarLink && !hasSiblings) return null;
+  const articleUrl = (slug) => category ? `${basePath}/${category}/${slug}/` : `${basePath}/${slug}/`;
   return /* @__PURE__ */ jsxs(Fragment, { children: [
     !unstyled && /* @__PURE__ */ jsx("style", { dangerouslySetInnerHTML: { __html: clusterNavCss } }),
     /* @__PURE__ */ jsxs("nav", { className: `${unstyled ? "" : "sk-cluster-nav"} ${className || ""}`, children: [
-      /* @__PURE__ */ jsxs("div", { className: unstyled ? "" : "sk-cluster-breadcrumb", children: [
-        /* @__PURE__ */ jsx("a", { href: basePath, children: "Blog" }),
-        /* @__PURE__ */ jsx("span", { className: unstyled ? "" : "sk-cluster-breadcrumb-sep", children: "/" }),
-        /* @__PURE__ */ jsx("a", { href: `${basePath}/cluster/${navigation.cluster_slug}`, children: navigation.cluster_name })
+      hasPillarLink && navigation.pillar && /* @__PURE__ */ jsxs("div", { className: unstyled ? "" : "sk-cluster-pillar-link", children: [
+        /* @__PURE__ */ jsx("p", { className: unstyled ? "" : "sk-cluster-pillar-link-label", children: "Full Guide" }),
+        /* @__PURE__ */ jsx("a", { href: articleUrl(navigation.pillar.slug), children: navigation.pillar.title })
       ] }),
-      !navigation.is_pillar && navigation.pillar && /* @__PURE__ */ jsxs("div", { className: unstyled ? "" : "sk-cluster-pillar-banner", children: [
-        /* @__PURE__ */ jsx("span", { className: unstyled ? "" : "sk-cluster-pillar-banner-icon", children: "\u{1F4D6}" }),
-        /* @__PURE__ */ jsxs("p", { className: unstyled ? "" : "sk-cluster-pillar-banner-text", children: [
-          "Read the full guide:",
-          " ",
-          /* @__PURE__ */ jsx("a", { href: `${basePath}/${navigation.pillar.slug}`, children: navigation.pillar.title })
-        ] })
-      ] }),
-      navigation.siblings.length > 0 && /* @__PURE__ */ jsxs("div", { className: unstyled ? "" : "sk-cluster-siblings", children: [
-        /* @__PURE__ */ jsx("h4", { className: unstyled ? "" : "sk-cluster-siblings-title", children: navigation.is_pillar ? "Deep Dives" : "More in This Series" }),
-        /* @__PURE__ */ jsx("ul", { className: unstyled ? "" : "sk-cluster-siblings-list", children: navigation.siblings.map((sibling) => /* @__PURE__ */ jsxs("li", { className: unstyled ? "" : "sk-cluster-siblings-item", children: [
-          /* @__PURE__ */ jsx("span", { className: unstyled ? "" : "sk-cluster-siblings-type", children: sibling.article_type }),
-          /* @__PURE__ */ jsx("a", { href: `${basePath}/${sibling.slug}`, children: sibling.title })
+      hasSiblings && /* @__PURE__ */ jsxs("div", { children: [
+        /* @__PURE__ */ jsx("p", { className: unstyled ? "" : "sk-cluster-siblings-title", children: navigation.is_pillar ? "Deep Dives" : "More in This Series" }),
+        /* @__PURE__ */ jsx("ul", { className: unstyled ? "" : "sk-cluster-siblings-list", children: siblings.map((sibling) => /* @__PURE__ */ jsxs("li", { className: unstyled ? "" : "sk-cluster-siblings-item", children: [
+          /* @__PURE__ */ jsx("span", { className: unstyled ? "" : "sk-cluster-type-badge", children: sibling.article_type }),
+          /* @__PURE__ */ jsx("a", { href: articleUrl(sibling.slug), children: sibling.title })
         ] }, sibling.slug)) })
       ] })
     ] })
@@ -1409,7 +1437,186 @@ function buildPaginationUrl(basePath, page, category) {
   if (category) params.set("category", category);
   return `${basePath}?${params}`;
 }
+var clusterLandingCss = `
+.sk-cluster-landing { max-width: 72rem; margin: 0 auto; padding: 2rem 1rem; }
+
+.sk-cluster-hero { margin-bottom: 3rem; text-align: center; }
+.sk-cluster-hero-label {
+  display: inline-flex; align-items: center; gap: 0.375rem;
+  font-size: 0.75rem; font-weight: 600; text-transform: uppercase;
+  letter-spacing: 0.05em; color: #6366f1; margin-bottom: 0.75rem;
+}
+.sk-cluster-hero-title {
+  font-size: 2.25rem; font-weight: 800; color: #111827;
+  line-height: 1.2; margin: 0 0 0.75rem 0;
+}
+.sk-cluster-hero-desc {
+  font-size: 1.125rem; color: #6b7280; max-width: 40rem;
+  margin: 0 auto; line-height: 1.6;
+}
+.sk-cluster-hero-meta {
+  display: flex; justify-content: center; gap: 1.5rem;
+  margin-top: 1rem; font-size: 0.875rem; color: #9ca3af;
+}
+
+.sk-cluster-pillar-card {
+  display: block; text-decoration: none; color: inherit;
+  padding: 2rem; border-radius: 0.75rem;
+  background: linear-gradient(135deg, rgba(99,102,241,0.04), rgba(99,102,241,0.01));
+  border: 2px solid rgba(99,102,241,0.2);
+  margin-bottom: 3rem; transition: border-color 0.2s, box-shadow 0.2s;
+}
+.sk-cluster-pillar-card:hover {
+  border-color: rgba(99,102,241,0.4);
+  box-shadow: 0 4px 24px rgba(99,102,241,0.08);
+}
+.sk-cluster-pillar-label {
+  display: inline-flex; align-items: center; gap: 0.375rem;
+  font-size: 0.6875rem; font-weight: 700; text-transform: uppercase;
+  letter-spacing: 0.05em; color: #6366f1; margin-bottom: 0.75rem;
+  padding: 0.25rem 0.5rem; border-radius: 9999px;
+  background: rgba(99,102,241,0.08);
+}
+.sk-cluster-pillar-title {
+  font-size: 1.5rem; font-weight: 700; color: #111827;
+  margin: 0 0 0.5rem 0; line-height: 1.3;
+}
+.sk-cluster-pillar-excerpt {
+  font-size: 1rem; color: #6b7280; line-height: 1.6;
+  margin: 0 0 1rem 0;
+}
+.sk-cluster-pillar-meta {
+  display: flex; gap: 1rem; font-size: 0.8125rem; color: #9ca3af;
+}
+
+.sk-cluster-supports-section { margin-bottom: 2rem; }
+.sk-cluster-supports-title {
+  font-size: 1.25rem; font-weight: 700; color: #111827;
+  margin: 0 0 1.25rem 0;
+}
+.sk-cluster-supports-grid {
+  display: grid; gap: 1.25rem;
+  grid-template-columns: repeat(auto-fill, minmax(20rem, 1fr));
+}
+.sk-cluster-support-card {
+  display: block; text-decoration: none; color: inherit;
+  padding: 1.25rem; border-radius: 0.5rem;
+  border: 1px solid #e5e7eb; background: #fff;
+  transition: border-color 0.2s, box-shadow 0.2s;
+}
+.sk-cluster-support-card:hover {
+  border-color: #c7d2fe;
+  box-shadow: 0 2px 12px rgba(0,0,0,0.04);
+}
+.sk-cluster-support-card-header {
+  display: flex; align-items: center; gap: 0.5rem;
+  margin-bottom: 0.5rem;
+}
+.sk-cluster-support-type {
+  display: inline-flex; align-items: center;
+  padding: 0.125rem 0.375rem; border-radius: 9999px;
+  font-size: 0.6875rem; font-weight: 500;
+  background: rgba(99,102,241,0.06); color: #6366f1;
+  border: 1px solid rgba(99,102,241,0.12);
+  text-transform: capitalize;
+}
+.sk-cluster-support-intent {
+  font-size: 0.6875rem; color: #9ca3af;
+  text-transform: capitalize;
+}
+.sk-cluster-support-title {
+  font-size: 1rem; font-weight: 600; color: #111827;
+  margin: 0 0 0.375rem 0; line-height: 1.4;
+}
+.sk-cluster-support-excerpt {
+  font-size: 0.875rem; color: #6b7280; line-height: 1.5;
+  margin: 0; display: -webkit-box; -webkit-line-clamp: 2;
+  -webkit-box-orient: vertical; overflow: hidden;
+}
+.sk-cluster-support-meta {
+  display: flex; gap: 0.75rem; margin-top: 0.75rem;
+  font-size: 0.75rem; color: #9ca3af;
+}
+`;
+async function ClusterLandingPage({
+  slug,
+  basePath = "/blog",
+  unstyled = false,
+  className,
+  children
+}) {
+  const cluster = await getTopicCluster(slug);
+  if (!cluster) {
+    return /* @__PURE__ */ jsx("div", { style: { padding: "4rem 1rem", textAlign: "center", color: "#6b7280" }, children: /* @__PURE__ */ jsx("p", { children: "Topic cluster not found." }) });
+  }
+  if (children) {
+    return children({ cluster });
+  }
+  const pillar = cluster.pillar;
+  const supports = cluster.supports || [];
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    !unstyled && /* @__PURE__ */ jsx("style", { dangerouslySetInnerHTML: { __html: clusterLandingCss } }),
+    /* @__PURE__ */ jsxs("div", { className: `${unstyled ? "" : "sk-cluster-landing"} ${className || ""}`, children: [
+      /* @__PURE__ */ jsxs("header", { className: unstyled ? "" : "sk-cluster-hero", children: [
+        /* @__PURE__ */ jsx("p", { className: unstyled ? "" : "sk-cluster-hero-label", children: "Topic Cluster" }),
+        /* @__PURE__ */ jsx("h1", { className: unstyled ? "" : "sk-cluster-hero-title", children: cluster.cluster_name }),
+        /* @__PURE__ */ jsxs("p", { className: unstyled ? "" : "sk-cluster-hero-desc", children: [
+          cluster.core_topic,
+          cluster.geo_target ? ` in ${cluster.geo_target}` : ""
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: unstyled ? "" : "sk-cluster-hero-meta", children: [
+          /* @__PURE__ */ jsxs("span", { children: [
+            cluster.article_count,
+            " articles"
+          ] }),
+          cluster.geo_target && /* @__PURE__ */ jsx("span", { children: cluster.geo_target })
+        ] })
+      ] }),
+      pillar && /* @__PURE__ */ jsxs("a", { href: `${basePath}/${pillar.slug}`, className: unstyled ? "" : "sk-cluster-pillar-card", children: [
+        /* @__PURE__ */ jsx("span", { className: unstyled ? "" : "sk-cluster-pillar-label", children: "Pillar Guide" }),
+        /* @__PURE__ */ jsx("h2", { className: unstyled ? "" : "sk-cluster-pillar-title", children: pillar.title }),
+        pillar.excerpt && /* @__PURE__ */ jsx("p", { className: unstyled ? "" : "sk-cluster-pillar-excerpt", children: pillar.excerpt }),
+        /* @__PURE__ */ jsxs("div", { className: unstyled ? "" : "sk-cluster-pillar-meta", children: [
+          pillar.reading_time_minutes && /* @__PURE__ */ jsxs("span", { children: [
+            pillar.reading_time_minutes,
+            " min read"
+          ] }),
+          pillar.word_count && /* @__PURE__ */ jsxs("span", { children: [
+            pillar.word_count.toLocaleString(),
+            " words"
+          ] })
+        ] })
+      ] }),
+      supports.length > 0 && /* @__PURE__ */ jsxs("section", { className: unstyled ? "" : "sk-cluster-supports-section", children: [
+        /* @__PURE__ */ jsx("h2", { className: unstyled ? "" : "sk-cluster-supports-title", children: "Deep Dives" }),
+        /* @__PURE__ */ jsx("div", { className: unstyled ? "" : "sk-cluster-supports-grid", children: supports.map((post) => /* @__PURE__ */ jsxs(
+          "a",
+          {
+            href: `${basePath}/${post.slug}`,
+            className: unstyled ? "" : "sk-cluster-support-card",
+            children: [
+              /* @__PURE__ */ jsxs("div", { className: unstyled ? "" : "sk-cluster-support-card-header", children: [
+                post.article_type && /* @__PURE__ */ jsx("span", { className: unstyled ? "" : "sk-cluster-support-type", children: post.article_type }),
+                post.search_intent && /* @__PURE__ */ jsx("span", { className: unstyled ? "" : "sk-cluster-support-intent", children: post.search_intent })
+              ] }),
+              /* @__PURE__ */ jsx("h3", { className: unstyled ? "" : "sk-cluster-support-title", children: post.title }),
+              post.excerpt && /* @__PURE__ */ jsx("p", { className: unstyled ? "" : "sk-cluster-support-excerpt", children: post.excerpt }),
+              /* @__PURE__ */ jsxs("div", { className: unstyled ? "" : "sk-cluster-support-meta", children: [
+                post.reading_time_minutes && /* @__PURE__ */ jsxs("span", { children: [
+                  post.reading_time_minutes,
+                  " min read"
+                ] }),
+                post.relationship_to_pillar && /* @__PURE__ */ jsx("span", { children: post.relationship_to_pillar })
+              ] })
+            ]
+          },
+          post.id || post.slug
+        )) })
+      ] })
+    ] })
+  ] });
+}
 
-export { BlogList, BlogPost, ClusterNavigation, ServiceCallout, ServiceCallouts, addExternalLinkTargets, normalizeSiteHost, resolveBlogSiteUrl };
-//# sourceMappingURL=chunk-T5UU7I4V.mjs.map
-//# sourceMappingURL=chunk-T5UU7I4V.mjs.map
+export { BlogList, BlogPost, ClusterLandingPage, ClusterNavigation, ServiceCallout, ServiceCallouts, addExternalLinkTargets, normalizeSiteHost, resolveBlogSiteUrl };
+//# sourceMappingURL=chunk-EHNJDXBY.mjs.map
+//# sourceMappingURL=chunk-EHNJDXBY.mjs.map