@opensite/ui 3.7.4 → 3.7.6

package/dist/hero-ecommerce-product-showcase.cjs

@@ -669,7 +669,8 @@ function HeroEcommerceProductShowcase({
               "aspect-3/4 w-full object-cover",
               images[0].className
             ),
-            optixFlowConfig
+            optixFlowConfig,
+            loading: "eager"
           }
         ) }),
         images[1] && /* @__PURE__ */ jsxRuntime.jsx("div", { className: imgClassWrapper, children: /* @__PURE__ */ jsxRuntime.jsx(
@@ -681,7 +682,8 @@ function HeroEcommerceProductShowcase({
               "aspect-square w-full object-cover",
               images[1].className
             ),
-            optixFlowConfig
+            optixFlowConfig,
+            loading: "eager"
           }
         ) })
       ] }),
@@ -695,7 +697,8 @@ function HeroEcommerceProductShowcase({
               "aspect-square w-full object-cover",
               images[2].className
             ),
-            optixFlowConfig
+            optixFlowConfig,
+            loading: "eager"
           }
         ) }),
         images[3] && /* @__PURE__ */ jsxRuntime.jsx("div", { className: imgClassWrapper, children: /* @__PURE__ */ jsxRuntime.jsx(
@@ -707,7 +710,8 @@ function HeroEcommerceProductShowcase({
               "aspect-3/4 w-full object-cover",
               images[3].className
             ),
-            optixFlowConfig
+            optixFlowConfig,
+            loading: "eager"
           }
         ) })
       ] })

package/dist/hero-ecommerce-product-showcase.js

@@ -648,7 +648,8 @@ function HeroEcommerceProductShowcase({
               "aspect-3/4 w-full object-cover",
               images[0].className
             ),
-            optixFlowConfig
+            optixFlowConfig,
+            loading: "eager"
           }
         ) }),
         images[1] && /* @__PURE__ */ jsx("div", { className: imgClassWrapper, children: /* @__PURE__ */ jsx(
@@ -660,7 +661,8 @@ function HeroEcommerceProductShowcase({
               "aspect-square w-full object-cover",
               images[1].className
             ),
-            optixFlowConfig
+            optixFlowConfig,
+            loading: "eager"
           }
         ) })
       ] }),
@@ -674,7 +676,8 @@ function HeroEcommerceProductShowcase({
               "aspect-square w-full object-cover",
               images[2].className
             ),
-            optixFlowConfig
+            optixFlowConfig,
+            loading: "eager"
           }
         ) }),
         images[3] && /* @__PURE__ */ jsx("div", { className: imgClassWrapper, children: /* @__PURE__ */ jsx(
@@ -686,7 +689,8 @@ function HeroEcommerceProductShowcase({
               "aspect-3/4 w-full object-cover",
               images[3].className
             ),
-            optixFlowConfig
+            optixFlowConfig,
+            loading: "eager"
           }
         ) })
       ] })

package/dist/hero-event-registration.cjs

@@ -725,7 +725,8 @@ function HeroEventRegistration({
               src: image.src,
               alt: image.alt,
               className: cn("aspect-square w-full object-cover", image.className),
-              optixFlowConfig
+              optixFlowConfig,
+              loading: "eager"
             }
           )
         }

package/dist/hero-event-registration.js

@@ -704,7 +704,8 @@ function HeroEventRegistration({
               src: image.src,
               alt: image.alt,
               className: cn("aspect-square w-full object-cover", image.className),
-              optixFlowConfig
+              optixFlowConfig,
+              loading: "eager"
             }
           )
         }

package/dist/hero-gradient-avatars-rating.cjs

@@ -657,7 +657,8 @@ function HeroGradientAvatarsRating({
                     "h-full w-full object-cover transition-transform duration-300 hover:scale-105",
                     images[0].className
                   ),
-                  optixFlowConfig
+                  optixFlowConfig,
+                  loading: "eager"
                 }
               )
             }
@@ -677,7 +678,8 @@ function HeroGradientAvatarsRating({
                     "h-full w-full object-cover transition-transform duration-300 hover:scale-105",
                     images[1].className
                   ),
-                  optixFlowConfig
+                  optixFlowConfig,
+                  loading: "eager"
                 }
               )
             }

package/dist/hero-gradient-avatars-rating.js

