@opensite/ui 1.8.2 → 1.8.4

package/dist/hero-stats-social-proof.cjs

@@ -7,6 +7,7 @@ var tailwindMerge = require('tailwind-merge');
 var classVarianceAuthority = require('class-variance-authority');
 var jsxRuntime = require('react/jsx-runtime');
 var img = require('@page-speed/img');
+var reactSlot = require('@radix-ui/react-slot');
 
 function _interopNamespace(e) {
   if (e && e.__esModule) return e;
@@ -32,66 +33,6 @@ var React__namespace = /*#__PURE__*/_interopNamespace(React);
 function cn(...inputs) {
   return tailwindMerge.twMerge(clsx.clsx(inputs));
 }
-function getNestedCardBg(parentBg, variant = "muted", options) {
-  const isDark = parentBg === "dark" || parentBg === "secondary" || parentBg === "primary";
-  if (isDark) {
-    switch (variant) {
-      case "muted":
-        return "bg-background";
-      case "card":
-        return "bg-card";
-      case "accent":
-        return "bg-accent";
-      case "subtle":
-        return "bg-background/50";
-    }
-  } else {
-    switch (variant) {
-      case "muted":
-        return "bg-muted";
-      case "card":
-        return "bg-card";
-      case "accent":
-        return "bg-accent";
-      case "subtle":
-        return "bg-muted/50";
-    }
-  }
-}
-function getNestedCardTextColor(parentBg, options) {
-  const isDark = parentBg === "dark" || parentBg === "secondary" || parentBg === "primary";
-  return isDark ? "text-foreground" : "";
-}
-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 getAccentColor(parentBg, options) {
-  const isDark = parentBg === "dark" || parentBg === "secondary" || parentBg === "primary";
-  return isDark ? "text-accent-foreground" : "text-primary";
-}
 function normalizePhoneNumber(input) {
   const trimmed = input.trim();
   if (trimmed.toLowerCase().startsWith("tel:")) {
@@ -885,6 +826,38 @@ var Section = React__namespace.default.forwardRef(
   }
 );
 Section.displayName = "Section";
+var badgeVariants = classVarianceAuthority.cva(
+  "inline-flex items-center justify-center rounded-full border px-2 py-0.5 text-xs font-medium w-fit whitespace-nowrap shrink-0 [&>svg]:size-3 gap-1 [&>svg]:pointer-events-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive transition-[color,box-shadow] overflow-hidden",
+  {
+    variants: {
+      variant: {
+        default: "border-transparent bg-primary text-primary-foreground [a&]:hover:bg-primary/90",
+        secondary: "border-transparent bg-secondary text-secondary-foreground [a&]:hover:bg-secondary/90",
+        destructive: "border-transparent bg-destructive text-white [a&]:hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60",
+        outline: "text-foreground [a&]:hover:bg-accent [a&]:hover:text-accent-foreground"
+      }
+    },
+    defaultVariants: {
+      variant: "default"
+    }
+  }
+);
+function Badge({
+  className,
+  variant,
+  asChild = false,
+  ...props
+}) {
+  const Comp = asChild ? reactSlot.Slot : "span";
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    Comp,
+    {
+      "data-slot": "badge",
+      className: cn(badgeVariants({ variant }), className),
+      ...props
+    }
+  );
+}
 function HeroStatsSocialProof({
   badge,
   badgeIcon,
@@ -895,15 +868,15 @@ function HeroStatsSocialProof({
   stats,
   statsSlot,
   imageSrc,
-  imageAlt = "Platform dashboard",
+  imageAlt,
   statusCard,
   statusCardSlot,
   background,
-  spacing,
+  spacing = "pt-28 pb-8 md:pt-32 md:pb-32",
   pattern,
   patternOpacity,
   className,
-  containerClassName,
+  containerClassName = "px-6 sm:px-6 md:px-8 lg:px-8",
   contentClassName,
   badgeClassName,
   headingClassName,
@@ -917,7 +890,14 @@ function HeroStatsSocialProof({
     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,
         {
@@ -939,23 +919,25 @@ function HeroStatsSocialProof({
     if (!stats || stats.length === 0) return null;
     return stats.map((stat, index) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: stat.className, children: [
       /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-3xl font-bold ", children: stat.value }),
-      stat.label && /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("text-sm", getTextColor(background, "muted")), children: stat.label })
+      stat.label && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-sm", children: stat.label })
     ] }, index));
   }, [statsSlot, stats]);
   const renderStatusCard = React.useMemo(() => {
     if (statusCardSlot) return statusCardSlot;
     if (!statusCard) return null;
-    return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn(
-      "absolute -bottom-6 -left-6 rounded-xl p-4 shadow-lg",
-      getNestedCardBg(background, "card"),
-      getNestedCardTextColor(background)
-    ), children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3", children: [
-      statusCard.icon && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex h-12 w-12 items-center justify-center rounded-full bg-success/10", children: statusCard.icon }),
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
-        statusCard.title && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "font-semibold ", children: statusCard.title }),
-        statusCard.subtitle && /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("text-sm", getTextColor(background, "muted")), children: statusCard.subtitle })
-      ] })
-    ] }) });
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        className: cn("absolute -bottom-6 -left-6 rounded-xl p-4 shadow-lg"),
+        children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3", children: [
+          statusCard.icon && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex h-12 w-12 items-center justify-center rounded-full bg-primary text-primary-foreground", children: statusCard.icon }),
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+            statusCard.title && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "font-semibold ", children: statusCard.title }),
+            statusCard.subtitle && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-sm", children: statusCard.subtitle })
+          ] })
+        ] })
+      }
+    );
   }, [statusCardSlot, statusCard]);
   return /* @__PURE__ */ jsxRuntime.jsx(
     Section,
@@ -964,28 +946,62 @@ function HeroStatsSocialProof({
       spacing,
       pattern,
       patternOpacity,
-      className: cn(className),
-      children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("container", containerClassName), children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid items-center gap-12 lg:grid-cols-2 lg:gap-20", children: [
+      className,
+      containerClassName,
+      children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid items-center gap-12 lg:grid-cols-2 lg:gap-20", children: [
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("flex flex-col gap-8", contentClassName), children: [
-          badge && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("inline-flex w-fit items-center gap-2 rounded-full px-4 py-2 text-sm font-medium", `${getAccentColor(background)}/10`, getAccentColor(background), badgeClassName), children: [
+          badge && /* @__PURE__ */ jsxRuntime.jsxs(Badge, { className: cn("px-4 py-2 text-sm", badgeClassName), children: [
             badgeIcon,
             typeof badge === "string" ? /* @__PURE__ */ jsxRuntime.jsx("span", { children: badge }) : badge
           ] }),
-          heading && (typeof heading === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h1", { className: cn("text-4xl font-bold tracking-tight md:text-5xl lg:text-6xl", headingClassName), children: heading }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: headingClassName, children: heading })),
-          description && (typeof description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("text-lg", 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("flex flex-col gap-4 sm:flex-row", actionsClassName), children: renderActions }),
-          (statsSlot || stats && stats.length > 0) && /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("grid grid-cols-3 gap-8 pt-8 border-t border-border", statsClassName), children: renderStats })
+          heading && (typeof heading === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
+            "h1",
+            {
+              className: cn(
+                "text-4xl font-bold tracking-tight md:text-5xl lg:text-6xl text-balance",
+                headingClassName
+              ),
+              children: heading
+            }
+          ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: headingClassName, children: heading })),
+          description && (typeof description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("text-lg text-balance", descriptionClassName), children: description }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: descriptionClassName, children: description })),
+          (actionsSlot || actions && actions.length > 0) && /* @__PURE__ */ jsxRuntime.jsx(
+            "div",
+            {
+              className: cn(
+                "flex flex-col gap-4 sm:flex-row",
+                actionsClassName
+              ),
+              children: renderActions
+            }
+          ),
+          (statsSlot || stats && stats.length > 0) && /* @__PURE__ */ jsxRuntime.jsx(
+            "div",
+            {
+              className: cn("grid grid-cols-3 gap-8 pt-8", statsClassName),
+              children: renderStats
+            }
+          )
         ] }),
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
-          imageSrc && /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("aspect-square overflow-hidden rounded-2xl", getNestedCardBg(background), imageClassName), children: /* @__PURE__ */ jsxRuntime.jsx(
-            img.Img,
+          imageSrc && /* @__PURE__ */ jsxRuntime.jsx(
+            "div",
             {
-              src: imageSrc,
-              alt: imageAlt,
-              className: "h-full w-full object-cover",
-              optixFlowConfig
+              className: cn(
+                "aspect-square overflow-hidden rounded-2xl shadow-2xl",
+                imageClassName
+              ),
+              children: /* @__PURE__ */ jsxRuntime.jsx(
+                img.Img,
+                {
+                  src: imageSrc,
+                  alt: imageAlt,
+                  className: "h-full w-full object-cover",
+                  optixFlowConfig
+                }
+              )
             }
-          ) }),
+          ),
           renderStatusCard
         ] })
       ] }) })

