@opensite/ui 0.5.4 → 0.5.5

package/dist/about-interactive-tabs.js

@@ -1,9 +1,10 @@
 "use client";
 import * as React from 'react';
+import { useMemo, useCallback } from 'react';
 import { clsx } from 'clsx';
 import { twMerge } from 'tailwind-merge';
 import { Img } from '@page-speed/img';
-import { jsx, jsxs } from 'react/jsx-runtime';
+import { jsxs, jsx } from 'react/jsx-runtime';
 
 // components/blocks/about/about-interactive-tabs.tsx
 function cn(...inputs) {
@@ -29,15 +30,20 @@ function AboutInteractiveTabs({
   optixFlowConfig
 }) {
   const [activeTab, setActiveTab] = React.useState(tabs?.[0]?.id ?? "");
-  const activeContent = tabs?.find((tab) => tab.id === activeTab)?.content;
-  const renderTabs = () => {
+  const activeContent = useMemo(() => {
+    return tabs?.find((tab) => tab.id === activeTab)?.content;
+  }, [tabs, activeTab]);
+  const handleTabChange = useCallback((id) => {
+    setActiveTab(id);
+  }, []);
+  const tabsContent = useMemo(() => {
     if (tabsSlot) return tabsSlot;
     if (!tabs || tabs.length === 0) return null;
     return /* @__PURE__ */ jsxs("div", { className: "mt-16", children: [
       /* @__PURE__ */ jsx("div", { className: cn("flex flex-wrap justify-center gap-2 border-b", tabsContainerClassName), children: tabs.map((tab) => /* @__PURE__ */ jsx(
         "button",
         {
-          onClick: () => setActiveTab(tab.id),
+          onClick: () => handleTabChange(tab.id),
           className: cn(
             "px-6 py-3 text-sm font-medium transition-colors",
             activeTab === tab.id ? cn("border-b-2 border-primary text-primary", activeTabClassName) : "text-muted-foreground hover:text-foreground",
@@ -63,13 +69,13 @@ function AboutInteractiveTabs({
         )
       ] })
     ] });
-  };
+  }, [tabsSlot, tabs, tabsContainerClassName, activeTab, activeTabClassName, tabButtonClassName, handleTabChange, activeContent, tabContentClassName, tabContentTitleClassName, tabContentDescriptionClassName, tabContentImageClassName, optixFlowConfig]);
   return /* @__PURE__ */ jsx("section", { className: cn("py-32", className), children: /* @__PURE__ */ jsxs("div", { className: cn("container", containerClassName), children: [
     /* @__PURE__ */ jsxs("div", { className: cn("mx-auto max-w-3xl text-center", headerClassName), children: [
       title && (typeof title === "string" ? /* @__PURE__ */ jsx("h1", { className: cn("text-4xl font-bold tracking-tight md:text-5xl", 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", subtitleClassName), children: subtitle }) : /* @__PURE__ */ jsx("div", { className: cn("mt-4", subtitleClassName), children: subtitle }))
     ] }),
-    (tabsSlot || tabs && tabs.length > 0) && renderTabs()
+    (tabsSlot || tabs && tabs.length > 0) && tabsContent
   ] }) });
 }
 

package/dist/about-location-info-hero.cjs

@@ -1,10 +1,10 @@
 "use client";
 'use strict';
 
+var React = require('react');
 var clsx = require('clsx');
 var tailwindMerge = require('tailwind-merge');
 var img = require('@page-speed/img');
-var React = require('react');
 var classVarianceAuthority = require('class-variance-authority');
 var jsxRuntime = require('react/jsx-runtime');
 
@@ -28,7 +28,7 @@ function _interopNamespace(e) {
 
 var React__namespace = /*#__PURE__*/_interopNamespace(React);
 
-// lib/utils.ts
+// components/blocks/about/about-location-info-hero.tsx
 function cn(...inputs) {
   return tailwindMerge.twMerge(clsx.clsx(inputs));
 }
@@ -1076,7 +1076,7 @@ function AboutLocationInfoHero({
   optixFlowConfig
 }) {
   const isSingleImage = (images?.length ?? 0) <= 1;
-  const renderActions = () => {
+  const actionsContent = React.useMemo(() => {
     if (actionsSlot) return actionsSlot;
     if (!actions || actions.length === 0) return null;
     return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("flex flex-wrap gap-4", actionsClassName), children: actions.map((action, index) => /* @__PURE__ */ jsxRuntime.jsx(
@@ -1089,8 +1089,8 @@ function AboutLocationInfoHero({
       },
       index
     )) });
-  };
-  const renderHoursSections = () => {
+  }, [actionsSlot, actions, actionsClassName]);
+  const hoursSectionsContent = React.useMemo(() => {
     if (hoursSectionsSlot) return hoursSectionsSlot;
     if (!hoursSections || hoursSections.length === 0) return null;
     return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("space-y-4", hoursSectionsClassName), children: hoursSections.map((section, sectionIndex) => /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
@@ -1107,8 +1107,8 @@ function AboutLocationInfoHero({
         item.time && (typeof item.time === "string" ? /* @__PURE__ */ jsxRuntime.jsx("span", { children: item.time }) : item.time)
       ] }, itemIndex)) })
     ] }, sectionIndex)) });
-  };
-  const renderImages = () => {
+  }, [hoursSectionsSlot, hoursSections, hoursSectionsClassName, accentColor]);
+  const imagesContent = React.useMemo(() => {
     if (imagesSlot) return imagesSlot;
     if (!images || images.length === 0) return null;
     if (isSingleImage) {
@@ -1123,7 +1123,7 @@ function AboutLocationInfoHero({
             img.Img,
             {
               src: images[0]?.src || imagePlaceholders[5],
-              alt: images[0]?.alt || "OpenSite AI location",
+              alt: images[0]?.alt || "Location image",
               className: "h-full w-full object-cover",
               optixFlowConfig
             }
@@ -1143,7 +1143,7 @@ function AboutLocationInfoHero({
             img.Img,
             {
               src: images[0]?.src || imagePlaceholders[5],
-              alt: images[0]?.alt || "OpenSite AI location",
+              alt: images[0]?.alt || "Location image",
               className: "h-full w-full object-cover",
               optixFlowConfig
             }
@@ -1152,7 +1152,7 @@ function AboutLocationInfoHero({
             img.Img,
             {
               src: images[1]?.src || imagePlaceholders[6],
-              alt: images[1]?.alt || "OpenSite AI advisors",
+              alt: images[1]?.alt || "Secondary location image",
               className: "h-full w-full object-cover",
               optixFlowConfig
             }
@@ -1160,7 +1160,7 @@ function AboutLocationInfoHero({
         ]
       }
     );
-  };
+  }, [imagesSlot, images, isSingleImage, imagesClassName, optixFlowConfig]);
   return /* @__PURE__ */ jsxRuntime.jsx(
     Section,
     {
@@ -1190,7 +1190,7 @@ function AboutLocationInfoHero({
                   children: headline
                 }
               ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: headlineClassName, children: headline })),
-              renderActions(),
+              actionsContent,
               address || phone ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-2", children: [
                 address ? /* @__PURE__ */ jsxRuntime.jsxs(
                   "div",
@@ -1240,9 +1240,9 @@ function AboutLocationInfoHero({
                   }
                 ) : null
               ] }) : null,
-              renderHoursSections()
+              hoursSectionsContent
             ] }),
-            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative flex-1", children: renderImages() })
+            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative flex-1", children: imagesContent })
           ]
         }
       ) })