@@ -635,7 +635,8 @@ function HeroGradientAvatarsRating({
                     "h-full w-full object-cover transition-transform duration-300 hover:scale-105",
                     images[0].className
                   ),
-                  optixFlowConfig
+                  optixFlowConfig,
+                  loading: "eager"
                 }
               )
             }
@@ -655,7 +656,8 @@ function HeroGradientAvatarsRating({
                     "h-full w-full object-cover transition-transform duration-300 hover:scale-105",
                     images[1].className
                   ),
-                  optixFlowConfig
+                  optixFlowConfig,
+                  loading: "eager"
                 }
               )
             }

package/dist/hero-mental-health-team.cjs

@@ -488,7 +488,7 @@ function HeroMentalHealthTeam({
   pattern,
   patternOpacity,
   className,
-  spacing = "xl",
+  spacing = "hero",
   containerClassName = "px-6 sm:px-6 md:px-8 lg:px-8",
   headerClassName,
   headingClassName,
@@ -508,7 +508,8 @@ function HeroMentalHealthTeam({
             "block h-full w-full object-cover object-center",
             smallImages[0].className
           ),
-          optixFlowConfig
+          optixFlowConfig,
+          loading: "eager"
         }
       ) }) }),
       smallImages[1] && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "col-[2/3] row-[1/2] w-full md:col-[2/3] md:row-[1/2]", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-full max-h-77.5 w-full overflow-hidden rounded-2xl", children: /* @__PURE__ */ jsxRuntime.jsx(
@@ -520,7 +521,8 @@ function HeroMentalHealthTeam({
             "block h-full w-full object-cover object-center",
             smallImages[1].className
           ),
-          optixFlowConfig
+          optixFlowConfig,
+          loading: "eager"
         }
       ) }) })
     ] });
@@ -542,16 +544,17 @@ function HeroMentalHealthTeam({
               src: avatarSrc,
               alt: testimonial.avatar?.alt ?? "",
               className: "h-full w-full object-cover object-center",
-              optixFlowConfig
+              optixFlowConfig,
+              loading: "eager"
             }
           ) }),
-          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex h-full w-full flex-col justify-between gap-2 text-muted-foreground", children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex h-full w-full flex-col justify-between gap-2 opacity-70", children: [
             /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "text-lg font-medium", children: [
               '"',
               testimonial.quote,
               '"'
             ] }),
-            /* @__PURE__ */ jsxRuntime.jsx("p", { className: "", children: testimonial.author })
+            /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm", children: testimonial.author })
           ] })
         ]
       }
@@ -569,7 +572,8 @@ function HeroMentalHealthTeam({
           "block h-full w-full object-cover object-center",
           featureImage.className
         ),
-        optixFlowConfig
+        optixFlowConfig,
+        loading: "eager"
       }
     ) }) });
   }, [featureImageSlot, featureImage, optixFlowConfig]);
@@ -601,16 +605,7 @@ function HeroMentalHealthTeam({
                   ),
                   children: heading
                 }
-              ) : /* @__PURE__ */ jsxRuntime.jsx(
-                "h1",
-                {
-                  className: cn(
-                    "text-center text-4xl leading-tight font-medium sm:text-5xl md:text-6xl text-balance",
-                    headingClassName
-                  ),
-                  children: heading
-                }
-              )),
+              ) : heading),
               description && (typeof description === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
                 "p",
                 {
@@ -620,7 +615,7 @@ function HeroMentalHealthTeam({
                   ),
                   children: description
                 }
-              ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: descriptionClassName, children: description })),
+              ) : description),
               /* @__PURE__ */ jsxRuntime.jsx(
                 BlockActions,
                 {

package/dist/hero-mental-health-team.js

@@ -482,7 +482,7 @@ function HeroMentalHealthTeam({
   pattern,
   patternOpacity,
   className,
-  spacing = "xl",
+  spacing = "hero",
   containerClassName = "px-6 sm:px-6 md:px-8 lg:px-8",
   headerClassName,
   headingClassName,
@@ -502,7 +502,8 @@ function HeroMentalHealthTeam({
             "block h-full w-full object-cover object-center",
             smallImages[0].className
           ),
-          optixFlowConfig
+          optixFlowConfig,
+          loading: "eager"
         }
       ) }) }),
       smallImages[1] && /* @__PURE__ */ jsx("div", { className: "col-[2/3] row-[1/2] w-full md:col-[2/3] md:row-[1/2]", children: /* @__PURE__ */ jsx("div", { className: "h-full max-h-77.5 w-full overflow-hidden rounded-2xl", children: /* @__PURE__ */ jsx(
@@ -514,7 +515,8 @@ function HeroMentalHealthTeam({
             "block h-full w-full object-cover object-center",
             smallImages[1].className
           ),
-          optixFlowConfig
+          optixFlowConfig,
+          loading: "eager"
         }
       ) }) })
     ] });
