@fullstackdatasolutions/articles 0.4.2 → 0.5.0

package/dist/index.js

@@ -91,7 +91,7 @@ function ArticleCategoryGrid({ categories, pageSize = 8 }) {
 }
 
 // src/ArticleSchemas.tsx
-import { jsx as jsx2 } from "react/jsx-runtime";
+import { Fragment, jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
 function ArticleSchema({ article, articleUrl, siteName }) {
   const schema = __spreadProps(__spreadValues({
     "@context": "https://schema.org",
@@ -131,6 +131,86 @@ function BreadcrumbSchema({ items }) {
     }
   );
 }
+function ArticleSEO({ article, articleUrl, siteName, siteLogo }) {
+  const publishedAt = article.date ? new Date(article.date).toISOString() : void 0;
+  const modifiedAt = article.lastmod ? new Date(article.lastmod).toISOString() : publishedAt;
+  const structuredData = __spreadValues(__spreadProps(__spreadValues(__spreadValues({
+    "@context": "https://schema.org",
+    "@type": article.articleType || "Article",
+    mainEntityOfPage: { "@type": "WebPage", "@id": articleUrl },
+    headline: article.title,
+    image: article.featuredImage ? { "@type": "ImageObject", url: article.featuredImage } : void 0
+  }, publishedAt && { datePublished: publishedAt }), modifiedAt && { dateModified: modifiedAt }), {
+    author: { "@type": "Person", name: article.author },
+    publisher: __spreadValues({
+      "@type": "Organization",
+      name: siteName
+    }, siteLogo && { logo: { "@type": "ImageObject", url: siteLogo } }),
+    description: article.excerpt
+  }), article.series && { isPartOf: { "@type": "Blog", name: article.series } });
+  return /* @__PURE__ */ jsxs2(Fragment, { children: [
+    /* @__PURE__ */ jsx2(
+      "script",
+      {
+        type: "application/ld+json",
+        dangerouslySetInnerHTML: { __html: JSON.stringify(structuredData) }
+      }
+    ),
+    article.faq && article.faq.length > 0 && /* @__PURE__ */ jsx2(
+      "script",
+      {
+        type: "application/ld+json",
+        dangerouslySetInnerHTML: {
+          __html: JSON.stringify({
+            "@context": "https://schema.org",
+            "@type": "FAQPage",
+            mainEntity: article.faq.map(({ question, answer }) => ({
+              "@type": "Question",
+              name: question,
+              acceptedAnswer: { "@type": "Answer", text: answer }
+            }))
+          })
+        }
+      }
+    ),
+    article.howTo && article.howTo.length > 0 && /* @__PURE__ */ jsx2(
+      "script",
+      {
+        type: "application/ld+json",
+        dangerouslySetInnerHTML: {
+          __html: JSON.stringify({
+            "@context": "https://schema.org",
+            "@type": "HowTo",
+            name: article.title,
+            step: article.howTo.map(({ name, text }) => ({
+              "@type": "HowToStep",
+              name,
+              text
+            }))
+          })
+        }
+      }
+    )
+  ] });
+}
+function FAQPageSchema({ items }) {
+  const schema = {
+    "@context": "https://schema.org",
+    "@type": "FAQPage",
+    mainEntity: items.map(({ question, answer }) => ({
+      "@type": "Question",
+      name: question,
+      acceptedAnswer: { "@type": "Answer", text: answer }
+    }))
+  };
+  return /* @__PURE__ */ jsx2(
+    "script",
+    {
+      type: "application/ld+json",
+      dangerouslySetInnerHTML: { __html: JSON.stringify(schema) }
+    }
+  );
+}
 function CollectionPageSchema({
   title,
   description,
@@ -156,15 +236,15 @@ function CollectionPageSchema({
 
 // src/ArticleSearchBar.tsx
 import { Search, X } from "lucide-react";
-import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
+import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
 function ArticleSearchBar({
   value,
   onChange,
   disabled,
   resultCount
 }) {
-  return /* @__PURE__ */ jsx3("section", { className: "py-8 bg-background border-b border-border", children: /* @__PURE__ */ jsxs2("div", { className: "max-w-4xl mx-auto px-4 sm:px-6 lg:px-8", children: [
-    /* @__PURE__ */ jsxs2("div", { className: "relative", children: [
+  return /* @__PURE__ */ jsx3("section", { className: "py-8 bg-background border-b border-border", children: /* @__PURE__ */ jsxs3("div", { className: "max-w-4xl mx-auto px-4 sm:px-6 lg:px-8", children: [
+    /* @__PURE__ */ jsxs3("div", { className: "relative", children: [
       /* @__PURE__ */ jsx3(Search, { className: "absolute left-3 top-1/2 transform -translate-y-1/2 text-muted-foreground h-5 w-5" }),
       /* @__PURE__ */ jsx3(
         "input",
@@ -194,17 +274,17 @@ function ArticleSearchBar({
 
 // src/ArticlesHero.tsx
 import Link2 from "next/link";
-import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
+import { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
 var DEFAULT_TITLE = "Vox Populus Insights";
 var DEFAULT_DESCRIPTION = "Expert analysis, campaign strategies, and voter engagement insights from the frontlines of democracy.";
 function ArticlesHero({
   title = DEFAULT_TITLE,
   description = DEFAULT_DESCRIPTION
 }) {
-  return /* @__PURE__ */ jsx4("section", { className: "bg-linear-to-r from-gray-50 to-gray-100 py-16 md:py-24", children: /* @__PURE__ */ jsx4("div", { className: "max-w-7xl mx-auto px-4 sm:px-6 lg:px-8", children: /* @__PURE__ */ jsxs3("div", { className: "max-w-3xl mx-auto text-center", children: [
+  return /* @__PURE__ */ jsx4("section", { className: "bg-linear-to-r from-gray-50 to-gray-100 py-16 md:py-24", children: /* @__PURE__ */ jsx4("div", { className: "max-w-7xl mx-auto px-4 sm:px-6 lg:px-8", children: /* @__PURE__ */ jsxs4("div", { className: "max-w-3xl mx-auto text-center", children: [
     /* @__PURE__ */ jsx4("h1", { className: "text-4xl md:text-5xl font-bold text-foreground mb-6", children: title }),
     /* @__PURE__ */ jsx4("p", { className: "text-xl text-muted-foreground mb-8", children: description }),
-    /* @__PURE__ */ jsxs3("div", { className: "flex flex-col sm:flex-row gap-4 justify-center", children: [
+    /* @__PURE__ */ jsxs4("div", { className: "flex flex-col sm:flex-row gap-4 justify-center", children: [
       /* @__PURE__ */ jsx4(
         Link2,
         {
@@ -229,28 +309,28 @@ function ArticlesHero({
 import Link3 from "next/link";
 import Image2 from "next/image";
 import { ArrowRight, Calendar, Clock, User } from "lucide-react";
-import { jsx as jsx5, jsxs as jsxs4 } from "react/jsx-runtime";
+import { jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
 function FeaturedArticle({ article }) {
-  return /* @__PURE__ */ jsx5("section", { className: "py-16 bg-background", children: /* @__PURE__ */ jsx5("div", { className: "max-w-7xl mx-auto px-4 sm:px-6 lg:px-8", children: /* @__PURE__ */ jsxs4("div", { className: "grid lg:grid-cols-2 gap-12 items-center", children: [
-    /* @__PURE__ */ jsxs4("div", { children: [
+  return /* @__PURE__ */ jsx5("section", { className: "py-16 bg-background", children: /* @__PURE__ */ jsx5("div", { className: "max-w-7xl mx-auto px-4 sm:px-6 lg:px-8", children: /* @__PURE__ */ jsxs5("div", { className: "grid lg:grid-cols-2 gap-12 items-center", children: [
+    /* @__PURE__ */ jsxs5("div", { children: [
       /* @__PURE__ */ jsx5("span", { className: "inline-block bg-primary/10 text-primary text-sm font-medium px-3 py-1 rounded-full mb-4", children: "FEATURED ARTICLE" }),
       /* @__PURE__ */ jsx5("h2", { className: "text-3xl font-bold text-foreground mb-4", children: article.title }),
       /* @__PURE__ */ jsx5("p", { className: "text-lg text-muted-foreground mb-6", children: article.excerpt }),
-      /* @__PURE__ */ jsxs4("div", { className: "flex items-center gap-6 text-sm text-muted-foreground mb-6", children: [
-        article.date && /* @__PURE__ */ jsxs4("div", { className: "flex items-center gap-2", children: [
+      /* @__PURE__ */ jsxs5("div", { className: "flex items-center gap-6 text-sm text-muted-foreground mb-6", children: [
+        article.date && /* @__PURE__ */ jsxs5("div", { className: "flex items-center gap-2", children: [
           /* @__PURE__ */ jsx5(Calendar, { className: "h-4 w-4" }),
           /* @__PURE__ */ jsx5("span", { children: article.date })
         ] }),
-        /* @__PURE__ */ jsxs4("div", { className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ jsxs5("div", { className: "flex items-center gap-2", children: [
           /* @__PURE__ */ jsx5(Clock, { className: "h-4 w-4" }),
           /* @__PURE__ */ jsx5("span", { children: article.readTime })
         ] }),
-        /* @__PURE__ */ jsxs4("div", { className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ jsxs5("div", { className: "flex items-center gap-2", children: [
           /* @__PURE__ */ jsx5(User, { className: "h-4 w-4" }),
           /* @__PURE__ */ jsx5("span", { children: article.author })
         ] })
       ] }),
-      /* @__PURE__ */ jsxs4(
+      /* @__PURE__ */ jsxs5(
         Link3,
         {
           href: `/articles/${article.slug}`,
@@ -262,7 +342,7 @@ function FeaturedArticle({ article }) {
         }
       )
     ] }),
-    /* @__PURE__ */ jsxs4("div", { className: "bg-card rounded-lg p-8", children: [
+    /* @__PURE__ */ jsxs5("div", { className: "bg-card rounded-lg p-8", children: [
       /* @__PURE__ */ jsx5(
         Image2,
         {
@@ -288,9 +368,9 @@ import { useState as useState2, useEffect as useEffect2 } from "react";
 import Image3 from "next/image";
 import Link4 from "next/link";
 import { ArrowRight as ArrowRight2, Calendar as Calendar2, Clock as Clock2 } from "lucide-react";
-import { jsx as jsx6, jsxs as jsxs5 } from "react/jsx-runtime";
+import { jsx as jsx6, jsxs as jsxs6 } from "react/jsx-runtime";
 function ArticleCard({ article }) {
-  return /* @__PURE__ */ jsxs5("div", { className: "rounded-lg border border-border bg-card text-card-foreground shadow-sm hover:shadow-lg transition-shadow duration-300", children: [
+  return /* @__PURE__ */ jsxs6("div", { className: "rounded-lg border border-border bg-card text-card-foreground shadow-sm hover:shadow-lg transition-shadow duration-300", children: [
     /* @__PURE__ */ jsx6("div", { className: "p-0", children: /* @__PURE__ */ jsx6(
       Image3,
       {
@@ -301,7 +381,7 @@ function ArticleCard({ article }) {
         height: 200
       }
     ) }),
-    /* @__PURE__ */ jsxs5("div", { className: "p-6", children: [
+    /* @__PURE__ */ jsxs6("div", { className: "p-6", children: [
       /* @__PURE__ */ jsx6("div", { className: "flex gap-2 mb-3", children: /* @__PURE__ */ jsx6("span", { className: "bg-primary/10 text-primary text-xs font-medium px-2 py-1 rounded", children: article.category }) }),
       /* @__PURE__ */ jsx6("h3", { className: "text-lg font-semibold leading-none tracking-tight mb-2", children: /* @__PURE__ */ jsx6(
         Link4,
@@ -312,13 +392,13 @@ function ArticleCard({ article }) {
         }
       ) }),
       /* @__PURE__ */ jsx6("p", { className: "text-muted-foreground mb-4 line-clamp-3", children: article.excerpt }),
-      /* @__PURE__ */ jsxs5("div", { className: "flex items-center justify-between text-sm text-muted-foreground border-t pt-4", children: [
-        /* @__PURE__ */ jsxs5("div", { className: "flex items-center gap-3", children: [
-          article.date && /* @__PURE__ */ jsxs5("div", { className: "flex items-center gap-2", children: [
+      /* @__PURE__ */ jsxs6("div", { className: "flex items-center justify-between text-sm text-muted-foreground border-t pt-4", children: [
+        /* @__PURE__ */ jsxs6("div", { className: "flex items-center gap-3", children: [
+          article.date && /* @__PURE__ */ jsxs6("div", { className: "flex items-center gap-2", children: [
             /* @__PURE__ */ jsx6(Calendar2, { className: "h-3 w-3" }),
             /* @__PURE__ */ jsx6("span", { children: article.date })
           ] }),
-          /* @__PURE__ */ jsxs5("div", { className: "flex items-center gap-2", children: [
+          /* @__PURE__ */ jsxs6("div", { className: "flex items-center gap-2", children: [
             /* @__PURE__ */ jsx6(Clock2, { className: "h-3 w-3" }),
             /* @__PURE__ */ jsx6("span", { children: article.readTime })
           ] })
@@ -338,7 +418,7 @@ function ArticleCard({ article }) {
 }
 
 // src/LatestArticles.tsx
-import { jsx as jsx7, jsxs as jsxs6 } from "react/jsx-runtime";
+import { jsx as jsx7, jsxs as jsxs7 } from "react/jsx-runtime";
 function LatestArticles({ articles, pageSize }) {
   const [visibleCount, setVisibleCount] = useState2(pageSize);
   useEffect2(() => {
@@ -346,7 +426,7 @@ function LatestArticles({ articles, pageSize }) {
   }, [articles, pageSize]);
   const visible = articles.slice(0, visibleCount);
   const hasMore = visibleCount < articles.length;
-  return /* @__PURE__ */ jsxs6("div", { children: [
+  return /* @__PURE__ */ jsxs7("div", { children: [
     /* @__PURE__ */ jsx7("div", { className: "grid md:grid-cols-2 lg:grid-cols-3 gap-8", children: visible.map((article) => /* @__PURE__ */ jsx7(ArticleCard, { article }, article.slug)) }),
     hasMore && /* @__PURE__ */ jsx7("div", { className: "mt-10 text-center", children: /* @__PURE__ */ jsx7(
       "button",
@@ -361,7 +441,7 @@ function LatestArticles({ articles, pageSize }) {
 }
 
 // src/LatestArticlesSection.tsx
-import { jsx as jsx8, jsxs as jsxs7 } from "react/jsx-runtime";
+import { jsx as jsx8, jsxs as jsxs8 } from "react/jsx-runtime";
 function DescriptionText({
   searchQuery,
   count
@@ -376,15 +456,15 @@ function LatestArticlesSection({
   onClearSearch,
   pageSize = 6
 }) {
-  return /* @__PURE__ */ jsx8("section", { id: "latest", className: "py-16 bg-muted/50", children: /* @__PURE__ */ jsxs7("div", { className: "max-w-7xl mx-auto px-4 sm:px-6 lg:px-8", children: [
-    /* @__PURE__ */ jsxs7("div", { className: "text-center mb-12", children: [
+  return /* @__PURE__ */ jsx8("section", { id: "latest", className: "py-16 bg-muted/50", children: /* @__PURE__ */ jsxs8("div", { className: "max-w-7xl mx-auto px-4 sm:px-6 lg:px-8", children: [
+    /* @__PURE__ */ jsxs8("div", { className: "text-center mb-12", children: [
       /* @__PURE__ */ jsx8("h2", { className: "text-3xl font-bold text-foreground mb-4", children: searchQuery ? "Search Results" : "Latest Articles" }),
       /* @__PURE__ */ jsx8(DescriptionText, { searchQuery, count: articles.length })
     ] }),
-    articles.length === 0 && searchQuery ? /* @__PURE__ */ jsx8("div", { className: "text-center py-12", children: /* @__PURE__ */ jsxs7("div", { className: "max-w-md mx-auto", children: [
+    articles.length === 0 && searchQuery ? /* @__PURE__ */ jsx8("div", { className: "text-center py-12", children: /* @__PURE__ */ jsxs8("div", { className: "max-w-md mx-auto", children: [
       /* @__PURE__ */ jsx8(Search2, { className: "h-12 w-12 text-muted-foreground mx-auto mb-4" }),
       /* @__PURE__ */ jsx8("h3", { className: "text-lg font-semibold text-foreground mb-2", children: "No articles found" }),
-      /* @__PURE__ */ jsxs7("p", { className: "text-muted-foreground mb-4", children: [
+      /* @__PURE__ */ jsxs8("p", { className: "text-muted-foreground mb-4", children: [
         `We couldn't find any articles matching "`,
         searchQuery,
         '". Try adjusting your search terms.'
@@ -482,7 +562,7 @@ function useArticles() {
 }
 
 // src/ArticlesPage.tsx
-import { jsx as jsx9, jsxs as jsxs8 } from "react/jsx-runtime";
+import { jsx as jsx9, jsxs as jsxs9 } from "react/jsx-runtime";
 function buildThemeVars(theme) {
   if (!theme) return {};
   const vars = {};
@@ -538,13 +618,13 @@ function renderSection(section, ctx, config) {
       return articles.length > 0 && !searchQuery ? /* @__PURE__ */ jsx9(FeaturedArticle, { article: articles[0] }, "featured") : null;
     case "latest":
       if (loading && articles.length === 0) {
-        return /* @__PURE__ */ jsx9("section", { id: "latest", className: "py-16 bg-muted/50 flex-1", children: /* @__PURE__ */ jsx9("div", { className: "max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 flex items-center justify-center py-24", children: /* @__PURE__ */ jsxs8("div", { className: "text-center", children: [
+        return /* @__PURE__ */ jsx9("section", { id: "latest", className: "py-16 bg-muted/50 flex-1", children: /* @__PURE__ */ jsx9("div", { className: "max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 flex items-center justify-center py-24", children: /* @__PURE__ */ jsxs9("div", { className: "text-center", children: [
           /* @__PURE__ */ jsx9("div", { className: "animate-spin rounded-full h-12 w-12 border-b-2 border-primary mx-auto mb-4" }),
           /* @__PURE__ */ jsx9("p", { className: "text-muted-foreground", children: "Loading articles..." })
         ] }) }) }, "latest");
       }
       if (error) {
-        return /* @__PURE__ */ jsx9("section", { id: "latest", className: "py-16 bg-muted/50 flex-1", children: /* @__PURE__ */ jsx9("div", { className: "max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 flex items-center justify-center", children: /* @__PURE__ */ jsxs8("div", { className: "bg-red-50 border border-red-200 rounded-lg p-6 max-w-md text-center", children: [
+        return /* @__PURE__ */ jsx9("section", { id: "latest", className: "py-16 bg-muted/50 flex-1", children: /* @__PURE__ */ jsx9("div", { className: "max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 flex items-center justify-center", children: /* @__PURE__ */ jsxs9("div", { className: "bg-red-50 border border-red-200 rounded-lg p-6 max-w-md text-center", children: [
           /* @__PURE__ */ jsx9("h3", { className: "text-lg font-semibold text-red-800 mb-2", children: "Error Loading Articles" }),
           /* @__PURE__ */ jsx9("p", { className: "text-red-600 mb-4", children: error }),
           /* @__PURE__ */ jsx9(
@@ -593,7 +673,7 @@ function ArticlesPage({ config }) {
   const articlesWithoutFeatured = hasFeatured ? state.articles.slice(1) : state.articles;
   const displayedArticles = state.searchQuery ? state.articles : articlesWithoutFeatured;
   const ctx = __spreadProps(__spreadValues({}, state), { displayedArticles, pageSize, categoriesPageSize });
-  return /* @__PURE__ */ jsxs8("div", { style: themeVars, children: [
+  return /* @__PURE__ */ jsxs9("div", { style: themeVars, children: [
     layout.map((section) => renderSection(section, ctx, config)),
     state.articles.length > 0 && /* @__PURE__ */ jsx9(
       CollectionPageSchema,
@@ -611,7 +691,7 @@ function ArticlesPage({ config }) {
 import Image4 from "next/image";
 import Link5 from "next/link";
 import { Calendar as Calendar3, Clock as Clock3, User as User2 } from "lucide-react";
-import { jsx as jsx10, jsxs as jsxs9 } from "react/jsx-runtime";
+import { jsx as jsx10, jsxs as jsxs10 } from "react/jsx-runtime";
 function toSlug(cat) {
   return cat.toLowerCase().replaceAll(/\s+/g, "-").replaceAll(/[^a-z0-9-]/g, "");
 }
@@ -620,7 +700,7 @@ function ArticleDetailHero({
   categoryBasePath = "/articles/category",
   showDate = false
 }) {
-  return /* @__PURE__ */ jsxs9(
+  return /* @__PURE__ */ jsxs10(
     "section",
     {
       style: {
@@ -654,7 +734,7 @@ function ArticleDetailHero({
             }
           }
         ),
-        /* @__PURE__ */ jsxs9(
+        /* @__PURE__ */ jsxs10(
           "div",
           {
             style: {
@@ -699,7 +779,7 @@ function ArticleDetailHero({
                 }
               ),
               /* @__PURE__ */ jsx10("h1", { className: "text-4xl md:text-5xl font-bold mb-4", children: article.title }),
-              /* @__PURE__ */ jsxs9(
+              /* @__PURE__ */ jsxs10(
                 "div",
                 {
                   style: {
@@ -711,17 +791,17 @@ function ArticleDetailHero({
                     color: "rgba(255,255,255,0.8)"
                   },
                   children: [
-                    showDate && article.date && /* @__PURE__ */ jsxs9("div", { style: { display: "flex", alignItems: "center", gap: "0.5rem" }, children: [
+                    showDate && article.date && /* @__PURE__ */ jsxs10("div", { style: { display: "flex", alignItems: "center", gap: "0.5rem" }, children: [
                       /* @__PURE__ */ jsx10(Calendar3, { className: "h-4 w-4" }),
                       /* @__PURE__ */ jsx10("span", { children: article.date })
                     ] }),
-                    /* @__PURE__ */ jsxs9("div", { style: { display: "flex", alignItems: "center", gap: "0.5rem" }, children: [
+                    /* @__PURE__ */ jsxs10("div", { style: { display: "flex", alignItems: "center", gap: "0.5rem" }, children: [
                       /* @__PURE__ */ jsx10(Clock3, { className: "h-4 w-4" }),
                       /* @__PURE__ */ jsx10("span", { children: article.readTime })
                     ] }),
-                    /* @__PURE__ */ jsxs9("div", { style: { display: "flex", alignItems: "center", gap: "0.5rem" }, children: [
+                    /* @__PURE__ */ jsxs10("div", { style: { display: "flex", alignItems: "center", gap: "0.5rem" }, children: [
                       /* @__PURE__ */ jsx10(User2, { className: "h-4 w-4" }),
-                      /* @__PURE__ */ jsxs9("span", { children: [
+                      /* @__PURE__ */ jsxs10("span", { children: [
                         "By ",
                         article.author
                       ] })
@@ -740,7 +820,7 @@ function ArticleDetailHero({
 // src/CategoryArticlesPage.tsx
 import Image5 from "next/image";
 import Link6 from "next/link";
-import { jsx as jsx11, jsxs as jsxs10 } from "react/jsx-runtime";
+import { jsx as jsx11, jsxs as jsxs11 } from "react/jsx-runtime";
 function getCategoryDescription(config, slug, categoryName) {
   var _a;
   const raw = (_a = config.categoryDescriptions) == null ? void 0 : _a[slug];
@@ -756,7 +836,7 @@ function CategoryArticlesPage({ category, articles, config }) {
   const description = getCategoryDescription(config, category, categoryName);
   const pageSize = (_a = config.pageSize) != null ? _a : DEFAULT_PAGE_SIZE;
   const siteUrl = config.siteUrl.replace(/\/$/, "");
-  return /* @__PURE__ */ jsxs10("div", { children: [
+  return /* @__PURE__ */ jsxs11("div", { children: [
     /* @__PURE__ */ jsx11(
       BreadcrumbSchema,
       {
@@ -767,7 +847,7 @@ function CategoryArticlesPage({ category, articles, config }) {
         ]
       }
     ),
-    /* @__PURE__ */ jsxs10(
+    /* @__PURE__ */ jsxs11(
       "section",
       {
         style: {
@@ -791,7 +871,7 @@ function CategoryArticlesPage({ category, articles, config }) {
             }
           ),
           /* @__PURE__ */ jsx11("div", { style: { position: "absolute", inset: 0, backgroundColor: "rgba(0,0,0,0.6)" } }),
-          /* @__PURE__ */ jsxs10(
+          /* @__PURE__ */ jsxs11(
             "div",
             {
               style: {
@@ -805,7 +885,7 @@ function CategoryArticlesPage({ category, articles, config }) {
                 /* @__PURE__ */ jsx11("p", { className: "text-sm font-semibold uppercase tracking-widest mb-3 opacity-80", children: "Category" }),
                 /* @__PURE__ */ jsx11("h1", { className: "text-4xl md:text-5xl font-bold mb-3", children: categoryName }),
                 description.long && /* @__PURE__ */ jsx11("p", { className: "text-lg opacity-90 max-w-2xl mx-auto mt-2", children: description.long }),
-                /* @__PURE__ */ jsxs10("p", { className: "text-lg opacity-70 mt-2", children: [
+                /* @__PURE__ */ jsxs11("p", { className: "text-lg opacity-70 mt-2", children: [
                   articles.length,
                   " article",
                   articles.length === 1 ? "" : "s"
@@ -816,8 +896,8 @@ function CategoryArticlesPage({ category, articles, config }) {
         ]
       }
     ),
-    /* @__PURE__ */ jsx11("section", { className: "py-16 bg-muted/50 flex-1", children: /* @__PURE__ */ jsxs10("div", { className: "max-w-7xl mx-auto px-4 sm:px-6 lg:px-8", children: [
-      /* @__PURE__ */ jsxs10("div", { className: "mb-8 flex items-center justify-between", children: [
+    /* @__PURE__ */ jsx11("section", { className: "py-16 bg-muted/50 flex-1", children: /* @__PURE__ */ jsxs11("div", { className: "max-w-7xl mx-auto px-4 sm:px-6 lg:px-8", children: [
+      /* @__PURE__ */ jsxs11("div", { className: "mb-8 flex items-center justify-between", children: [
         /* @__PURE__ */ jsx11(Link6, { href: "/articles", className: "text-sm text-primary hover:underline", children: "\u2190 All Articles" }),
         /* @__PURE__ */ jsx11("p", { className: "text-sm text-muted-foreground", children: description.short })
       ] }),
@@ -829,7 +909,7 @@ function CategoryArticlesPage({ category, articles, config }) {
 // src/ArticleSocialShare.tsx
 import { useState as useState4 } from "react";
 import { Share2, Copy, Check, Mail, MessageCircle, Users, FileText } from "lucide-react";
-import { jsx as jsx12, jsxs as jsxs11 } from "react/jsx-runtime";
+import { jsx as jsx12, jsxs as jsxs12 } from "react/jsx-runtime";
 function ArticleSocialShare({ title, url, excerpt, shareMessage }) {
   const [copied, setCopied] = useState4(false);
   const encodedTitle = encodeURIComponent(title);
@@ -853,40 +933,40 @@ function ArticleSocialShare({ title, url, excerpt, shareMessage }) {
     }
   });
   const openShareWindow = (shareUrl) => {
-    window.open(shareUrl, "_blank", "width=600,height=400,scrollbars=yes,resizable=yes");
+    globalThis.open(shareUrl, "_blank", "width=600,height=400,scrollbars=yes,resizable=yes");
   };
   const btnClass = "inline-flex items-center gap-2 px-3 py-1.5 text-sm rounded-md border border-border bg-background text-foreground hover:bg-primary/10 hover:border-primary hover:text-primary transition-colors cursor-pointer";
-  return /* @__PURE__ */ jsxs11("div", { className: "border-t border-border pt-8 mt-8", children: [
-    /* @__PURE__ */ jsxs11("div", { className: "flex items-center gap-2 mb-4", children: [
+  return /* @__PURE__ */ jsxs12("div", { className: "border-t border-border pt-8 mt-8", children: [
+    /* @__PURE__ */ jsxs12("div", { className: "flex items-center gap-2 mb-4", children: [
       /* @__PURE__ */ jsx12(Share2, { className: "h-5 w-5 text-muted-foreground" }),
       /* @__PURE__ */ jsx12("h3", { className: "text-lg font-semibold text-foreground", children: "Share this article" })
     ] }),
-    /* @__PURE__ */ jsxs11("div", { className: "flex flex-wrap gap-2", children: [
-      /* @__PURE__ */ jsxs11("button", { className: btnClass, onClick: () => openShareWindow(shareLinks.linkedin), children: [
+    /* @__PURE__ */ jsxs12("div", { className: "flex flex-wrap gap-2", children: [
+      /* @__PURE__ */ jsxs12("button", { className: btnClass, onClick: () => openShareWindow(shareLinks.linkedin), children: [
         /* @__PURE__ */ jsx12(Users, { className: "h-4 w-4" }),
         "LinkedIn"
       ] }),
-      /* @__PURE__ */ jsxs11("button", { className: btnClass, onClick: () => openShareWindow(shareLinks.facebook), children: [
+      /* @__PURE__ */ jsxs12("button", { className: btnClass, onClick: () => openShareWindow(shareLinks.facebook), children: [
         /* @__PURE__ */ jsx12("span", { className: "text-xs font-bold", children: "f" }),
         " Facebook"
       ] }),
-      /* @__PURE__ */ jsxs11("button", { className: btnClass, onClick: () => openShareWindow(shareLinks.twitter), children: [
+      /* @__PURE__ */ jsxs12("button", { className: btnClass, onClick: () => openShareWindow(shareLinks.twitter), children: [
         /* @__PURE__ */ jsx12(MessageCircle, { className: "h-4 w-4" }),
         "Twitter"
       ] }),
-      /* @__PURE__ */ jsxs11("button", { className: btnClass, onClick: () => openShareWindow(shareLinks.reddit), children: [
+      /* @__PURE__ */ jsxs12("button", { className: btnClass, onClick: () => openShareWindow(shareLinks.reddit), children: [
         /* @__PURE__ */ jsx12(FileText, { className: "h-4 w-4" }),
         "Reddit"
       ] }),
-      /* @__PURE__ */ jsxs11("button", { className: btnClass, onClick: () => openShareWindow(shareLinks.whatsapp), children: [
+      /* @__PURE__ */ jsxs12("button", { className: btnClass, onClick: () => openShareWindow(shareLinks.whatsapp), children: [
         /* @__PURE__ */ jsx12(MessageCircle, { className: "h-4 w-4" }),
         "WhatsApp"
       ] }),
-      /* @__PURE__ */ jsxs11("button", { className: btnClass, onClick: () => openShareWindow(shareLinks.telegram), children: [
+      /* @__PURE__ */ jsxs12("button", { className: btnClass, onClick: () => openShareWindow(shareLinks.telegram), children: [
         /* @__PURE__ */ jsx12(MessageCircle, { className: "h-4 w-4" }),
         "Telegram"
       ] }),
-      /* @__PURE__ */ jsxs11(
+      /* @__PURE__ */ jsxs12(
         "button",
         {
           className: btnClass,
@@ -899,7 +979,7 @@ function ArticleSocialShare({ title, url, excerpt, shareMessage }) {
           ]
         }
       ),
-      /* @__PURE__ */ jsxs11("button", { className: btnClass, onClick: copyToClipboard, children: [
+      /* @__PURE__ */ jsxs12("button", { className: btnClass, onClick: copyToClipboard, children: [
         copied ? /* @__PURE__ */ jsx12(Check, { className: "h-4 w-4" }) : /* @__PURE__ */ jsx12(Copy, { className: "h-4 w-4" }),
         copied ? "Copied!" : "Copy Link"
       ] })
@@ -911,34 +991,34 @@ function ArticleSocialShare({ title, url, excerpt, shareMessage }) {
 // src/ArticleNavigation.tsx
 import Link7 from "next/link";
 import { ChevronLeft, ChevronRight } from "lucide-react";
-import { jsx as jsx13, jsxs as jsxs12 } from "react/jsx-runtime";
+import { jsx as jsx13, jsxs as jsxs13 } from "react/jsx-runtime";
 function truncateTitle(title, maxLength = 60) {
   return title.length > maxLength ? `${title.substring(0, maxLength)}...` : title;
 }
 function ArticleNavigation({ previous, next, basePath }) {
   if (!previous && !next) return null;
-  return /* @__PURE__ */ jsx13("nav", { className: "mt-12 pt-8 border-t border-border", "aria-label": "Article navigation", children: /* @__PURE__ */ jsxs12("div", { className: "flex justify-between gap-4", children: [
-    /* @__PURE__ */ jsx13("div", { className: "flex-1 min-w-0", children: previous && /* @__PURE__ */ jsxs12(
+  return /* @__PURE__ */ jsx13("nav", { className: "mt-12 pt-8 border-t border-border", "aria-label": "Article navigation", children: /* @__PURE__ */ jsxs13("div", { className: "flex justify-between gap-4", children: [
+    /* @__PURE__ */ jsx13("div", { className: "flex-1 min-w-0", children: previous && /* @__PURE__ */ jsxs13(
       Link7,
       {
         href: `${basePath}/${previous.slug}`,
         className: "group flex items-center gap-3 p-4 rounded-lg border border-border hover:border-primary/20 hover:bg-muted/50 transition-colors",
         children: [
           /* @__PURE__ */ jsx13(ChevronLeft, { className: "h-5 w-5 text-muted-foreground group-hover:text-primary shrink-0" }),
-          /* @__PURE__ */ jsxs12("div", { className: "min-w-0 flex-1", children: [
+          /* @__PURE__ */ jsxs13("div", { className: "min-w-0 flex-1", children: [
             /* @__PURE__ */ jsx13("div", { className: "text-sm text-muted-foreground mb-1", children: "Previous Article" }),
             /* @__PURE__ */ jsx13("div", { className: "font-medium text-foreground truncate", title: previous.title, children: truncateTitle(previous.title) })
           ] })
         ]
       }
     ) }),
-    /* @__PURE__ */ jsx13("div", { className: "flex-1 min-w-0", children: next && /* @__PURE__ */ jsxs12(
+    /* @__PURE__ */ jsx13("div", { className: "flex-1 min-w-0", children: next && /* @__PURE__ */ jsxs13(
       Link7,
       {
         href: `${basePath}/${next.slug}`,
         className: "group flex items-center justify-end gap-3 p-4 rounded-lg border border-border hover:border-primary/20 hover:bg-muted/50 transition-colors",
         children: [
-          /* @__PURE__ */ jsxs12("div", { className: "min-w-0 flex-1 text-right", children: [
+          /* @__PURE__ */ jsxs13("div", { className: "min-w-0 flex-1 text-right", children: [
             /* @__PURE__ */ jsx13("div", { className: "text-sm text-muted-foreground mb-1", children: "Next Article" }),
             /* @__PURE__ */ jsx13("div", { className: "font-medium text-foreground truncate", title: next.title, children: truncateTitle(next.title) })
           ] }),
@@ -949,13 +1029,60 @@ function ArticleNavigation({ previous, next, basePath }) {
   ] }) });
 }
 
+// src/ArticleTOC.tsx
+import { jsx as jsx14, jsxs as jsxs14 } from "react/jsx-runtime";
+function ArticleTOC({ toc, className }) {
+  if (!toc.length) return null;
+  return /* @__PURE__ */ jsxs14(
+    "nav",
+    {
+      "aria-label": "Table of contents",
+      className: `mb-8 rounded-lg border border-border bg-muted/40 px-6 py-4 ${className != null ? className : ""}`,
+      children: [
+        /* @__PURE__ */ jsx14("p", { className: "mb-3 text-sm font-semibold uppercase tracking-wide text-muted-foreground", children: "On this page" }),
+        /* @__PURE__ */ jsx14("ul", { className: "space-y-1 text-sm", children: toc.map((item) => /* @__PURE__ */ jsx14("li", { style: { paddingLeft: `${Math.max(0, item.depth - 2) * 1}rem` }, children: /* @__PURE__ */ jsx14(
+          "a",
+          {
+            href: `#${item.id}`,
+            className: "text-muted-foreground hover:text-foreground transition-colors",
+            children: item.text
+          }
+        ) }, item.id)) })
+      ]
+    }
+  );
+}
+
+// src/ScrollToTop.tsx
+import { useEffect as useEffect4, useState as useState5 } from "react";
+import { ArrowUp } from "lucide-react";
+import { jsx as jsx15 } from "react/jsx-runtime";
+function ScrollToTop() {
+  const [visible, setVisible] = useState5(false);
+  useEffect4(() => {
+    const onScroll = () => setVisible(globalThis.scrollY > 300);
+    globalThis.addEventListener("scroll", onScroll, { passive: true });
+    return () => globalThis.removeEventListener("scroll", onScroll);
+  }, []);
+  if (!visible) return null;
+  return /* @__PURE__ */ jsx15(
+    "button",
+    {
+      "aria-label": "Scroll to top",
+      onClick: () => globalThis.scrollTo({ top: 0, behavior: "smooth" }),
+      className: "fixed bottom-8 right-8 z-50 rounded-full bg-primary p-2 shadow-md text-primary-foreground hover:bg-primary/90 transition-colors",
+      children: /* @__PURE__ */ jsx15(ArrowUp, { className: "h-5 w-5" })
+    }
+  );
+}
+
 // src/CommentsSection.tsx
 import { useSession, signIn } from "next-auth/react";
-import { useCallback as useCallback2, useEffect as useEffect4, useState as useState7 } from "react";
+import { useCallback as useCallback2, useEffect as useEffect5, useState as useState8 } from "react";
 
 // src/CommentForm.tsx
-import { useState as useState5 } from "react";
-import { jsx as jsx14, jsxs as jsxs13 } from "react/jsx-runtime";
+import { useState as useState6 } from "react";
+import { jsx as jsx16, jsxs as jsxs15 } from "react/jsx-runtime";
 var MAX_LENGTH = 2e3;
 var WARN_THRESHOLD = 1800;
 function submitLabel(submitting, parentId) {
@@ -963,9 +1090,9 @@ function submitLabel(submitting, parentId) {
   return parentId ? "Reply" : "Post comment";
 }
 function CommentForm({ articleSlug, parentId, onSuccess, onCancel }) {
-  const [body, setBody] = useState5("");
-  const [submitting, setSubmitting] = useState5(false);
-  const [error, setError] = useState5(null);
+  const [body, setBody] = useState6("");
+  const [submitting, setSubmitting] = useState6(false);
+  const [error, setError] = useState6(null);
   const remaining = MAX_LENGTH - body.length;
   function handleSubmit(e) {
     return __async(this, null, function* () {
@@ -994,8 +1121,8 @@ function CommentForm({ articleSlug, parentId, onSuccess, onCancel }) {
       }
     });
   }
-  return /* @__PURE__ */ jsxs13("form", { onSubmit: handleSubmit, className: "space-y-2", children: [
-    /* @__PURE__ */ jsx14(
+  return /* @__PURE__ */ jsxs15("form", { onSubmit: handleSubmit, className: "space-y-2", children: [
+    /* @__PURE__ */ jsx16(
       "textarea",
       {
         value: body,
@@ -1008,13 +1135,13 @@ function CommentForm({ articleSlug, parentId, onSuccess, onCancel }) {
         "aria-label": parentId ? "Reply text" : "Comment text"
       }
     ),
-    remaining <= MAX_LENGTH - WARN_THRESHOLD && /* @__PURE__ */ jsxs13("p", { className: `text-xs ${remaining < 0 ? "text-destructive" : "text-muted-foreground"}`, children: [
+    remaining <= MAX_LENGTH - WARN_THRESHOLD && /* @__PURE__ */ jsxs15("p", { className: `text-xs ${remaining < 0 ? "text-destructive" : "text-muted-foreground"}`, children: [
       remaining,
       " characters remaining"
     ] }),
-    error && /* @__PURE__ */ jsx14("p", { className: "text-xs text-destructive", children: error }),
-    /* @__PURE__ */ jsxs13("div", { className: "flex gap-2", children: [
-      /* @__PURE__ */ jsx14(
+    error && /* @__PURE__ */ jsx16("p", { className: "text-xs text-destructive", children: error }),
+    /* @__PURE__ */ jsxs15("div", { className: "flex gap-2", children: [
+      /* @__PURE__ */ jsx16(
         "button",
         {
           type: "submit",
@@ -1023,7 +1150,7 @@ function CommentForm({ articleSlug, parentId, onSuccess, onCancel }) {
           children: submitLabel(submitting, parentId)
         }
       ),
-      onCancel && /* @__PURE__ */ jsx14(
+      onCancel && /* @__PURE__ */ jsx16(
         "button",
         {
           type: "button",
@@ -1037,8 +1164,8 @@ function CommentForm({ articleSlug, parentId, onSuccess, onCancel }) {
 }
 
 // src/CommentItem.tsx
-import { useState as useState6 } from "react";
-import { Fragment, jsx as jsx15, jsxs as jsxs14 } from "react/jsx-runtime";
+import { useState as useState7 } from "react";
+import { Fragment as Fragment2, jsx as jsx17, jsxs as jsxs16 } from "react/jsx-runtime";
 function relativeTime(iso) {
   const diff = Date.now() - new Date(iso).getTime();
   const minutes = Math.floor(diff / 6e4);
@@ -1059,8 +1186,8 @@ function CommentItem({
   isReply = false,
   onRefresh
 }) {
-  const [showReplyForm, setShowReplyForm] = useState6(false);
-  const [deleting, setDeleting] = useState6(false);
+  const [showReplyForm, setShowReplyForm] = useState7(false);
+  const [deleting, setDeleting] = useState7(false);
   const replies = "replies" in comment ? comment.replies : [];
   const canReply = !isReply && !!currentUserId && !comment.isDeleted;
   const canDelete = !!currentUserId && currentUserId === comment.authorId && !comment.isDeleted;
@@ -1076,15 +1203,15 @@ function CommentItem({
       }
     });
   }
-  return /* @__PURE__ */ jsxs14("div", { className: `${isReply ? "ml-8 border-l-2 border-border pl-4" : ""}`, children: [
-    /* @__PURE__ */ jsx15("div", { className: "rounded-lg bg-muted/40 p-3 space-y-1", children: comment.isDeleted ? /* @__PURE__ */ jsx15("p", { className: "text-sm italic text-muted-foreground", children: "Comment removed" }) : /* @__PURE__ */ jsxs14(Fragment, { children: [
-      /* @__PURE__ */ jsxs14("div", { className: "flex items-center justify-between gap-2", children: [
-        /* @__PURE__ */ jsx15("span", { className: "text-sm font-medium text-foreground", children: comment.authorName }),
-        /* @__PURE__ */ jsx15("span", { className: "text-xs text-muted-foreground", children: relativeTime(comment.createdAt) })
+  return /* @__PURE__ */ jsxs16("div", { className: `${isReply ? "ml-8 border-l-2 border-border pl-4" : ""}`, children: [
+    /* @__PURE__ */ jsx17("div", { className: "rounded-lg bg-muted/40 p-3 space-y-1", children: comment.isDeleted ? /* @__PURE__ */ jsx17("p", { className: "text-sm italic text-muted-foreground", children: "Comment removed" }) : /* @__PURE__ */ jsxs16(Fragment2, { children: [
+      /* @__PURE__ */ jsxs16("div", { className: "flex items-center justify-between gap-2", children: [
+        /* @__PURE__ */ jsx17("span", { className: "text-sm font-medium text-foreground", children: comment.authorName }),
+        /* @__PURE__ */ jsx17("span", { className: "text-xs text-muted-foreground", children: relativeTime(comment.createdAt) })
       ] }),
-      /* @__PURE__ */ jsx15("p", { className: "text-sm text-foreground whitespace-pre-wrap break-words", children: comment.body }),
-      /* @__PURE__ */ jsxs14("div", { className: "flex gap-3 pt-1", children: [
-        canReply && /* @__PURE__ */ jsx15(
+      /* @__PURE__ */ jsx17("p", { className: "text-sm text-foreground whitespace-pre-wrap break-words", children: comment.body }),
+      /* @__PURE__ */ jsxs16("div", { className: "flex gap-3 pt-1", children: [
+        canReply && /* @__PURE__ */ jsx17(
           "button",
           {
             onClick: () => setShowReplyForm((v) => !v),
@@ -1092,7 +1219,7 @@ function CommentItem({
             children: showReplyForm ? "Cancel" : "Reply"
           }
         ),
-        canDelete && /* @__PURE__ */ jsx15(
+        canDelete && /* @__PURE__ */ jsx17(
           "button",
           {
             onClick: handleDelete,
@@ -1103,7 +1230,7 @@ function CommentItem({
         )
       ] })
     ] }) }),
-    showReplyForm && /* @__PURE__ */ jsx15("div", { className: "mt-2 ml-2", children: /* @__PURE__ */ jsx15(
+    showReplyForm && /* @__PURE__ */ jsx17("div", { className: "mt-2 ml-2", children: /* @__PURE__ */ jsx17(
       CommentForm,
       {
         articleSlug,
@@ -1115,7 +1242,7 @@ function CommentItem({
         onCancel: () => setShowReplyForm(false)
       }
     ) }),
-    replies.length > 0 && /* @__PURE__ */ jsx15("div", { className: "mt-2 space-y-2", children: replies.map((reply) => /* @__PURE__ */ jsx15(
+    replies.length > 0 && /* @__PURE__ */ jsx17("div", { className: "mt-2 space-y-2", children: replies.map((reply) => /* @__PURE__ */ jsx17(
       CommentItem,
       {
         comment: __spreadProps(__spreadValues({}, reply), { replies: [] }),
@@ -1130,7 +1257,7 @@ function CommentItem({
 }
 
 // src/CommentThread.tsx
-import { jsx as jsx16 } from "react/jsx-runtime";
+import { jsx as jsx18 } from "react/jsx-runtime";
 function CommentThread({
   comments,
   articleSlug,
@@ -1138,9 +1265,9 @@ function CommentThread({
   onRefresh
 }) {
   if (comments.length === 0) {
-    return /* @__PURE__ */ jsx16("p", { className: "text-sm text-muted-foreground text-center py-6", children: "No comments yet. Be the first to share your thoughts." });
+    return /* @__PURE__ */ jsx18("p", { className: "text-sm text-muted-foreground text-center py-6", children: "No comments yet. Be the first to share your thoughts." });
   }
-  return /* @__PURE__ */ jsx16("div", { className: "space-y-4", children: comments.map((comment) => /* @__PURE__ */ jsx16(
+  return /* @__PURE__ */ jsx18("div", { className: "space-y-4", children: comments.map((comment) => /* @__PURE__ */ jsx18(
     CommentItem,
     {
       comment,
@@ -1153,13 +1280,13 @@ function CommentThread({
 }
 
 // src/CommentsSection.tsx
-import { jsx as jsx17, jsxs as jsxs15 } from "react/jsx-runtime";
+import { jsx as jsx19, jsxs as jsxs17 } from "react/jsx-runtime";
 function CommentsSection({ articleSlug, config }) {
   var _a, _b, _c, _d, _e, _f;
   const { data: session, status } = useSession();
-  const [comments, setComments] = useState7([]);
-  const [loading, setLoading] = useState7(true);
-  const [fetchError, setFetchError] = useState7(null);
+  const [comments, setComments] = useState8([]);
+  const [loading, setLoading] = useState8(true);
+  const [fetchError, setFetchError] = useState8(null);
   const perArticleEnabled = (_b = (_a = config.perArticleOverride) == null ? void 0 : _a[articleSlug]) != null ? _b : true;
   const enabled = config.enabled && perArticleEnabled;
   const currentUserId = (_f = (_e = (_c = session == null ? void 0 : session.user) == null ? void 0 : _c.email) != null ? _e : (_d = session == null ? void 0 : session.user) == null ? void 0 : _d.name) != null ? _f : void 0;
@@ -1177,7 +1304,7 @@ function CommentsSection({ articleSlug, config }) {
       setLoading(false);
     }
   }), [articleSlug]);
-  useEffect4(() => {
+  useEffect5(() => {
     if (enabled) {
       fetchComments().catch(() => void 0);
     }
@@ -1185,10 +1312,10 @@ function CommentsSection({ articleSlug, config }) {
   if (!enabled) return null;
   const count = comments.length;
   const label = count === 1 ? "1 comment" : `${count} comments`;
-  return /* @__PURE__ */ jsxs15("section", { "aria-label": "Comments", className: "mt-12 pt-8 border-t border-border space-y-6", children: [
-    /* @__PURE__ */ jsx17("h2", { className: "text-xl font-semibold text-foreground", children: loading ? "Comments" : label }),
-    status === "authenticated" ? /* @__PURE__ */ jsx17(CommentForm, { articleSlug, onSuccess: fetchComments }) : /* @__PURE__ */ jsxs15("p", { className: "text-sm text-muted-foreground", children: [
-      /* @__PURE__ */ jsx17(
+  return /* @__PURE__ */ jsxs17("section", { "aria-label": "Comments", className: "mt-12 pt-8 border-t border-border space-y-6", children: [
+    /* @__PURE__ */ jsx19("h2", { className: "text-xl font-semibold text-foreground", children: loading ? "Comments" : label }),
+    status === "authenticated" ? /* @__PURE__ */ jsx19(CommentForm, { articleSlug, onSuccess: fetchComments }) : /* @__PURE__ */ jsxs17("p", { className: "text-sm text-muted-foreground", children: [
+      /* @__PURE__ */ jsx19(
         "button",
         {
           onClick: () => signIn(),
@@ -1199,8 +1326,8 @@ function CommentsSection({ articleSlug, config }) {
       " ",
       "to join the discussion."
     ] }),
-    fetchError && /* @__PURE__ */ jsx17("p", { className: "text-sm text-destructive", children: fetchError }),
-    loading ? /* @__PURE__ */ jsx17("p", { className: "text-sm text-muted-foreground", children: "Loading comments\u2026" }) : /* @__PURE__ */ jsx17(
+    fetchError && /* @__PURE__ */ jsx19("p", { className: "text-sm text-destructive", children: fetchError }),
+    loading ? /* @__PURE__ */ jsx19("p", { className: "text-sm text-muted-foreground", children: "Loading comments\u2026" }) : /* @__PURE__ */ jsx19(
       CommentThread,
       {
         comments,
@@ -1216,9 +1343,11 @@ export {
   ArticleCategoryGrid,
   ArticleDetailHero,
   ArticleNavigation,
+  ArticleSEO,
   ArticleSchema,
   ArticleSearchBar,
   ArticleSocialShare,
+  ArticleTOC,
   ArticlesHero,
   ArticlesPage,
   BreadcrumbSchema,
@@ -1231,9 +1360,11 @@ export {
   DEFAULT_CATEGORIES_PAGE_SIZE,
   DEFAULT_LAYOUT,
   DEFAULT_PAGE_SIZE,
+  FAQPageSchema,
   FeaturedArticle,
   LatestArticles,
   LatestArticlesSection,
+  ScrollToTop,
   useArticles
 };
 //# sourceMappingURL=index.js.map