package/dist/hero-stats-social-proof.js

@@ -6,71 +6,12 @@ import { twMerge } from 'tailwind-merge';
 import { cva } from 'class-variance-authority';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { Img } from '@page-speed/img';
+import { Slot } from '@radix-ui/react-slot';
 
 // components/blocks/hero/hero-stats-social-proof.tsx
 function cn(...inputs) {
   return twMerge(clsx(inputs));
 }
-function getNestedCardBg(parentBg, variant = "muted", options) {
-  const isDark = parentBg === "dark" || parentBg === "secondary" || parentBg === "primary";
-  if (isDark) {
-    switch (variant) {
-      case "muted":
-        return "bg-background";
-      case "card":
-        return "bg-card";
-      case "accent":
-        return "bg-accent";
-      case "subtle":
-        return "bg-background/50";
-    }
-  } else {
-    switch (variant) {
-      case "muted":
-        return "bg-muted";
-      case "card":
-        return "bg-card";
-      case "accent":
-        return "bg-accent";
-      case "subtle":
-        return "bg-muted/50";
-    }
-  }
-}
-function getNestedCardTextColor(parentBg, options) {
-  const isDark = parentBg === "dark" || parentBg === "secondary" || parentBg === "primary";
-  return isDark ? "text-foreground" : "";
-}
-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 getAccentColor(parentBg, options) {
-  const isDark = parentBg === "dark" || parentBg === "secondary" || parentBg === "primary";
-  return isDark ? "text-accent-foreground" : "text-primary";
-}
 function normalizePhoneNumber(input) {
   const trimmed = input.trim();
   if (trimmed.toLowerCase().startsWith("tel:")) {
@@ -864,6 +805,38 @@ var Section = React__default.forwardRef(
   }
 );
 Section.displayName = "Section";
+var badgeVariants = cva(
+  "inline-flex items-center justify-center rounded-full border px-2 py-0.5 text-xs font-medium w-fit whitespace-nowrap shrink-0 [&>svg]:size-3 gap-1 [&>svg]:pointer-events-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive transition-[color,box-shadow] overflow-hidden",
+  {
+    variants: {
+      variant: {
+        default: "border-transparent bg-primary text-primary-foreground [a&]:hover:bg-primary/90",
+        secondary: "border-transparent bg-secondary text-secondary-foreground [a&]:hover:bg-secondary/90",
+        destructive: "border-transparent bg-destructive text-white [a&]:hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60",
+        outline: "text-foreground [a&]:hover:bg-accent [a&]:hover:text-accent-foreground"
+      }
+    },
+    defaultVariants: {
+      variant: "default"
+    }
+  }
+);
+function Badge({
+  className,
+  variant,
+  asChild = false,
+  ...props
+}) {
+  const Comp = asChild ? Slot : "span";
+  return /* @__PURE__ */ jsx(
+    Comp,
+    {
+      "data-slot": "badge",
+      className: cn(badgeVariants({ variant }), className),
+      ...props
+    }
+  );
+}
 function HeroStatsSocialProof({
   badge,
   badgeIcon,
@@ -874,15 +847,15 @@ function HeroStatsSocialProof({
   stats,
   statsSlot,
   imageSrc,
-  imageAlt = "Platform dashboard",
+  imageAlt,
   statusCard,
   statusCardSlot,
   background,
-  spacing,
+  spacing = "pt-28 pb-8 md:pt-32 md:pb-32",
   pattern,
   patternOpacity,
   className,
-  containerClassName,
+  containerClassName = "px-6 sm:px-6 md:px-8 lg:px-8",
   contentClassName,
   badgeClassName,
   headingClassName,
@@ -896,7 +869,14 @@ function HeroStatsSocialProof({
     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,
         {
@@ -918,23 +898,25 @@ function HeroStatsSocialProof({
     if (!stats || stats.length === 0) return null;
     return stats.map((stat, index) => /* @__PURE__ */ jsxs("div", { className: stat.className, children: [
       /* @__PURE__ */ jsx("div", { className: "text-3xl font-bold ", children: stat.value }),
-      stat.label && /* @__PURE__ */ jsx("div", { className: cn("text-sm", getTextColor(background, "muted")), children: stat.label })
+      stat.label && /* @__PURE__ */ jsx("div", { className: "text-sm", children: stat.label })
     ] }, index));
   }, [statsSlot, stats]);
   const renderStatusCard = useMemo(() => {
     if (statusCardSlot) return statusCardSlot;
     if (!statusCard) return null;
-    return /* @__PURE__ */ jsx("div", { className: cn(
-      "absolute -bottom-6 -left-6 rounded-xl p-4 shadow-lg",
-      getNestedCardBg(background, "card"),
-      getNestedCardTextColor(background)
-    ), children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
-      statusCard.icon && /* @__PURE__ */ jsx("div", { className: "flex h-12 w-12 items-center justify-center rounded-full bg-success/10", children: statusCard.icon }),
-      /* @__PURE__ */ jsxs("div", { children: [
-        statusCard.title && /* @__PURE__ */ jsx("div", { className: "font-semibold ", children: statusCard.title }),
-        statusCard.subtitle && /* @__PURE__ */ jsx("div", { className: cn("text-sm", getTextColor(background, "muted")), children: statusCard.subtitle })
-      ] })
-    ] }) });
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: cn("absolute -bottom-6 -left-6 rounded-xl p-4 shadow-lg"),
+        children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
+          statusCard.icon && /* @__PURE__ */ jsx("div", { className: "flex h-12 w-12 items-center justify-center rounded-full bg-primary text-primary-foreground", children: statusCard.icon }),
+          /* @__PURE__ */ jsxs("div", { children: [
+            statusCard.title && /* @__PURE__ */ jsx("div", { className: "font-semibold ", children: statusCard.title }),
+            statusCard.subtitle && /* @__PURE__ */ jsx("div", { className: "text-sm", children: statusCard.subtitle })
+          ] })
+        ] })
+      }
+    );
   }, [statusCardSlot, statusCard]);
   return /* @__PURE__ */ jsx(
     Section,
@@ -943,28 +925,62 @@ function HeroStatsSocialProof({
       spacing,
       pattern,
       patternOpacity,
-      className: cn(className),
-      children: /* @__PURE__ */ jsx("div", { className: cn("container", containerClassName), children: /* @__PURE__ */ jsxs("div", { className: "grid items-center gap-12 lg:grid-cols-2 lg:gap-20", children: [
+      className,
+      containerClassName,
+      children: /* @__PURE__ */ jsx("div", { className: "relative", children: /* @__PURE__ */ jsxs("div", { className: "grid items-center gap-12 lg:grid-cols-2 lg:gap-20", children: [
         /* @__PURE__ */ jsxs("div", { className: cn("flex flex-col gap-8", contentClassName), children: [
-          badge && /* @__PURE__ */ jsxs("div", { className: cn("inline-flex w-fit items-center gap-2 rounded-full px-4 py-2 text-sm font-medium", `${getAccentColor(background)}/10`, getAccentColor(background), badgeClassName), children: [
+          badge && /* @__PURE__ */ jsxs(Badge, { className: cn("px-4 py-2 text-sm", badgeClassName), children: [
             badgeIcon,
             typeof badge === "string" ? /* @__PURE__ */ jsx("span", { children: badge }) : badge
           ] }),
-          heading && (typeof heading === "string" ? /* @__PURE__ */ jsx("h1", { className: cn("text-4xl font-bold tracking-tight md:text-5xl lg:text-6xl", headingClassName), children: heading }) : /* @__PURE__ */ jsx("div", { className: headingClassName, children: heading })),
-          description && (typeof description === "string" ? /* @__PURE__ */ jsx("p", { className: cn("text-lg", getTextColor(background, "muted"), descriptionClassName), children: description }) : /* @__PURE__ */ jsx("div", { className: descriptionClassName, children: description })),
-          (actionsSlot || actions && actions.length > 0) && /* @__PURE__ */ jsx("div", { className: cn("flex flex-col gap-4 sm:flex-row", actionsClassName), children: renderActions }),
-          (statsSlot || stats && stats.length > 0) && /* @__PURE__ */ jsx("div", { className: cn("grid grid-cols-3 gap-8 pt-8 border-t border-border", statsClassName), children: renderStats })
+          heading && (typeof heading === "string" ? /* @__PURE__ */ jsx(
+            "h1",
+            {
+              className: cn(
+                "text-4xl font-bold tracking-tight md:text-5xl lg:text-6xl text-balance",
+                headingClassName
+              ),
+              children: heading
+            }
+          ) : /* @__PURE__ */ jsx("div", { className: headingClassName, children: heading })),
+          description && (typeof description === "string" ? /* @__PURE__ */ jsx("p", { className: cn("text-lg text-balance", descriptionClassName), children: description }) : /* @__PURE__ */ jsx("div", { className: descriptionClassName, children: description })),
+          (actionsSlot || actions && actions.length > 0) && /* @__PURE__ */ jsx(
+            "div",
+            {
+              className: cn(
+                "flex flex-col gap-4 sm:flex-row",
+                actionsClassName
+              ),
+              children: renderActions
+            }
+          ),
+          (statsSlot || stats && stats.length > 0) && /* @__PURE__ */ jsx(
+            "div",
+            {
+              className: cn("grid grid-cols-3 gap-8 pt-8", statsClassName),
+              children: renderStats
+            }
+          )
         ] }),
         /* @__PURE__ */ jsxs("div", { className: "relative", children: [
-          imageSrc && /* @__PURE__ */ jsx("div", { className: cn("aspect-square overflow-hidden rounded-2xl", getNestedCardBg(background), imageClassName), children: /* @__PURE__ */ jsx(
-            Img,
+          imageSrc && /* @__PURE__ */ jsx(
+            "div",
             {
-              src: imageSrc,
-              alt: imageAlt,
-              className: "h-full w-full object-cover",
-              optixFlowConfig
+              className: cn(
+                "aspect-square overflow-hidden rounded-2xl shadow-2xl",
+                imageClassName
+              ),
+              children: /* @__PURE__ */ jsx(
+                Img,
+                {
+                  src: imageSrc,
+                  alt: imageAlt,
+                  className: "h-full w-full object-cover",
+                  optixFlowConfig
+                }
+              )
             }
-          ) }),
+          ),
           renderStatusCard
         ] })
       ] }) })

package/dist/hero-testimonial-image-grid.cjs

@@ -889,7 +889,7 @@ function HeroTestimonialImageGrid({
   gridImages,
   imagesSlot,
   background,
-  spacing = "py-32 md:py-32",
+  spacing = "pt-28 pb-8 md:pt-32 md:pb-32",
   pattern,
   patternOpacity,
   className,

package/dist/hero-testimonial-image-grid.js

@@ -866,7 +866,7 @@ function HeroTestimonialImageGrid({
   gridImages,
   imagesSlot,
   background,
-  spacing = "py-32 md:py-32",
+  spacing = "pt-28 pb-8 md:pt-32 md:pb-32",
   pattern,
   patternOpacity,
   className,

package/dist/hero-therapy-testimonial-grid.cjs

@@ -889,7 +889,7 @@ function HeroTherapyTestimonialGrid({
           optixFlowConfig
         }
       ) }),
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex h-full w-full flex-col gap-2 justify-center", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex h-full w-full flex-col gap-2 justify-start", children: [
         /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "text-lg font-medium ", children: [
           '"',
           testimonial.quote,

package/dist/hero-therapy-testimonial-grid.js

@@ -868,7 +868,7 @@ function HeroTherapyTestimonialGrid({
           optixFlowConfig
         }
       ) }),
-      /* @__PURE__ */ jsxs("div", { className: "flex h-full w-full flex-col gap-2 justify-center", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex h-full w-full flex-col gap-2 justify-start", children: [
         /* @__PURE__ */ jsxs("p", { className: "text-lg font-medium ", children: [
           '"',
           testimonial.quote,