@@ -536,16 +538,17 @@ function HeroMentalHealthTeam({
               src: avatarSrc,
               alt: testimonial.avatar?.alt ?? "",
               className: "h-full w-full object-cover object-center",
-              optixFlowConfig
+              optixFlowConfig,
+              loading: "eager"
             }
           ) }),
-          /* @__PURE__ */ jsxs("div", { className: "flex h-full w-full flex-col justify-between gap-2 text-muted-foreground", children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex h-full w-full flex-col justify-between gap-2 opacity-70", children: [
             /* @__PURE__ */ jsxs("p", { className: "text-lg font-medium", children: [
               '"',
               testimonial.quote,
               '"'
             ] }),
-            /* @__PURE__ */ jsx("p", { className: "", children: testimonial.author })
+            /* @__PURE__ */ jsx("p", { className: "text-sm", children: testimonial.author })
           ] })
         ]
       }
@@ -563,7 +566,8 @@ function HeroMentalHealthTeam({
           "block h-full w-full object-cover object-center",
           featureImage.className
         ),
-        optixFlowConfig
+        optixFlowConfig,
+        loading: "eager"
       }
     ) }) });
   }, [featureImageSlot, featureImage, optixFlowConfig]);
@@ -595,16 +599,7 @@ function HeroMentalHealthTeam({
                   ),
                   children: heading
                 }
