@opensite/ui 0.5.4 → 0.5.5

package/dist/article-chapters-author.cjs

@@ -1,7 +1,7 @@
 "use client";
 'use strict';
 
-var React = require('react');
+var React4 = require('react');
 var clsx = require('clsx');
 var tailwindMerge = require('tailwind-merge');
 var img = require('@page-speed/img');
@@ -28,7 +28,7 @@ function _interopNamespace(e) {
   return Object.freeze(n);
 }
 
-var React__namespace = /*#__PURE__*/_interopNamespace(React);
+var React4__namespace = /*#__PURE__*/_interopNamespace(React4);
 var AvatarPrimitive__namespace = /*#__PURE__*/_interopNamespace(AvatarPrimitive);
 
 // components/blocks/article/article-chapters-author.tsx
@@ -110,7 +110,7 @@ function useNavigation({
   href,
   onClick
 } = {}) {
-  const linkType = React__namespace.useMemo(() => {
+  const linkType = React4__namespace.useMemo(() => {
     if (!href || href.trim() === "") {
       return onClick ? "none" : "none";
     }
@@ -131,7 +131,7 @@ function useNavigation({
       return "internal";
     }
   }, [href, onClick]);
-  const normalizedHref = React__namespace.useMemo(() => {
+  const normalizedHref = React4__namespace.useMemo(() => {
     if (!href || href.trim() === "") {
       return void 0;
     }
@@ -149,7 +149,7 @@ function useNavigation({
         return trimmed;
     }
   }, [href, linkType]);
-  const target = React__namespace.useMemo(() => {
+  const target = React4__namespace.useMemo(() => {
     switch (linkType) {
       case "external":
         return "_blank";
@@ -162,7 +162,7 @@ function useNavigation({
         return void 0;
     }
   }, [linkType]);
-  const rel = React__namespace.useMemo(() => {
+  const rel = React4__namespace.useMemo(() => {
     if (linkType === "external") {
       return "noopener noreferrer";
     }
@@ -171,7 +171,7 @@ function useNavigation({
   const isExternal = linkType === "external";
   const isInternal = linkType === "internal";
   const shouldUseRouter = isInternal && typeof normalizedHref === "string" && normalizedHref.startsWith("/");
-  const handleClick = React__namespace.useCallback(
+  const handleClick = React4__namespace.useCallback(
     (event) => {
       if (onClick) {
         try {
@@ -355,7 +355,7 @@ var buttonVariants = classVarianceAuthority.cva(baseStyles, {
     size: "default"
   }
 });
-var Pressable = React__namespace.forwardRef(
+var Pressable = React4__namespace.forwardRef(
   ({
     children,
     className,
@@ -461,10 +461,10 @@ function DynamicIcon({
   className,
   alt
 }) {
-  const [svgContent, setSvgContent] = React__namespace.useState(null);
-  const [isLoading, setIsLoading] = React__namespace.useState(true);
-  const [error, setError] = React__namespace.useState(null);
-  const { url, iconName } = React__namespace.useMemo(() => {
+  const [svgContent, setSvgContent] = React4__namespace.useState(null);
+  const [isLoading, setIsLoading] = React4__namespace.useState(true);
+  const [error, setError] = React4__namespace.useState(null);
+  const { url, iconName } = React4__namespace.useMemo(() => {
     const separator = name.includes("/") ? "/" : ":";
     const [prefix, iconName2] = name.split(separator);
     const baseUrl = `https://icons.opensite.ai/api/icon/${prefix}/${iconName2}?format=svg&width=${size}&height=${size}`;
@@ -473,7 +473,7 @@ function DynamicIcon({
       iconName: iconName2
     };
   }, [name, size]);
-  React__namespace.useEffect(() => {
+  React4__namespace.useEffect(() => {
     let isMounted = true;
     const fetchSvg = async () => {
       const cached = svgCache.get(url);
@@ -880,10 +880,10 @@ function ArticleChaptersAuthorComponent({
   optixFlowConfig
 }) {
   const conclusionActions = conclusionActionsProp ?? (conclusionButtonText ? [{ label: conclusionButtonText, href: conclusionButtonHref || "#", variant: "default" }] : []);
-  const [activeChapter, setActiveChapter] = React__namespace.useState(
+  const [activeChapter, setActiveChapter] = React4__namespace.useState(
     chapters?.[0]?.id || ""
   );
-  React__namespace.useEffect(() => {
+  React4__namespace.useEffect(() => {
     if (!enableChapterTracking || !chapters || chapters.length === 0) return;
     const observer = new IntersectionObserver(
       (entries) => {
@@ -901,20 +901,20 @@ function ArticleChaptersAuthorComponent({
     });
     return () => observer.disconnect();
   }, [chapters, enableChapterTracking]);
-  const renderBreadcrumbs = () => {
+  const breadcrumbsContent = React4__namespace.useMemo(() => {
     if (breadcrumbsSlot) return breadcrumbsSlot;
     if (!breadcrumbs || breadcrumbs.length === 0) return null;
     return /* @__PURE__ */ jsxRuntime.jsx(Breadcrumb, { className: cn("mb-8", breadcrumbClassName), children: /* @__PURE__ */ jsxRuntime.jsxs(BreadcrumbList, { children: [
       /* @__PURE__ */ jsxRuntime.jsx(BreadcrumbItem, { children: /* @__PURE__ */ jsxRuntime.jsx(BreadcrumbLink, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(Pressable, { href: "#", children: /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/home", size: 16 }) }) }) }),
-      breadcrumbs.map((crumb, index) => /* @__PURE__ */ jsxRuntime.jsxs(React__namespace.Fragment, { children: [
+      breadcrumbs.map((crumb, index) => /* @__PURE__ */ jsxRuntime.jsxs(React4__namespace.Fragment, { children: [
         /* @__PURE__ */ jsxRuntime.jsx(BreadcrumbSeparator, {}),
         /* @__PURE__ */ jsxRuntime.jsx(BreadcrumbItem, { children: /* @__PURE__ */ jsxRuntime.jsx(BreadcrumbLink, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(Pressable, { href: crumb.href, children: crumb.label }) }) })
       ] }, index)),
       /* @__PURE__ */ jsxRuntime.jsx(BreadcrumbSeparator, {}),
       /* @__PURE__ */ jsxRuntime.jsx(BreadcrumbItem, { children: /* @__PURE__ */ jsxRuntime.jsx(BreadcrumbPage, { children: typeof currentPage === "string" ? currentPage : currentPage }) })
     ] }) });
-  };
-  const renderChaptersNav = () => {
+  }, [breadcrumbsSlot, breadcrumbs, currentPage, breadcrumbClassName]);
+  const chaptersNavContent = React4__namespace.useMemo(() => {
     if (chaptersSlot) return chaptersSlot;
     if (!chapters || chapters.length === 0) return null;
     return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("rounded-lg border p-4", chaptersClassName), children: [
@@ -922,7 +922,7 @@ function ArticleChaptersAuthorComponent({
       /* @__PURE__ */ jsxRuntime.jsx("nav", { className: "space-y-2", children: chapters.map((chapter) => {
         const isActive = activeChapter === chapter.id;
         if (renderChapterLink) {
-          return /* @__PURE__ */ jsxRuntime.jsx(React__namespace.Fragment, { children: renderChapterLink(chapter, isActive) }, chapter.id);
+          return /* @__PURE__ */ jsxRuntime.jsx(React4__namespace.Fragment, { children: renderChapterLink(chapter, isActive) }, chapter.id);
         }
         return /* @__PURE__ */ jsxRuntime.jsxs(
           Pressable,
@@ -941,50 +941,52 @@ function ArticleChaptersAuthorComponent({
         );
       }) })
     ] });
-  };
-  const renderAuthorCard = () => {
+  }, [chaptersSlot, chapters, activeChapter, renderChapterLink, chaptersClassName]);
+  const authorCardContent = React4__namespace.useMemo(() => {
     if (authorSlot) return authorSlot;
     if (!author) return null;
-    const renderSocialLinks = () => {
-      if (!author.socialLinks) return null;
+    let socialLinksContent = null;
+    if (author.socialLinks) {
       if (Array.isArray(author.socialLinks)) {
-        if (author.socialLinks.length === 0) return null;
-        return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-4 flex gap-2", children: author.socialLinks.map((link, index) => /* @__PURE__ */ jsxRuntime.jsx(
-          Pressable,
-          {
-            href: link.href,
-            className: cn(
-              "flex h-8 w-8 items-center justify-center rounded-md border hover:bg-muted",
-              link.className
-            ),
-            "aria-label": link["aria-label"],
-            children: link.icon ?? /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: `lucide/${link.platform}`, size: 14 })
-          },
-          index
-        )) });
+        if (author.socialLinks.length > 0) {
+          socialLinksContent = /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-4 flex gap-2", children: author.socialLinks.map((link, index) => /* @__PURE__ */ jsxRuntime.jsx(
+            Pressable,
+            {
+              href: link.href,
+              className: cn(
+                "flex h-8 w-8 items-center justify-center rounded-md border hover:bg-muted",
+                link.className
+              ),
+              "aria-label": link["aria-label"],
+              children: link.icon ?? /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: `lucide/${link.platform}`, size: 14 })
+            },
+            index
+          )) });
+        }
       } else {
         const links = author.socialLinks;
         const socialEntries = Object.entries(links).filter(([, href]) => href);
-        if (socialEntries.length === 0) return null;
-        const platformLabels = {
-          twitter: "Twitter",
-          linkedin: "LinkedIn",
-          github: "GitHub",
-          facebook: "Facebook",
-          instagram: "Instagram"
-        };
-        return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-4 flex gap-2", children: socialEntries.map(([platform, href]) => /* @__PURE__ */ jsxRuntime.jsx(
-          Pressable,
-          {
-            href,
-            className: "flex h-8 w-8 items-center justify-center rounded-md border hover:bg-muted",
-            "aria-label": platformLabels[platform] || platform.charAt(0).toUpperCase() + platform.slice(1),
-            children: /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: `lucide/${platform}`, size: 14 })
-          },
-          platform
-        )) });
+        if (socialEntries.length > 0) {
+          const platformLabels = {
+            twitter: "Twitter",
+            linkedin: "LinkedIn",
+            github: "GitHub",
+            facebook: "Facebook",
+            instagram: "Instagram"
+          };
+          socialLinksContent = /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-4 flex gap-2", children: socialEntries.map(([platform, href]) => /* @__PURE__ */ jsxRuntime.jsx(
+            Pressable,
+            {
+              href,
+              className: "flex h-8 w-8 items-center justify-center rounded-md border hover:bg-muted",
+              "aria-label": platformLabels[platform] || platform.charAt(0).toUpperCase() + platform.slice(1),
+              children: /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: `lucide/${platform}`, size: 14 })
+            },
+            platform
+          )) });
+        }
       }
-    };
+    }
     return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("rounded-lg border p-4", authorClassName), children: [
       /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "mb-4 text-sm font-semibold", children: "About the Author" }),
       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3", children: [
@@ -998,25 +1000,23 @@ function ArticleChaptersAuthorComponent({
         ] })
       ] }),
       author.bio && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-3 text-sm text-muted-foreground", children: author.bio }),
-      renderSocialLinks()
+      socialLinksContent
     ] });
-  };
-  const renderHeroMedia = () => {
+  }, [authorSlot, author, authorClassName]);
+  const heroMediaContent = React4__namespace.useMemo(() => {
     if (heroMediaSlot) return heroMediaSlot;
-    if (heroImageSrc) {
-      return /* @__PURE__ */ jsxRuntime.jsx(
-        img.Img,
-        {
-          src: heroImageSrc,
-          alt: heroImageAlt,
-          className: cn("my-8 aspect-video w-full rounded-lg object-cover", heroImageClassName),
-          optixFlowConfig
-        }
-      );
-    }
-    return null;
-  };
-  const renderConclusion = () => {
+    if (!heroImageSrc) return null;
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      img.Img,
+      {
+        src: heroImageSrc,
+        alt: heroImageAlt,
+        className: cn("my-8 aspect-video w-full rounded-lg object-cover", heroImageClassName),
+        optixFlowConfig
+      }
+    );
+  }, [heroMediaSlot, heroImageSrc, heroImageAlt, heroImageClassName, optixFlowConfig]);
+  const conclusionContent = React4__namespace.useMemo(() => {
     if (conclusionSlot) return conclusionSlot;
     if (!conclusionTitle && !conclusionDescription && (!conclusionActions || conclusionActions.length === 0)) return null;
     return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("mt-12 rounded-lg border bg-muted/50 p-6 not-prose", conclusionClassName), children: [
@@ -1040,22 +1040,22 @@ function ArticleChaptersAuthorComponent({
         );
       }) })
     ] });
-  };
+  }, [conclusionSlot, conclusionTitle, conclusionDescription, conclusionActions, conclusionClassName]);
   return /* @__PURE__ */ jsxRuntime.jsx("section", { className: cn("py-32", className), children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("container", containerClassName), children: [
-    renderBreadcrumbs(),
+    breadcrumbsContent,
     /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("mb-12 text-center", headerClassName), children: [
       title && (typeof title === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h1", { className: cn("text-4xl font-bold tracking-tight md:text-5xl lg:text-6xl", titleClassName), children: title }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: titleClassName, children: title })),
       subtitle && (typeof subtitle === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("mt-4 text-lg text-muted-foreground md:text-xl", subtitleClassName), children: subtitle }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("mt-4", subtitleClassName), children: subtitle }))
     ] }),
     /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid gap-10 lg:grid-cols-[280px_minmax(0,1fr)]", children: [
       /* @__PURE__ */ jsxRuntime.jsx("aside", { className: cn("hidden lg:block", sidebarClassName), children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "sticky top-8 space-y-6", children: [
-        renderChaptersNav(),
-        renderAuthorCard()
+        chaptersNavContent,
+        authorCardContent
       ] }) }),
       /* @__PURE__ */ jsxRuntime.jsxs("article", { className: cn("prose max-w-none dark:prose-invert", articleClassName), children: [
-        renderHeroMedia(),
+        heroMediaContent,
         children || defaultArticleContent(optixFlowConfig),
-        renderConclusion()
+        conclusionContent
       ] })
     ] })
   ] }) });

package/dist/article-chapters-author.d.cts

@@ -1,8 +1,8 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React from 'react';
-import { a as SocialLinkItem, A as ActionConfig, O as OptixFlowConfig } from './blocks-DP3Vofl4.cjs';
+import { a as SocialLinkItem, A as ActionConfig, O as OptixFlowConfig } from './blocks-Cohq4eio.cjs';
 import 'class-variance-authority';
-import './button-variants-CdNtNOuP.cjs';
+import './button-variants-lRElsmTc.cjs';
 import 'class-variance-authority/types';
 
 interface ArticleChapter {

package/dist/article-chapters-author.d.ts

@@ -1,8 +1,8 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React from 'react';
-import { a as SocialLinkItem, A as ActionConfig, O as OptixFlowConfig } from './blocks-XLPGq8A5.js';
+import { a as SocialLinkItem, A as ActionConfig, O as OptixFlowConfig } from './blocks-k17uluAz.js';
 import 'class-variance-authority';
-import './button-variants-CdNtNOuP.js';
+import './button-variants-lRElsmTc.js';
 import 'class-variance-authority/types';
 
 interface ArticleChapter {

package/dist/article-chapters-author.js

@@ -1,5 +1,5 @@
 "use client";
-import * as React from 'react';
+import * as React4 from 'react';
 import { clsx } from 'clsx';
 import { twMerge } from 'tailwind-merge';
 import { Img } from '@page-speed/img';
@@ -87,7 +87,7 @@ function useNavigation({
   href,
   onClick
 } = {}) {
-  const linkType = React.useMemo(() => {
+  const linkType = React4.useMemo(() => {
     if (!href || href.trim() === "") {
       return onClick ? "none" : "none";
     }
@@ -108,7 +108,7 @@ function useNavigation({
       return "internal";
     }
   }, [href, onClick]);
-  const normalizedHref = React.useMemo(() => {
+  const normalizedHref = React4.useMemo(() => {
     if (!href || href.trim() === "") {
       return void 0;
     }
@@ -126,7 +126,7 @@ function useNavigation({
         return trimmed;
     }
   }, [href, linkType]);
-  const target = React.useMemo(() => {
+  const target = React4.useMemo(() => {
     switch (linkType) {
       case "external":
         return "_blank";
@@ -139,7 +139,7 @@ function useNavigation({
         return void 0;
     }
   }, [linkType]);
-  const rel = React.useMemo(() => {
+  const rel = React4.useMemo(() => {
     if (linkType === "external") {
       return "noopener noreferrer";
     }
@@ -148,7 +148,7 @@ function useNavigation({
   const isExternal = linkType === "external";
   const isInternal = linkType === "internal";
   const shouldUseRouter = isInternal && typeof normalizedHref === "string" && normalizedHref.startsWith("/");
-  const handleClick = React.useCallback(
+  const handleClick = React4.useCallback(
     (event) => {
       if (onClick) {
         try {
@@ -332,7 +332,7 @@ var buttonVariants = cva(baseStyles, {
     size: "default"
   }
 });
-var Pressable = React.forwardRef(
+var Pressable = React4.forwardRef(
   ({
     children,
     className,
@@ -438,10 +438,10 @@ function DynamicIcon({
   className,
   alt
 }) {
-  const [svgContent, setSvgContent] = React.useState(null);
-  const [isLoading, setIsLoading] = React.useState(true);
-  const [error, setError] = React.useState(null);
-  const { url, iconName } = React.useMemo(() => {
+  const [svgContent, setSvgContent] = React4.useState(null);
+  const [isLoading, setIsLoading] = React4.useState(true);
+  const [error, setError] = React4.useState(null);
+  const { url, iconName } = React4.useMemo(() => {
     const separator = name.includes("/") ? "/" : ":";
     const [prefix, iconName2] = name.split(separator);
     const baseUrl = `https://icons.opensite.ai/api/icon/${prefix}/${iconName2}?format=svg&width=${size}&height=${size}`;
@@ -450,7 +450,7 @@ function DynamicIcon({
       iconName: iconName2
     };
   }, [name, size]);
-  React.useEffect(() => {
+  React4.useEffect(() => {
     let isMounted = true;
     const fetchSvg = async () => {
       const cached = svgCache.get(url);
@@ -857,10 +857,10 @@ function ArticleChaptersAuthorComponent({
   optixFlowConfig
 }) {
   const conclusionActions = conclusionActionsProp ?? (conclusionButtonText ? [{ label: conclusionButtonText, href: conclusionButtonHref || "#", variant: "default" }] : []);
-  const [activeChapter, setActiveChapter] = React.useState(
+  const [activeChapter, setActiveChapter] = React4.useState(
     chapters?.[0]?.id || ""
   );
-  React.useEffect(() => {
+  React4.useEffect(() => {
     if (!enableChapterTracking || !chapters || chapters.length === 0) return;
     const observer = new IntersectionObserver(
       (entries) => {
@@ -878,20 +878,20 @@ function ArticleChaptersAuthorComponent({
     });
     return () => observer.disconnect();
   }, [chapters, enableChapterTracking]);
-  const renderBreadcrumbs = () => {
+  const breadcrumbsContent = React4.useMemo(() => {
     if (breadcrumbsSlot) return breadcrumbsSlot;
     if (!breadcrumbs || breadcrumbs.length === 0) return null;
     return /* @__PURE__ */ jsx(Breadcrumb, { className: cn("mb-8", breadcrumbClassName), children: /* @__PURE__ */ jsxs(BreadcrumbList, { children: [
       /* @__PURE__ */ jsx(BreadcrumbItem, { children: /* @__PURE__ */ jsx(BreadcrumbLink, { asChild: true, children: /* @__PURE__ */ jsx(Pressable, { href: "#", children: /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/home", size: 16 }) }) }) }),
-      breadcrumbs.map((crumb, index) => /* @__PURE__ */ jsxs(React.Fragment, { children: [
+      breadcrumbs.map((crumb, index) => /* @__PURE__ */ jsxs(React4.Fragment, { children: [
         /* @__PURE__ */ jsx(BreadcrumbSeparator, {}),
         /* @__PURE__ */ jsx(BreadcrumbItem, { children: /* @__PURE__ */ jsx(BreadcrumbLink, { asChild: true, children: /* @__PURE__ */ jsx(Pressable, { href: crumb.href, children: crumb.label }) }) })
       ] }, index)),
       /* @__PURE__ */ jsx(BreadcrumbSeparator, {}),
       /* @__PURE__ */ jsx(BreadcrumbItem, { children: /* @__PURE__ */ jsx(BreadcrumbPage, { children: typeof currentPage === "string" ? currentPage : currentPage }) })
     ] }) });
-  };
-  const renderChaptersNav = () => {
+  }, [breadcrumbsSlot, breadcrumbs, currentPage, breadcrumbClassName]);
+  const chaptersNavContent = React4.useMemo(() => {
     if (chaptersSlot) return chaptersSlot;
     if (!chapters || chapters.length === 0) return null;
     return /* @__PURE__ */ jsxs("div", { className: cn("rounded-lg border p-4", chaptersClassName), children: [
@@ -899,7 +899,7 @@ function ArticleChaptersAuthorComponent({
       /* @__PURE__ */ jsx("nav", { className: "space-y-2", children: chapters.map((chapter) => {
         const isActive = activeChapter === chapter.id;
         if (renderChapterLink) {
-          return /* @__PURE__ */ jsx(React.Fragment, { children: renderChapterLink(chapter, isActive) }, chapter.id);
+          return /* @__PURE__ */ jsx(React4.Fragment, { children: renderChapterLink(chapter, isActive) }, chapter.id);
         }
         return /* @__PURE__ */ jsxs(
           Pressable,
@@ -918,50 +918,52 @@ function ArticleChaptersAuthorComponent({
         );
       }) })
     ] });
-  };
-  const renderAuthorCard = () => {
+  }, [chaptersSlot, chapters, activeChapter, renderChapterLink, chaptersClassName]);
+  const authorCardContent = React4.useMemo(() => {
     if (authorSlot) return authorSlot;
     if (!author) return null;
-    const renderSocialLinks = () => {
-      if (!author.socialLinks) return null;
+    let socialLinksContent = null;
+    if (author.socialLinks) {
       if (Array.isArray(author.socialLinks)) {
-        if (author.socialLinks.length === 0) return null;
-        return /* @__PURE__ */ jsx("div", { className: "mt-4 flex gap-2", children: author.socialLinks.map((link, index) => /* @__PURE__ */ jsx(
-          Pressable,
-          {
-            href: link.href,
-            className: cn(
-              "flex h-8 w-8 items-center justify-center rounded-md border hover:bg-muted",
-              link.className
-            ),
-            "aria-label": link["aria-label"],
-            children: link.icon ?? /* @__PURE__ */ jsx(DynamicIcon, { name: `lucide/${link.platform}`, size: 14 })
-          },
-          index
-        )) });
+        if (author.socialLinks.length > 0) {
+          socialLinksContent = /* @__PURE__ */ jsx("div", { className: "mt-4 flex gap-2", children: author.socialLinks.map((link, index) => /* @__PURE__ */ jsx(
+            Pressable,
+            {
+              href: link.href,
+              className: cn(
+                "flex h-8 w-8 items-center justify-center rounded-md border hover:bg-muted",
+                link.className
+              ),
+              "aria-label": link["aria-label"],
+              children: link.icon ?? /* @__PURE__ */ jsx(DynamicIcon, { name: `lucide/${link.platform}`, size: 14 })
+            },
+            index
+          )) });
+        }
       } else {
         const links = author.socialLinks;
         const socialEntries = Object.entries(links).filter(([, href]) => href);
-        if (socialEntries.length === 0) return null;
-        const platformLabels = {
-          twitter: "Twitter",
-          linkedin: "LinkedIn",
-          github: "GitHub",
-          facebook: "Facebook",
-          instagram: "Instagram"
-        };
-        return /* @__PURE__ */ jsx("div", { className: "mt-4 flex gap-2", children: socialEntries.map(([platform, href]) => /* @__PURE__ */ jsx(
-          Pressable,
-          {
-            href,
-            className: "flex h-8 w-8 items-center justify-center rounded-md border hover:bg-muted",
-            "aria-label": platformLabels[platform] || platform.charAt(0).toUpperCase() + platform.slice(1),
-            children: /* @__PURE__ */ jsx(DynamicIcon, { name: `lucide/${platform}`, size: 14 })
-          },
-          platform
-        )) });
+        if (socialEntries.length > 0) {
+          const platformLabels = {
+            twitter: "Twitter",
+            linkedin: "LinkedIn",
+            github: "GitHub",
+            facebook: "Facebook",
+            instagram: "Instagram"
+          };
+          socialLinksContent = /* @__PURE__ */ jsx("div", { className: "mt-4 flex gap-2", children: socialEntries.map(([platform, href]) => /* @__PURE__ */ jsx(
+            Pressable,
+            {
+              href,
+              className: "flex h-8 w-8 items-center justify-center rounded-md border hover:bg-muted",
+              "aria-label": platformLabels[platform] || platform.charAt(0).toUpperCase() + platform.slice(1),
+              children: /* @__PURE__ */ jsx(DynamicIcon, { name: `lucide/${platform}`, size: 14 })
+            },
+            platform
+          )) });
+        }
       }
-    };
+    }
     return /* @__PURE__ */ jsxs("div", { className: cn("rounded-lg border p-4", authorClassName), children: [
       /* @__PURE__ */ jsx("h3", { className: "mb-4 text-sm font-semibold", children: "About the Author" }),
       /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
@@ -975,25 +977,23 @@ function ArticleChaptersAuthorComponent({
         ] })
       ] }),
       author.bio && /* @__PURE__ */ jsx("p", { className: "mt-3 text-sm text-muted-foreground", children: author.bio }),
-      renderSocialLinks()
+      socialLinksContent
     ] });
-  };
-  const renderHeroMedia = () => {
+  }, [authorSlot, author, authorClassName]);
+  const heroMediaContent = React4.useMemo(() => {
     if (heroMediaSlot) return heroMediaSlot;
-    if (heroImageSrc) {
-      return /* @__PURE__ */ jsx(
-        Img,
-        {
-          src: heroImageSrc,
-          alt: heroImageAlt,
-          className: cn("my-8 aspect-video w-full rounded-lg object-cover", heroImageClassName),
-          optixFlowConfig
-        }
-      );
-    }
-    return null;
-  };
-  const renderConclusion = () => {
+    if (!heroImageSrc) return null;
+    return /* @__PURE__ */ jsx(
+      Img,
+      {
+        src: heroImageSrc,
+        alt: heroImageAlt,
+        className: cn("my-8 aspect-video w-full rounded-lg object-cover", heroImageClassName),
+        optixFlowConfig
+      }
+    );
+  }, [heroMediaSlot, heroImageSrc, heroImageAlt, heroImageClassName, optixFlowConfig]);
+  const conclusionContent = React4.useMemo(() => {
     if (conclusionSlot) return conclusionSlot;
     if (!conclusionTitle && !conclusionDescription && (!conclusionActions || conclusionActions.length === 0)) return null;
     return /* @__PURE__ */ jsxs("div", { className: cn("mt-12 rounded-lg border bg-muted/50 p-6 not-prose", conclusionClassName), children: [
@@ -1017,22 +1017,22 @@ function ArticleChaptersAuthorComponent({
         );
       }) })
     ] });
-  };
+  }, [conclusionSlot, conclusionTitle, conclusionDescription, conclusionActions, conclusionClassName]);
   return /* @__PURE__ */ jsx("section", { className: cn("py-32", className), children: /* @__PURE__ */ jsxs("div", { className: cn("container", containerClassName), children: [
-    renderBreadcrumbs(),
+    breadcrumbsContent,
     /* @__PURE__ */ jsxs("div", { className: cn("mb-12 text-center", headerClassName), children: [
       title && (typeof title === "string" ? /* @__PURE__ */ jsx("h1", { className: cn("text-4xl font-bold tracking-tight md:text-5xl lg:text-6xl", titleClassName), children: title }) : /* @__PURE__ */ jsx("div", { className: titleClassName, children: title })),
       subtitle && (typeof subtitle === "string" ? /* @__PURE__ */ jsx("p", { className: cn("mt-4 text-lg text-muted-foreground md:text-xl", subtitleClassName), children: subtitle }) : /* @__PURE__ */ jsx("div", { className: cn("mt-4", subtitleClassName), children: subtitle }))
     ] }),
     /* @__PURE__ */ jsxs("div", { className: "grid gap-10 lg:grid-cols-[280px_minmax(0,1fr)]", children: [
       /* @__PURE__ */ jsx("aside", { className: cn("hidden lg:block", sidebarClassName), children: /* @__PURE__ */ jsxs("div", { className: "sticky top-8 space-y-6", children: [
-        renderChaptersNav(),
-        renderAuthorCard()
+        chaptersNavContent,
+        authorCardContent
       ] }) }),
       /* @__PURE__ */ jsxs("article", { className: cn("prose max-w-none dark:prose-invert", articleClassName), children: [
-        renderHeroMedia(),
+        heroMediaContent,
         children || defaultArticleContent(optixFlowConfig),
-        renderConclusion()
+        conclusionContent
       ] })
     ] })
   ] }) });