@opensite/ui 1.5.1 → 1.5.3

package/dist/footer-newsletter-contact.js

@@ -1153,7 +1153,7 @@ var platformIconMap = {
   yelp: "cib/yelp",
   spotify: "cib/spotify",
   apple: "cib/apple",
-  x: "line-md/twitter-x",
+  x: "line-md/twitter-x-alt",
   github: "cib/github",
   snapchat: "cib/snapchat",
   discord: "cib/discord",
@@ -1172,6 +1172,8 @@ var platformIconMap = {
   npmjs: "simple-icons/npm",
   crates: "cib/rust",
   rubygems: "cib/rubygems",
+  behance: "cib/behance",
+  dribbble: "cib/dribbble",
   unknown: "icon-park-solid/circular-connection"
 };
 var SocialLinkIcon = React.forwardRef(

package/dist/footer-newsletter-grid.cjs

@@ -1544,7 +1544,7 @@ var platformIconMap = {
   yelp: "cib/yelp",
   spotify: "cib/spotify",
   apple: "cib/apple",
-  x: "line-md/twitter-x",
+  x: "line-md/twitter-x-alt",
   github: "cib/github",
   snapchat: "cib/snapchat",
   discord: "cib/discord",
@@ -1563,6 +1563,8 @@ var platformIconMap = {
   npmjs: "simple-icons/npm",
   crates: "cib/rust",
   rubygems: "cib/rubygems",
+  behance: "cib/behance",
+  dribbble: "cib/dribbble",
   unknown: "icon-park-solid/circular-connection"
 };
 var SocialLinkIcon = React__namespace.forwardRef(

package/dist/footer-newsletter-grid.js

@@ -1523,7 +1523,7 @@ var platformIconMap = {
   yelp: "cib/yelp",
   spotify: "cib/spotify",
   apple: "cib/apple",
-  x: "line-md/twitter-x",
+  x: "line-md/twitter-x-alt",
   github: "cib/github",
   snapchat: "cib/snapchat",
   discord: "cib/discord",
@@ -1542,6 +1542,8 @@ var platformIconMap = {
   npmjs: "simple-icons/npm",
   crates: "cib/rust",
   rubygems: "cib/rubygems",
+  behance: "cib/behance",
+  dribbble: "cib/dribbble",
   unknown: "icon-park-solid/circular-connection"
 };
 var SocialLinkIcon = React.forwardRef(

package/dist/footer-newsletter-minimal.cjs

@@ -1102,7 +1102,7 @@ var platformIconMap = {
   yelp: "cib/yelp",
   spotify: "cib/spotify",
   apple: "cib/apple",
-  x: "line-md/twitter-x",
+  x: "line-md/twitter-x-alt",
   github: "cib/github",
   snapchat: "cib/snapchat",
   discord: "cib/discord",
@@ -1121,6 +1121,8 @@ var platformIconMap = {
   npmjs: "simple-icons/npm",
   crates: "cib/rust",
   rubygems: "cib/rubygems",
+  behance: "cib/behance",
+  dribbble: "cib/dribbble",
   unknown: "icon-park-solid/circular-connection"
 };
 var SocialLinkIcon = React__namespace.forwardRef(

package/dist/footer-newsletter-minimal.js

@@ -1081,7 +1081,7 @@ var platformIconMap = {
   yelp: "cib/yelp",
   spotify: "cib/spotify",
   apple: "cib/apple",
-  x: "line-md/twitter-x",
+  x: "line-md/twitter-x-alt",
   github: "cib/github",
   snapchat: "cib/snapchat",
   discord: "cib/discord",
@@ -1100,6 +1100,8 @@ var platformIconMap = {
   npmjs: "simple-icons/npm",
   crates: "cib/rust",
   rubygems: "cib/rubygems",
+  behance: "cib/behance",
+  dribbble: "cib/dribbble",
   unknown: "icon-park-solid/circular-connection"
 };
 var SocialLinkIcon = React.forwardRef(

package/dist/footer-simple-centered.cjs

@@ -1436,8 +1436,8 @@ function FooterSimpleCentered({
   bottomLinks,
   className,
   footerClassName,
-  containerClassName = "px-6 sm:px-6 md:px-8 lg:px-8",
   contentClassName,
+  containerClassName = "px-6 sm:px-6 md:px-8 lg:px-8",
   spacing = "py-12 md:py-32",
   brandClassName,
   logoWrapperClassName,

package/dist/footer-simple-centered.d.cts

@@ -105,6 +105,6 @@ interface FooterSimpleCenteredProps {
  * Ideal for corporate websites, landing pages, and products that prefer a clean,
  * uncluttered footer design without social media or newsletter elements.
  */
-declare function FooterSimpleCentered({ logo, tagline, sitemap, copyright, bottomLinks, className, footerClassName, containerClassName, contentClassName, spacing, brandClassName, logoWrapperClassName, logoClassName, taglineClassName, sitemapWrapperClassName, sitemapSectionClassName, sitemapTitleClassName, sitemapLinksClassName, sitemapLinkClassName, bottomBarClassName, copyrightClassName, bottomLinksClassName, bottomLinkClassName, background, pattern, patternOpacity, optixFlowConfig, }: FooterSimpleCenteredProps): React.JSX.Element;
+declare function FooterSimpleCentered({ logo, tagline, sitemap, copyright, bottomLinks, className, footerClassName, contentClassName, containerClassName, spacing, brandClassName, logoWrapperClassName, logoClassName, taglineClassName, sitemapWrapperClassName, sitemapSectionClassName, sitemapTitleClassName, sitemapLinksClassName, sitemapLinkClassName, bottomBarClassName, copyrightClassName, bottomLinksClassName, bottomLinkClassName, background, pattern, patternOpacity, optixFlowConfig, }: FooterSimpleCenteredProps): React.JSX.Element;
 
 export { FooterSimpleCentered, type FooterSimpleCenteredProps, type FooterSimpleCenteredSection };

package/dist/footer-simple-centered.d.ts

@@ -105,6 +105,6 @@ interface FooterSimpleCenteredProps {
  * Ideal for corporate websites, landing pages, and products that prefer a clean,
  * uncluttered footer design without social media or newsletter elements.
  */
-declare function FooterSimpleCentered({ logo, tagline, sitemap, copyright, bottomLinks, className, footerClassName, containerClassName, contentClassName, spacing, brandClassName, logoWrapperClassName, logoClassName, taglineClassName, sitemapWrapperClassName, sitemapSectionClassName, sitemapTitleClassName, sitemapLinksClassName, sitemapLinkClassName, bottomBarClassName, copyrightClassName, bottomLinksClassName, bottomLinkClassName, background, pattern, patternOpacity, optixFlowConfig, }: FooterSimpleCenteredProps): React.JSX.Element;
+declare function FooterSimpleCentered({ logo, tagline, sitemap, copyright, bottomLinks, className, footerClassName, contentClassName, containerClassName, spacing, brandClassName, logoWrapperClassName, logoClassName, taglineClassName, sitemapWrapperClassName, sitemapSectionClassName, sitemapTitleClassName, sitemapLinksClassName, sitemapLinkClassName, bottomBarClassName, copyrightClassName, bottomLinksClassName, bottomLinkClassName, background, pattern, patternOpacity, optixFlowConfig, }: FooterSimpleCenteredProps): React.JSX.Element;
 
 export { FooterSimpleCentered, type FooterSimpleCenteredProps, type FooterSimpleCenteredSection };

package/dist/footer-simple-centered.js

@@ -1415,8 +1415,8 @@ function FooterSimpleCentered({
   bottomLinks,
   className,
   footerClassName,
-  containerClassName = "px-6 sm:px-6 md:px-8 lg:px-8",
   contentClassName,
+  containerClassName = "px-6 sm:px-6 md:px-8 lg:px-8",
   spacing = "py-12 md:py-32",
   brandClassName,
   logoWrapperClassName,

package/dist/footer-social-apps.cjs

@@ -1544,7 +1544,7 @@ var platformIconMap = {
   yelp: "cib/yelp",
   spotify: "cib/spotify",
   apple: "cib/apple",
-  x: "line-md/twitter-x",
+  x: "line-md/twitter-x-alt",
   github: "cib/github",
   snapchat: "cib/snapchat",
   discord: "cib/discord",
@@ -1563,6 +1563,8 @@ var platformIconMap = {
   npmjs: "simple-icons/npm",
   crates: "cib/rust",
   rubygems: "cib/rubygems",
+  behance: "cib/behance",
+  dribbble: "cib/dribbble",
   unknown: "icon-park-solid/circular-connection"
 };
 var SocialLinkIcon = React__namespace.forwardRef(

package/dist/footer-social-apps.js

@@ -1523,7 +1523,7 @@ var platformIconMap = {
   yelp: "cib/yelp",
   spotify: "cib/spotify",
   apple: "cib/apple",
-  x: "line-md/twitter-x",
+  x: "line-md/twitter-x-alt",
   github: "cib/github",
   snapchat: "cib/snapchat",
   discord: "cib/discord",
@@ -1542,6 +1542,8 @@ var platformIconMap = {
   npmjs: "simple-icons/npm",
   crates: "cib/rust",
   rubygems: "cib/rubygems",
+  behance: "cib/behance",
+  dribbble: "cib/dribbble",
   unknown: "icon-park-solid/circular-connection"
 };
 var SocialLinkIcon = React.forwardRef(

package/dist/footer-social-newsletter.cjs

@@ -1544,7 +1544,7 @@ var platformIconMap = {
   yelp: "cib/yelp",
   spotify: "cib/spotify",
   apple: "cib/apple",
-  x: "line-md/twitter-x",
+  x: "line-md/twitter-x-alt",
   github: "cib/github",
   snapchat: "cib/snapchat",
   discord: "cib/discord",
@@ -1563,6 +1563,8 @@ var platformIconMap = {
   npmjs: "simple-icons/npm",
   crates: "cib/rust",
   rubygems: "cib/rubygems",
+  behance: "cib/behance",
+  dribbble: "cib/dribbble",
   unknown: "icon-park-solid/circular-connection"
 };
 var SocialLinkIcon = React__namespace.forwardRef(

package/dist/footer-social-newsletter.js

@@ -1523,7 +1523,7 @@ var platformIconMap = {
   yelp: "cib/yelp",
   spotify: "cib/spotify",
   apple: "cib/apple",
-  x: "line-md/twitter-x",
+  x: "line-md/twitter-x-alt",
   github: "cib/github",
   snapchat: "cib/snapchat",
   discord: "cib/discord",
@@ -1542,6 +1542,8 @@ var platformIconMap = {
   npmjs: "simple-icons/npm",
   crates: "cib/rust",
   rubygems: "cib/rubygems",
+  behance: "cib/behance",
+  dribbble: "cib/dribbble",
   unknown: "icon-park-solid/circular-connection"
 };
 var SocialLinkIcon = React.forwardRef(

package/dist/footer-split-image-accordion.cjs

@@ -1217,7 +1217,7 @@ var platformIconMap = {
   yelp: "cib/yelp",
   spotify: "cib/spotify",
   apple: "cib/apple",
-  x: "line-md/twitter-x",
+  x: "line-md/twitter-x-alt",
   github: "cib/github",
   snapchat: "cib/snapchat",
   discord: "cib/discord",
@@ -1236,6 +1236,8 @@ var platformIconMap = {
   npmjs: "simple-icons/npm",
   crates: "cib/rust",
   rubygems: "cib/rubygems",
+  behance: "cib/behance",
+  dribbble: "cib/dribbble",
   unknown: "icon-park-solid/circular-connection"
 };
 var SocialLinkIcon = React__namespace.forwardRef(

package/dist/footer-split-image-accordion.js

@@ -1195,7 +1195,7 @@ var platformIconMap = {
   yelp: "cib/yelp",
   spotify: "cib/spotify",
   apple: "cib/apple",
-  x: "line-md/twitter-x",
+  x: "line-md/twitter-x-alt",
   github: "cib/github",
   snapchat: "cib/snapchat",
   discord: "cib/discord",
@@ -1214,6 +1214,8 @@ var platformIconMap = {
   npmjs: "simple-icons/npm",
   crates: "cib/rust",
   rubygems: "cib/rubygems",
+  behance: "cib/behance",
+  dribbble: "cib/dribbble",
   unknown: "icon-park-solid/circular-connection"
 };
 var SocialLinkIcon = React.forwardRef(

package/dist/hero-centered-screenshot.cjs

@@ -32,54 +32,6 @@ var React__namespace = /*#__PURE__*/_interopNamespace(React);
 function cn(...inputs) {
   return tailwindMerge.twMerge(clsx.clsx(inputs));
 }
-function getTextColor(parentBg, variant = "default", options) {
-  const isDark = parentBg === "dark" || parentBg === "secondary" || parentBg === "primary";
-  if (isDark) {
-    switch (variant) {
-      case "default":
-        return "text-foreground";
-      case "muted":
-        return "text-foreground/80";
-      case "subtle":
-        return "text-foreground/60";
-      case "accent":
-        return "text-accent-foreground";
-    }
-  } else {
-    switch (variant) {
-      case "default":
-        return "text-foreground";
-      case "muted":
-        return "text-muted-foreground";
-      case "subtle":
-        return "text-muted-foreground/70";
-      case "accent":
-        return "text-primary";
-    }
-  }
-}
-function getBorderColor(parentBg, variant = "default", options) {
-  const isDark = parentBg === "dark" || parentBg === "secondary" || parentBg === "primary";
-  if (isDark) {
-    switch (variant) {
-      case "default":
-        return "border-foreground/20";
-      case "muted":
-        return "border-foreground/10";
-      case "accent":
-        return "border-accent-foreground";
-    }
-  } else {
-    switch (variant) {
-      case "default":
-        return "border-border";
-      case "muted":
-        return "border-muted";
-      case "accent":
-        return "border-primary";
-    }
-  }
-}
 function normalizePhoneNumber(input) {
   const trimmed = input.trim();
   if (trimmed.toLowerCase().startsWith("tel:")) {
@@ -881,11 +833,11 @@ function HeroCenteredScreenshot({
   imageSrc,
   imageAlt = "placeholder",
   background,
-  spacing,
+  containerClassName = "px-6 sm:px-6 md:px-8 lg:px-8",
+  spacing = "py-12 md:py-32",
   pattern,
   patternOpacity,
   className,
-  containerClassName,
   contentClassName,
   headingClassName,
   descriptionClassName,
@@ -897,7 +849,14 @@ function HeroCenteredScreenshot({
     if (actionsSlot) return actionsSlot;
     if (!actions || actions.length === 0) return null;
     return actions.map((action, index) => {
-      const { label, icon, iconAfter, children, className: actionClassName, ...pressableProps } = action;
+      const {
+        label,
+        icon,
+        iconAfter,
+        children,
+        className: actionClassName,
+        ...pressableProps
+      } = action;
       return /* @__PURE__ */ jsxRuntime.jsx(
         Pressable,
         {
@@ -922,22 +881,50 @@ function HeroCenteredScreenshot({
       pattern,
       patternOpacity,
       className: cn(className),
-      children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("overflow-hidden border-b", getBorderColor(background, "muted")), children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("container", containerClassName), children: [
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mx-auto flex max-w-5xl flex-col items-center", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("z-10 items-center text-center", contentClassName), children: [
-          heading && (typeof heading === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h1", { className: cn("mb-8 text-4xl font-semibold text-pretty lg:text-7xl", headingClassName), children: heading }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: headingClassName, children: heading })),
-          description && (typeof description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("mx-auto max-w-3xl lg:text-xl", getTextColor(background, "muted"), descriptionClassName), children: description }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: descriptionClassName, children: description })),
-          (actionsSlot || actions && actions.length > 0) && /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("mt-12 flex w-full flex-col justify-center gap-2 sm:flex-row", actionsClassName), children: renderActions })
-        ] }) }),
+      containerClassName,
+      children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn(""), children: [
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col", children: /* @__PURE__ */ jsxRuntime.jsxs(
+          "div",
+          {
+            className: cn("z-10 items-center text-center", contentClassName),
+            children: [
+              heading && (typeof heading === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
+                "h1",
+                {
+                  className: cn(
+                    "mb-8 text-4xl font-bold text-balance lg:text-7xl",
+                    headingClassName
+                  ),
+                  children: heading
+                }
+              ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: headingClassName, children: heading })),
+              description && (typeof description === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
+                "p",
+                {
+                  className: cn(
+                    "mx-auto max-w-3xl lg:text-xl text-balance opacity-80",
+                    descriptionClassName
+                  ),
+                  children: description
+                }
+              ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: descriptionClassName, children: description })),
+              (actionsSlot || actions && actions.length > 0) && /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("lazy", actionsClassName), children: renderActions })
+            ]
+          }
+        ) }),
         imageSrc && /* @__PURE__ */ jsxRuntime.jsx(
           img.Img,
           {
             src: imageSrc,
             alt: imageAlt,
-            className: cn("mx-auto mt-24 max-h-[700px] w-full max-w-7xl rounded-t-lg object-cover shadow-lg", imageClassName),
+            className: cn(
+              "mx-auto mt-24 max-h-[700px] w-full max-w-7xl rounded-2xl object-cover shadow-lg",
+              imageClassName
+            ),
             optixFlowConfig
           }
         )
-      ] }) })
+      ] })
     }
   );
 }

package/dist/hero-centered-screenshot.d.cts

@@ -80,6 +80,6 @@ interface HeroCenteredScreenshotProps {
      */
     optixFlowConfig?: OptixFlowConfig;
 }
-declare function HeroCenteredScreenshot({ heading, description, actions, actionsSlot, imageSrc, imageAlt, background, spacing, pattern, patternOpacity, className, containerClassName, contentClassName, headingClassName, descriptionClassName, actionsClassName, imageClassName, optixFlowConfig, }: HeroCenteredScreenshotProps): React.JSX.Element;
+declare function HeroCenteredScreenshot({ heading, description, actions, actionsSlot, imageSrc, imageAlt, background, containerClassName, spacing, pattern, patternOpacity, className, contentClassName, headingClassName, descriptionClassName, actionsClassName, imageClassName, optixFlowConfig, }: HeroCenteredScreenshotProps): React.JSX.Element;
 
 export { HeroCenteredScreenshot, type HeroCenteredScreenshotProps };

package/dist/hero-centered-screenshot.d.ts

@@ -80,6 +80,6 @@ interface HeroCenteredScreenshotProps {
      */
     optixFlowConfig?: OptixFlowConfig;
 }
-declare function HeroCenteredScreenshot({ heading, description, actions, actionsSlot, imageSrc, imageAlt, background, spacing, pattern, patternOpacity, className, containerClassName, contentClassName, headingClassName, descriptionClassName, actionsClassName, imageClassName, optixFlowConfig, }: HeroCenteredScreenshotProps): React.JSX.Element;
+declare function HeroCenteredScreenshot({ heading, description, actions, actionsSlot, imageSrc, imageAlt, background, containerClassName, spacing, pattern, patternOpacity, className, contentClassName, headingClassName, descriptionClassName, actionsClassName, imageClassName, optixFlowConfig, }: HeroCenteredScreenshotProps): React.JSX.Element;
 
 export { HeroCenteredScreenshot, type HeroCenteredScreenshotProps };

package/dist/hero-centered-screenshot.js

@@ -11,54 +11,6 @@ import { Img } from '@page-speed/img';
 function cn(...inputs) {
   return twMerge(clsx(inputs));
 }
-function getTextColor(parentBg, variant = "default", options) {
-  const isDark = parentBg === "dark" || parentBg === "secondary" || parentBg === "primary";
-  if (isDark) {
-    switch (variant) {
-      case "default":
-        return "text-foreground";
-      case "muted":
-        return "text-foreground/80";
-      case "subtle":
-        return "text-foreground/60";
-      case "accent":
-        return "text-accent-foreground";
-    }
-  } else {
-    switch (variant) {
-      case "default":
-        return "text-foreground";
-      case "muted":
-        return "text-muted-foreground";
-      case "subtle":
-        return "text-muted-foreground/70";
-      case "accent":
-        return "text-primary";
-    }
-  }
-}
-function getBorderColor(parentBg, variant = "default", options) {
-  const isDark = parentBg === "dark" || parentBg === "secondary" || parentBg === "primary";
-  if (isDark) {
-    switch (variant) {
-      case "default":
-        return "border-foreground/20";
-      case "muted":
-        return "border-foreground/10";
-      case "accent":
-        return "border-accent-foreground";
-    }
-  } else {
-    switch (variant) {
-      case "default":
-        return "border-border";
-      case "muted":
-        return "border-muted";
-      case "accent":
-        return "border-primary";
-    }
-  }
-}
 function normalizePhoneNumber(input) {
   const trimmed = input.trim();
   if (trimmed.toLowerCase().startsWith("tel:")) {
@@ -860,11 +812,11 @@ function HeroCenteredScreenshot({
   imageSrc,
   imageAlt = "placeholder",
   background,
-  spacing,
+  containerClassName = "px-6 sm:px-6 md:px-8 lg:px-8",
+  spacing = "py-12 md:py-32",
   pattern,
   patternOpacity,
   className,
-  containerClassName,
   contentClassName,
   headingClassName,
   descriptionClassName,
@@ -876,7 +828,14 @@ function HeroCenteredScreenshot({
     if (actionsSlot) return actionsSlot;
     if (!actions || actions.length === 0) return null;
     return actions.map((action, index) => {
-      const { label, icon, iconAfter, children, className: actionClassName, ...pressableProps } = action;
+      const {
+        label,
+        icon,
+        iconAfter,
+        children,
+        className: actionClassName,
+        ...pressableProps
+      } = action;
       return /* @__PURE__ */ jsx(
         Pressable,
         {
@@ -901,22 +860,50 @@ function HeroCenteredScreenshot({
       pattern,
       patternOpacity,
       className: cn(className),
-      children: /* @__PURE__ */ jsx("div", { className: cn("overflow-hidden border-b", getBorderColor(background, "muted")), children: /* @__PURE__ */ jsxs("div", { className: cn("container", containerClassName), children: [
-        /* @__PURE__ */ jsx("div", { className: "mx-auto flex max-w-5xl flex-col items-center", children: /* @__PURE__ */ jsxs("div", { className: cn("z-10 items-center text-center", contentClassName), children: [
-          heading && (typeof heading === "string" ? /* @__PURE__ */ jsx("h1", { className: cn("mb-8 text-4xl font-semibold text-pretty lg:text-7xl", headingClassName), children: heading }) : /* @__PURE__ */ jsx("div", { className: headingClassName, children: heading })),
-          description && (typeof description === "string" ? /* @__PURE__ */ jsx("p", { className: cn("mx-auto max-w-3xl lg:text-xl", getTextColor(background, "muted"), descriptionClassName), children: description }) : /* @__PURE__ */ jsx("div", { className: descriptionClassName, children: description })),
-          (actionsSlot || actions && actions.length > 0) && /* @__PURE__ */ jsx("div", { className: cn("mt-12 flex w-full flex-col justify-center gap-2 sm:flex-row", actionsClassName), children: renderActions })
-        ] }) }),
+      containerClassName,
+      children: /* @__PURE__ */ jsxs("div", { className: cn(""), children: [
+        /* @__PURE__ */ jsx("div", { className: "flex flex-col", children: /* @__PURE__ */ jsxs(
+          "div",
+          {
+            className: cn("z-10 items-center text-center", contentClassName),
+            children: [
+              heading && (typeof heading === "string" ? /* @__PURE__ */ jsx(
+                "h1",
+                {
+                  className: cn(
+                    "mb-8 text-4xl font-bold text-balance lg:text-7xl",
+                    headingClassName
+                  ),
+                  children: heading
+                }
+              ) : /* @__PURE__ */ jsx("div", { className: headingClassName, children: heading })),
+              description && (typeof description === "string" ? /* @__PURE__ */ jsx(
+                "p",
+                {
+                  className: cn(
+                    "mx-auto max-w-3xl lg:text-xl text-balance opacity-80",
+                    descriptionClassName
+                  ),
+                  children: description
+                }
+              ) : /* @__PURE__ */ jsx("div", { className: descriptionClassName, children: description })),
+              (actionsSlot || actions && actions.length > 0) && /* @__PURE__ */ jsx("div", { className: cn("lazy", actionsClassName), children: renderActions })
+            ]
+          }
+        ) }),
         imageSrc && /* @__PURE__ */ jsx(
           Img,
           {
             src: imageSrc,
             alt: imageAlt,
-            className: cn("mx-auto mt-24 max-h-[700px] w-full max-w-7xl rounded-t-lg object-cover shadow-lg", imageClassName),
+            className: cn(
+              "mx-auto mt-24 max-h-[700px] w-full max-w-7xl rounded-2xl object-cover shadow-lg",
+              imageClassName
+            ),
             optixFlowConfig
           }
         )
-      ] }) })
+      ] })
     }
   );
 }