package/dist/about-location-info-hero.d.cts

@@ -1,9 +1,9 @@
 import * as React from 'react';
 import { P as PatternName } from './pattern-background-a7gKHzHy.cjs';
-import { A as ActionConfig, O as OptixFlowConfig } from './blocks-DP3Vofl4.cjs';
+import { A as ActionConfig, O as OptixFlowConfig } from './blocks-Cohq4eio.cjs';
 import 'react/jsx-runtime';
 import 'class-variance-authority';
-import './button-variants-CdNtNOuP.cjs';
+import './button-variants-lRElsmTc.cjs';
 import 'class-variance-authority/types';
 
 interface AboutLocationInfoHeroHours {

package/dist/about-location-info-hero.d.ts

@@ -1,9 +1,9 @@
 import * as React from 'react';
 import { P as PatternName } from './pattern-background-a7gKHzHy.js';
-import { A as ActionConfig, O as OptixFlowConfig } from './blocks-XLPGq8A5.js';
+import { A as ActionConfig, O as OptixFlowConfig } from './blocks-k17uluAz.js';
 import 'react/jsx-runtime';
 import 'class-variance-authority';
-import './button-variants-CdNtNOuP.js';
+import './button-variants-lRElsmTc.js';
 import 'class-variance-authority/types';
 
 interface AboutLocationInfoHeroHours {

package/dist/about-location-info-hero.js

@@ -1,13 +1,13 @@
 "use client";
+import * as React from 'react';
+import React__default, { useMemo } from 'react';
 import { clsx } from 'clsx';
 import { twMerge } from 'tailwind-merge';
 import { Img } from '@page-speed/img';
-import * as React from 'react';
-import React__default from 'react';
 import { cva } from 'class-variance-authority';
 import { jsx, jsxs } from 'react/jsx-runtime';
 
-// lib/utils.ts
+// components/blocks/about/about-location-info-hero.tsx
 function cn(...inputs) {
   return twMerge(clsx(inputs));
 }
@@ -1055,7 +1055,7 @@ function AboutLocationInfoHero({
   optixFlowConfig
 }) {
   const isSingleImage = (images?.length ?? 0) <= 1;
-  const renderActions = () => {
+  const actionsContent = useMemo(() => {
     if (actionsSlot) return actionsSlot;
     if (!actions || actions.length === 0) return null;
     return /* @__PURE__ */ jsx("div", { className: cn("flex flex-wrap gap-4", actionsClassName), children: actions.map((action, index) => /* @__PURE__ */ jsx(
@@ -1068,8 +1068,8 @@ function AboutLocationInfoHero({
       },
       index
     )) });
-  };
-  const renderHoursSections = () => {
+  }, [actionsSlot, actions, actionsClassName]);
+  const hoursSectionsContent = useMemo(() => {
     if (hoursSectionsSlot) return hoursSectionsSlot;
     if (!hoursSections || hoursSections.length === 0) return null;
     return /* @__PURE__ */ jsx("div", { className: cn("space-y-4", hoursSectionsClassName), children: hoursSections.map((section, sectionIndex) => /* @__PURE__ */ jsxs("div", { children: [
@@ -1086,8 +1086,8 @@ function AboutLocationInfoHero({
         item.time && (typeof item.time === "string" ? /* @__PURE__ */ jsx("span", { children: item.time }) : item.time)
       ] }, itemIndex)) })
     ] }, sectionIndex)) });
-  };
-  const renderImages = () => {
+  }, [hoursSectionsSlot, hoursSections, hoursSectionsClassName, accentColor]);
+  const imagesContent = useMemo(() => {
     if (imagesSlot) return imagesSlot;
     if (!images || images.length === 0) return null;
     if (isSingleImage) {
@@ -1102,7 +1102,7 @@ function AboutLocationInfoHero({
             Img,
             {
               src: images[0]?.src || imagePlaceholders[5],
-              alt: images[0]?.alt || "OpenSite AI location",
+              alt: images[0]?.alt || "Location image",
               className: "h-full w-full object-cover",
               optixFlowConfig
             }
@@ -1122,7 +1122,7 @@ function AboutLocationInfoHero({
             Img,
             {
               src: images[0]?.src || imagePlaceholders[5],
-              alt: images[0]?.alt || "OpenSite AI location",
+              alt: images[0]?.alt || "Location image",
               className: "h-full w-full object-cover",
               optixFlowConfig
             }
@@ -1131,7 +1131,7 @@ function AboutLocationInfoHero({
             Img,
             {
               src: images[1]?.src || imagePlaceholders[6],
-              alt: images[1]?.alt || "OpenSite AI advisors",
+              alt: images[1]?.alt || "Secondary location image",
               className: "h-full w-full object-cover",
               optixFlowConfig
             }
@@ -1139,7 +1139,7 @@ function AboutLocationInfoHero({
         ]
       }
     );
-  };
+  }, [imagesSlot, images, isSingleImage, imagesClassName, optixFlowConfig]);
   return /* @__PURE__ */ jsx(
     Section,
     {
@@ -1169,7 +1169,7 @@ function AboutLocationInfoHero({
                   children: headline
                 }
               ) : /* @__PURE__ */ jsx("div", { className: headlineClassName, children: headline })),
-              renderActions(),
+              actionsContent,
               address || phone ? /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
                 address ? /* @__PURE__ */ jsxs(
                   "div",
@@ -1219,9 +1219,9 @@ function AboutLocationInfoHero({
                   }
                 ) : null
               ] }) : null,
-              renderHoursSections()
+              hoursSectionsContent
             ] }),
-            /* @__PURE__ */ jsx("div", { className: "relative flex-1", children: renderImages() })
+            /* @__PURE__ */ jsx("div", { className: "relative flex-1", children: imagesContent })
           ]
         }
       ) })