-              ) : /* @__PURE__ */ jsx(
-                "h1",
-                {
-                  className: cn(
-                    "text-center text-4xl leading-tight font-medium sm:text-5xl md:text-6xl text-balance",
-                    headingClassName
-                  ),
-                  children: heading
-                }
-              )),
+              ) : heading),
               description && (typeof description === "string" ? /* @__PURE__ */ jsx(
                 "p",
                 {
@@ -614,7 +609,7 @@ function HeroMentalHealthTeam({
                   ),
                   children: description
                 }
-              ) : /* @__PURE__ */ jsx("div", { className: descriptionClassName, children: description })),
+              ) : description),
               /* @__PURE__ */ jsx(
                 BlockActions,
                 {

package/dist/hero-mentorship-video-split.cjs

@@ -590,7 +590,7 @@ function HeroMentorshipVideoSplit({
         {
           onClick: () => setIsVideoOpen(true),
           className: cn(
-            "group relative flex overflow-hidden rounded-lg p-0",
+            "group relative flex overflow-hidden rounded-lg p-0 cursor-pointer",
             videoAspectRatio === "vertical" ? "h-36 w-20" : "h-20 w-36"
           ),
           children: /* @__PURE__ */ jsxRuntime.jsxs(AspectRatio, { ratio: aspectRatio, className: "flex h-full w-full", children: [
@@ -606,14 +606,7 @@ function HeroMentorshipVideoSplit({
                 optixFlowConfig
               }
             ),
-            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "m-auto aspect-square z-10 bg-card text-card-foreground p-2 rounded-xl shadow-xl", children: /* @__PURE__ */ jsxRuntime.jsx(
-              DynamicIcon,
-              {
-                name: "lucide/play",
-                size: 24,
-                className: "transition-transform group-hover:scale-125"
-              }
-            ) })
+            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "m-auto aspect-square z-10 bg-card text-card-foreground p-2 rounded-xl ring-4 ring-card flex items-center justify-center opacity-80 hover:opacity-100 transition-all duration-500", children: /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/play", size: 24 }) })
           ] })
         }
       )
@@ -678,7 +671,7 @@ function HeroMentorshipVideoSplit({
                     "p",
                     {
                       className: cn(
-                        "text-lg font-medium md:text-xl",
+                        "text-lg font-normal md:text-xl text-pretty",
                         descriptionClassName
                       ),
                       children: description

package/dist/hero-mentorship-video-split.js

@@ -567,7 +567,7 @@ function HeroMentorshipVideoSplit({
         {
           onClick: () => setIsVideoOpen(true),
           className: cn(
-            "group relative flex overflow-hidden rounded-lg p-0",
+            "group relative flex overflow-hidden rounded-lg p-0 cursor-pointer",
             videoAspectRatio === "vertical" ? "h-36 w-20" : "h-20 w-36"
           ),
           children: /* @__PURE__ */ jsxs(AspectRatio, { ratio: aspectRatio, className: "flex h-full w-full", children: [
@@ -583,14 +583,7 @@ function HeroMentorshipVideoSplit({
                 optixFlowConfig
               }
             ),
-            /* @__PURE__ */ jsx("div", { className: "m-auto aspect-square z-10 bg-card text-card-foreground p-2 rounded-xl shadow-xl", children: /* @__PURE__ */ jsx(
-              DynamicIcon,
-              {
-                name: "lucide/play",
-                size: 24,
-                className: "transition-transform group-hover:scale-125"
-              }
-            ) })
+            /* @__PURE__ */ jsx("div", { className: "m-auto aspect-square z-10 bg-card text-card-foreground p-2 rounded-xl ring-4 ring-card flex items-center justify-center opacity-80 hover:opacity-100 transition-all duration-500", children: /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/play", size: 24 }) })
           ] })
         }
       )
@@ -655,7 +648,7 @@ function HeroMentorshipVideoSplit({
                     "p",
                     {
                       className: cn(
-                        "text-lg font-medium md:text-xl",
+                        "text-lg font-normal md:text-xl text-pretty",
                         descriptionClassName
                       ),
                       children: description

package/dist/hero-pattern-logo-tech-stack.cjs

@@ -417,6 +417,10 @@ function HeroPatternLogoTechStack({
   techLogosClassName,
   optixFlowConfig
 }) {
+  const logoOptixFlowConfig = React.useMemo(
+    () => optixFlowConfig ? { ...optixFlowConfig, objectFit: "contain" } : optixFlowConfig,
+    [optixFlowConfig]
+  );
   const renderLogo = React.useMemo(() => {
     if (logoSlot) return logoSlot;
     if (!logo) return null;
@@ -427,10 +431,10 @@ function HeroPatternLogoTechStack({
         src: logoSrc,
         alt: logo.alt,
         className: cn("h-16 w-auto object-contain", logo.imgClassName),
-        optixFlowConfig
+        optixFlowConfig: logoOptixFlowConfig
       }
     ) });
-  }, [logoSlot, logo, optixFlowConfig]);
+  }, [logoSlot, logo, logoOptixFlowConfig]);
   const renderActions = React.useMemo(() => {
     if (actionsSlot) return actionsSlot;
     if (!actions || actions.length === 0) return null;
@@ -487,7 +491,7 @@ function HeroPatternLogoTechStack({
               {
                 href: techLogo.href,
                 className: cn(
-                  "group flex w-auto h-12 md:h-10 items-center justify-center max-w-full md:max-w-30 max-h-12 md:max-h-10 min-h-12 md:min-h-10 p-2 md:p-1",
+                  "group flex shrink-0 items-center justify-center overflow-visible",
                   techLogo.className
                 ),
                 children: /* @__PURE__ */ jsxRuntime.jsx(
@@ -496,10 +500,10 @@ function HeroPatternLogoTechStack({
                     src: techLogoSrc,
                     alt: techLogo.alt,
                     className: cn(
-                      "h-full w-auto object-contain",
+                      "block h-6 max-h-6 w-auto max-w-none object-contain",
                       techLogo.imgClassName
                     ),
-                    optixFlowConfig
+                    optixFlowConfig: logoOptixFlowConfig
                   }
                 )
               },
@@ -514,7 +518,7 @@ function HeroPatternLogoTechStack({
     techLogos,
     techStackLabel,
     techLogosClassName,
-    optixFlowConfig
+    logoOptixFlowConfig
   ]);
   return /* @__PURE__ */ jsxRuntime.jsx(
     Section,

package/dist/hero-pattern-logo-tech-stack.js

@@ -411,6 +411,10 @@ function HeroPatternLogoTechStack({
   techLogosClassName,
   optixFlowConfig
 }) {
+  const logoOptixFlowConfig = useMemo(
+    () => optixFlowConfig ? { ...optixFlowConfig, objectFit: "contain" } : optixFlowConfig,
+    [optixFlowConfig]
+  );
   const renderLogo = useMemo(() => {
     if (logoSlot) return logoSlot;
     if (!logo) return null;
@@ -421,10 +425,10 @@ function HeroPatternLogoTechStack({
         src: logoSrc,
         alt: logo.alt,
         className: cn("h-16 w-auto object-contain", logo.imgClassName),
-        optixFlowConfig
+        optixFlowConfig: logoOptixFlowConfig
       }
     ) });
-  }, [logoSlot, logo, optixFlowConfig]);
+  }, [logoSlot, logo, logoOptixFlowConfig]);
   const renderActions = useMemo(() => {
     if (actionsSlot) return actionsSlot;
     if (!actions || actions.length === 0) return null;
@@ -481,7 +485,7 @@ function HeroPatternLogoTechStack({
               {
                 href: techLogo.href,
                 className: cn(
-                  "group flex w-auto h-12 md:h-10 items-center justify-center max-w-full md:max-w-30 max-h-12 md:max-h-10 min-h-12 md:min-h-10 p-2 md:p-1",
+                  "group flex shrink-0 items-center justify-center overflow-visible",
                   techLogo.className
                 ),
                 children: /* @__PURE__ */ jsx(
@@ -490,10 +494,10 @@ function HeroPatternLogoTechStack({
                     src: techLogoSrc,
                     alt: techLogo.alt,
                     className: cn(
-                      "h-full w-auto object-contain",
+                      "block h-6 max-h-6 w-auto max-w-none object-contain",
                       techLogo.imgClassName
                     ),
-                    optixFlowConfig
+                    optixFlowConfig: logoOptixFlowConfig
                   }
                 )
               },
@@ -508,7 +512,7 @@ function HeroPatternLogoTechStack({
     techLogos,
     techStackLabel,
     techLogosClassName,
-    optixFlowConfig
+    logoOptixFlowConfig
   ]);
   return /* @__PURE__ */ jsx(
     Section,

package/dist/hero-product-showcase-floating.cjs

@@ -670,7 +670,8 @@ function HeroProductShowcaseFloating({
             "size-8 rounded-full border-2 border-background object-cover",
             avatar.className
           ),
-          optixFlowConfig
+          optixFlowConfig,
+          loading: "eager"
         },
         idx
       )) }),
@@ -693,7 +694,8 @@ function HeroProductShowcaseFloating({
             "h-full w-full rounded-lg object-cover shadow-2xl",
             productImage.className
           ),
-          optixFlowConfig
+          optixFlowConfig,
+          loading: "eager"
         }
       ) }),
       renderFloatingStat,

package/dist/hero-product-showcase-floating.js

@@ -649,7 +649,8 @@ function HeroProductShowcaseFloating({
             "size-8 rounded-full border-2 border-background object-cover",
             avatar.className
           ),
-          optixFlowConfig
+          optixFlowConfig,
+          loading: "eager"
         },
         idx
       )) }),
@@ -672,7 +673,8 @@ function HeroProductShowcaseFloating({
             "h-full w-full rounded-lg object-cover shadow-2xl",
             productImage.className
           ),
-          optixFlowConfig
+          optixFlowConfig,
+          loading: "eager"
         }
       ) }),
       renderFloatingStat,

package/dist/hero-saas-dashboard-preview.cjs

@@ -651,7 +651,8 @@ function HeroSaasDashboardPreview({
                 src: browserPreview.image.src,
                 alt: browserPreview.image.alt,
                 className: cn("w-full", browserPreview.image.className),
-                optixFlowConfig
+                optixFlowConfig,
+                loading: "eager"
               }
             )
           ]

package/dist/hero-saas-dashboard-preview.js

@@ -630,7 +630,8 @@ function HeroSaasDashboardPreview({
                 src: browserPreview.image.src,
                 alt: browserPreview.image.alt,
                 className: cn("w-full", browserPreview.image.className),
-                optixFlowConfig
+                optixFlowConfig,
+                loading: "eager"
               }
             )
           ]

package/dist/hero-software-growth-video-dialog.cjs

@@ -690,7 +690,8 @@ function HeroSoftwareGrowthVideoDialog({
               "size-full object-cover object-center rounded-xl shadow-xl",
               showcaseImages[index].className
             ),
-            optixFlowConfig
+            optixFlowConfig,
+            loading: "eager"
           }
         ) }) }, index))
       }

package/dist/hero-software-growth-video-dialog.js

@@ -667,7 +667,8 @@ function HeroSoftwareGrowthVideoDialog({
               "size-full object-cover object-center rounded-xl shadow-xl",
               showcaseImages[index].className
             ),
-            optixFlowConfig
+            optixFlowConfig,
+            loading: "eager"
           }
         ) }) }, index))
       }