package/dist/about-minimal-story.cjs

@@ -1,12 +1,13 @@
 "use client";
 'use strict';
 
+var react = require('react');
 var clsx = require('clsx');
 var tailwindMerge = require('tailwind-merge');
 var img = require('@page-speed/img');
 var jsxRuntime = require('react/jsx-runtime');
 
-// lib/utils.ts
+// components/blocks/about/about-minimal-story.tsx
 function cn(...inputs) {
   return tailwindMerge.twMerge(clsx.clsx(inputs));
 }
@@ -25,7 +26,7 @@ function AboutMinimalStory({
   imageClassName,
   optixFlowConfig
 }) {
-  const renderAuthor = () => {
+  const authorContent = react.useMemo(() => {
     if (authorSlot) return authorSlot;
     if (!author) return null;
     return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("mb-12 flex items-center gap-4", authorClassName), children: [
@@ -43,9 +44,9 @@ function AboutMinimalStory({
         /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground", children: author.role })
       ] })
     ] });
-  };
+  }, [authorSlot, author, authorClassName, optixFlowConfig]);
   return /* @__PURE__ */ jsxRuntime.jsx("section", { className: cn("py-32", className), children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("container", containerClassName), children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("mx-auto max-w-3xl", contentClassName), children: [
-    (authorSlot || author) && renderAuthor(),
+    (authorSlot || author) && authorContent,
     title && (typeof title === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h1", { className: cn("text-4xl font-bold tracking-tight md:text-5xl", titleClassName), children: title }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: titleClassName, children: title })),
     content && (typeof content === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("mt-8 text-lg leading-relaxed text-muted-foreground whitespace-pre-line", bodyClassName), children: content }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("mt-8", bodyClassName), children: content })),
     featuredImage && /* @__PURE__ */ jsxRuntime.jsx(

package/dist/about-minimal-story.d.cts

@@ -1,7 +1,7 @@
 import * as React from 'react';
-import { O as OptixFlowConfig } from './blocks-DP3Vofl4.cjs';
+import { 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 AboutMinimalStoryProps {

package/dist/about-minimal-story.d.ts

@@ -1,7 +1,7 @@
 import * as React from 'react';
-import { O as OptixFlowConfig } from './blocks-XLPGq8A5.js';
+import { 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 AboutMinimalStoryProps {

package/dist/about-minimal-story.js

@@ -1,10 +1,11 @@
 "use client";
+import { useMemo } from 'react';
 import { clsx } from 'clsx';
 import { twMerge } from 'tailwind-merge';
 import { Img } from '@page-speed/img';
-import { jsx, jsxs } from 'react/jsx-runtime';
+import { jsxs, jsx } from 'react/jsx-runtime';
 
-// lib/utils.ts
+// components/blocks/about/about-minimal-story.tsx
 function cn(...inputs) {
   return twMerge(clsx(inputs));
 }
@@ -23,7 +24,7 @@ function AboutMinimalStory({
   imageClassName,
   optixFlowConfig
 }) {
-  const renderAuthor = () => {
+  const authorContent = useMemo(() => {
     if (authorSlot) return authorSlot;
     if (!author) return null;
     return /* @__PURE__ */ jsxs("div", { className: cn("mb-12 flex items-center gap-4", authorClassName), children: [
@@ -41,9 +42,9 @@ function AboutMinimalStory({
         /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: author.role })
       ] })
     ] });
-  };
+  }, [authorSlot, author, authorClassName, optixFlowConfig]);
   return /* @__PURE__ */ jsx("section", { className: cn("py-32", className), children: /* @__PURE__ */ jsx("div", { className: cn("container", containerClassName), children: /* @__PURE__ */ jsxs("div", { className: cn("mx-auto max-w-3xl", contentClassName), children: [
-    (authorSlot || author) && renderAuthor(),
+    (authorSlot || author) && authorContent,
     title && (typeof title === "string" ? /* @__PURE__ */ jsx("h1", { className: cn("text-4xl font-bold tracking-tight md:text-5xl", titleClassName), children: title }) : /* @__PURE__ */ jsx("div", { className: titleClassName, children: title })),
     content && (typeof content === "string" ? /* @__PURE__ */ jsx("p", { className: cn("mt-8 text-lg leading-relaxed text-muted-foreground whitespace-pre-line", bodyClassName), children: content }) : /* @__PURE__ */ jsx("div", { className: cn("mt-8", bodyClassName), children: content })),
     featuredImage && /* @__PURE__ */ jsx(

package/dist/about-mission-dual-image.cjs

@@ -1,10 +1,10 @@
 "use client";
 'use strict';
 
+var React = require('react');
 var clsx = require('clsx');
 var tailwindMerge = require('tailwind-merge');
 var img = require('@page-speed/img');
-var React = require('react');
 var classVarianceAuthority = require('class-variance-authority');
 var jsxRuntime = require('react/jsx-runtime');
 
@@ -28,7 +28,7 @@ function _interopNamespace(e) {
 
 var React__namespace = /*#__PURE__*/_interopNamespace(React);
 
-// lib/utils.ts
+// components/blocks/about/about-mission-dual-image.tsx
 function cn(...inputs) {
   return tailwindMerge.twMerge(clsx.clsx(inputs));
 }
@@ -471,7 +471,7 @@ function AboutMissionDualImage({
   actionsClassName,
   optixFlowConfig
 }) {
-  const renderActions = () => {
+  const actionsContent = React.useMemo(() => {
     if (actionsSlot) return actionsSlot;
     if (!actions || actions.length === 0) return null;
     return actions.map((action, index) => {
@@ -491,7 +491,7 @@ function AboutMissionDualImage({
         index
       );
     });
-  };
+  }, [actionsSlot, actions]);
   return /* @__PURE__ */ jsxRuntime.jsx("section", { className: cn("py-32", className), children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("container", containerClassName), children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("grid gap-16 lg:grid-cols-2", contentClassName), children: [
     /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col justify-center", children: [
       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mb-12", children: [
@@ -502,7 +502,7 @@ function AboutMissionDualImage({
         visionTitle && (typeof visionTitle === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h2", { className: cn("text-3xl font-bold tracking-tight md:text-4xl", visionTitleClassName), children: visionTitle }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: visionTitleClassName, children: visionTitle })),
         visionContent && (typeof visionContent === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("mt-4 text-lg text-muted-foreground", visionContentClassName), children: visionContent }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("mt-4", visionContentClassName), children: visionContent }))
       ] }),
-      (actionsSlot || actions && actions.length > 0) && /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("mt-8 flex flex-wrap gap-4", actionsClassName), children: renderActions() })
+      (actionsSlot || actions && actions.length > 0) && /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("mt-8 flex flex-wrap gap-4", actionsClassName), children: actionsContent })
     ] }),
     /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative grid grid-cols-2 gap-4", children: [
       primaryImage && /* @__PURE__ */ jsxRuntime.jsx(

package/dist/about-mission-dual-image.d.cts

@@ -1,7 +1,7 @@
 import * as React from 'react';
-import { A as ActionConfig, O as OptixFlowConfig } from './blocks-DP3Vofl4.cjs';
+import { 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 AboutMissionDualImageProps {

package/dist/about-mission-dual-image.d.ts

@@ -1,7 +1,7 @@
 import * as React from 'react';
-import { A as ActionConfig, O as OptixFlowConfig } from './blocks-XLPGq8A5.js';
+import { 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 AboutMissionDualImageProps {

package/dist/about-mission-dual-image.js

@@ -1,12 +1,13 @@
 "use client";
+import * as React from 'react';
+import { useMemo } from 'react';
 import { clsx } from 'clsx';
 import { twMerge } from 'tailwind-merge';
 import { Img } from '@page-speed/img';
-import * as React from 'react';
 import { cva } from 'class-variance-authority';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 
-// lib/utils.ts
+// components/blocks/about/about-mission-dual-image.tsx
 function cn(...inputs) {
   return twMerge(clsx(inputs));
 }
@@ -449,7 +450,7 @@ function AboutMissionDualImage({
   actionsClassName,
   optixFlowConfig
 }) {
-  const renderActions = () => {
+  const actionsContent = useMemo(() => {
     if (actionsSlot) return actionsSlot;
     if (!actions || actions.length === 0) return null;
     return actions.map((action, index) => {
@@ -469,7 +470,7 @@ function AboutMissionDualImage({
         index
       );
     });
-  };
+  }, [actionsSlot, actions]);
   return /* @__PURE__ */ jsx("section", { className: cn("py-32", className), children: /* @__PURE__ */ jsx("div", { className: cn("container", containerClassName), children: /* @__PURE__ */ jsxs("div", { className: cn("grid gap-16 lg:grid-cols-2", contentClassName), children: [
     /* @__PURE__ */ jsxs("div", { className: "flex flex-col justify-center", children: [
       /* @__PURE__ */ jsxs("div", { className: "mb-12", children: [
@@ -480,7 +481,7 @@ function AboutMissionDualImage({
         visionTitle && (typeof visionTitle === "string" ? /* @__PURE__ */ jsx("h2", { className: cn("text-3xl font-bold tracking-tight md:text-4xl", visionTitleClassName), children: visionTitle }) : /* @__PURE__ */ jsx("div", { className: visionTitleClassName, children: visionTitle })),
         visionContent && (typeof visionContent === "string" ? /* @__PURE__ */ jsx("p", { className: cn("mt-4 text-lg text-muted-foreground", visionContentClassName), children: visionContent }) : /* @__PURE__ */ jsx("div", { className: cn("mt-4", visionContentClassName), children: visionContent }))
       ] }),
-      (actionsSlot || actions && actions.length > 0) && /* @__PURE__ */ jsx("div", { className: cn("mt-8 flex flex-wrap gap-4", actionsClassName), children: renderActions() })
+      (actionsSlot || actions && actions.length > 0) && /* @__PURE__ */ jsx("div", { className: cn("mt-8 flex flex-wrap gap-4", actionsClassName), children: actionsContent })
     ] }),
     /* @__PURE__ */ jsxs("div", { className: "relative grid grid-cols-2 gap-4", children: [
       primaryImage && /* @__PURE__ */ jsx(

package/dist/about-mission-features.cjs

@@ -1,12 +1,13 @@
 "use client";
 'use strict';
 
+var react = require('react');
 var clsx = require('clsx');
 var tailwindMerge = require('tailwind-merge');
 var img = require('@page-speed/img');
 var jsxRuntime = require('react/jsx-runtime');
 
-// lib/utils.ts
+// components/blocks/about/about-mission-features.tsx
 function cn(...inputs) {
   return tailwindMerge.twMerge(clsx.clsx(inputs));
 }
@@ -34,7 +35,7 @@ function AboutMissionFeatures({
   featuresClassName,
   optixFlowConfig
 }) {
-  const renderFeatures = () => {
+  const featuresContent = react.useMemo(() => {
     if (featuresSlot) return featuresSlot;
     if (!features || features.length === 0) return null;
     return features.map((feature, idx) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col", children: [
@@ -42,7 +43,7 @@ function AboutMissionFeatures({
       feature.title && (typeof feature.title === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "mt-2 mb-3 text-lg font-semibold", children: feature.title }) : feature.title),
       feature.description && (typeof feature.description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-muted-foreground", children: feature.description }) : feature.description)
     ] }, idx));
-  };
+  }, [featuresSlot, features]);
   return /* @__PURE__ */ jsxRuntime.jsx("section", { className: cn("py-32", className), children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("container flex flex-col gap-16 lg:gap-28", containerClassName), children: [
     /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-4 lg:gap-8", children: [
       title && (typeof title === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h1", { className: cn("text-4xl font-semibold tracking-tighter lg:text-7xl", titleClassName), children: title }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: titleClassName, children: title })),
@@ -79,7 +80,7 @@ function AboutMissionFeatures({
         featuresTitle && (typeof featuresTitle === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h2", { className: cn("mb-4 text-3xl font-semibold tracking-tight md:text-5xl", featuresTitleClassName), children: featuresTitle }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: featuresTitleClassName, children: featuresTitle })),
         featuresDescription && (typeof featuresDescription === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("text-lg text-muted-foreground", featuresDescriptionClassName), children: featuresDescription }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: featuresDescriptionClassName, children: featuresDescription }))
       ] }),
-      /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("grid gap-10 md:grid-cols-3", featuresClassName), children: renderFeatures() })
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("grid gap-10 md:grid-cols-3", featuresClassName), children: featuresContent })
     ] })
   ] }) });
 }

package/dist/about-mission-features.d.cts

@@ -1,7 +1,7 @@
 import * as React from 'react';
-import { F as FeatureItem, O as OptixFlowConfig } from './blocks-DP3Vofl4.cjs';
+import { F as FeatureItem, 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 AboutMissionFeaturesProps {

package/dist/about-mission-features.d.ts

@@ -1,7 +1,7 @@
 import * as React from 'react';
-import { F as FeatureItem, O as OptixFlowConfig } from './blocks-XLPGq8A5.js';
+import { F as FeatureItem, 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 AboutMissionFeaturesProps {

package/dist/about-mission-features.js

@@ -1,10 +1,11 @@
 "use client";
+import { useMemo } from 'react';
 import { clsx } from 'clsx';
 import { twMerge } from 'tailwind-merge';
 import { Img } from '@page-speed/img';
-import { jsx, jsxs } from 'react/jsx-runtime';
+import { jsxs, jsx } from 'react/jsx-runtime';
 
-// lib/utils.ts
+// components/blocks/about/about-mission-features.tsx
 function cn(...inputs) {
   return twMerge(clsx(inputs));
 }
@@ -32,7 +33,7 @@ function AboutMissionFeatures({
   featuresClassName,
   optixFlowConfig
 }) {
-  const renderFeatures = () => {
+  const featuresContent = useMemo(() => {
     if (featuresSlot) return featuresSlot;
     if (!features || features.length === 0) return null;
     return features.map((feature, idx) => /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
@@ -40,7 +41,7 @@ function AboutMissionFeatures({
       feature.title && (typeof feature.title === "string" ? /* @__PURE__ */ jsx("h3", { className: "mt-2 mb-3 text-lg font-semibold", children: feature.title }) : feature.title),
       feature.description && (typeof feature.description === "string" ? /* @__PURE__ */ jsx("p", { className: "text-muted-foreground", children: feature.description }) : feature.description)
     ] }, idx));
-  };
+  }, [featuresSlot, features]);
   return /* @__PURE__ */ jsx("section", { className: cn("py-32", className), children: /* @__PURE__ */ jsxs("div", { className: cn("container flex flex-col gap-16 lg:gap-28", containerClassName), children: [
     /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-4 lg:gap-8", children: [
       title && (typeof title === "string" ? /* @__PURE__ */ jsx("h1", { className: cn("text-4xl font-semibold tracking-tighter lg:text-7xl", titleClassName), children: title }) : /* @__PURE__ */ jsx("div", { className: titleClassName, children: title })),
@@ -77,7 +78,7 @@ function AboutMissionFeatures({
         featuresTitle && (typeof featuresTitle === "string" ? /* @__PURE__ */ jsx("h2", { className: cn("mb-4 text-3xl font-semibold tracking-tight md:text-5xl", featuresTitleClassName), children: featuresTitle }) : /* @__PURE__ */ jsx("div", { className: featuresTitleClassName, children: featuresTitle })),
         featuresDescription && (typeof featuresDescription === "string" ? /* @__PURE__ */ jsx("p", { className: cn("text-lg text-muted-foreground", featuresDescriptionClassName), children: featuresDescription }) : /* @__PURE__ */ jsx("div", { className: featuresDescriptionClassName, children: featuresDescription }))
       ] }),
-      /* @__PURE__ */ jsx("div", { className: cn("grid gap-10 md:grid-cols-3", featuresClassName), children: renderFeatures() })
+      /* @__PURE__ */ jsx("div", { className: cn("grid gap-10 md:grid-cols-3", featuresClassName), children: featuresContent })
     ] })
   ] }) });
 }