@opensite/ui 2.8.6 → 2.8.7

package/dist/testimonials-minimal-numbered.cjs

@@ -473,7 +473,8 @@ function TestimonialsMinimalNumbered({
   authorClassName,
   navigationClassName,
   background,
-  spacing,
+  spacing = "lg",
+  containerClassName = "px-6 sm:px-6 md:px-8 lg:px-8",
   pattern,
   patternOpacity
 }) {
@@ -531,14 +532,14 @@ function TestimonialsMinimalNumbered({
         "span",
         {
           className: cn(
-            "text-8xl font-light leading-none select-none transition-all duration-500 md:text-9xl",
+            "text-4xl md:text-8xl font-light leading-none select-none transition-all duration-500 md:text-9xl",
             numberClassName
           ),
           style: { fontFeatureSettings: '"tnum"' },
           children: String(active + 1).padStart(2, "0")
         }
       ),
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-1 pt-6", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-1 pt-0 md:pt-6", children: [
         current.quote && (typeof current.quote === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
           "blockquote",
           {
@@ -644,13 +645,13 @@ function TestimonialsMinimalNumbered({
                   String(testimonials.length).padStart(2, "0")
                 ] })
               ] }) }),
-              /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1", children: [
+              /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
                 /* @__PURE__ */ jsxRuntime.jsx(
                   "button",
                   {
                     onClick: handlePrev,
                     className: "rounded-full p-2 transition-all duration-300 ",
-                    children: /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/chevron-left", size: 20 })
+                    children: /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/chevron-left", size: 24 })
                   }
                 ),
                 /* @__PURE__ */ jsxRuntime.jsx(
@@ -658,7 +659,7 @@ function TestimonialsMinimalNumbered({
                   {
                     onClick: handleNext,
                     className: "rounded-full p-2  transition-all duration-300 ",
-                    children: /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/chevron-right", size: 20 })
+                    children: /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/chevron-right", size: 24 })
                   }
                 )
               ] })

package/dist/testimonials-minimal-numbered.d.cts

@@ -1,9 +1,9 @@
 import * as React from 'react';
-import { S as SectionBackground, s as SectionSpacing, t as PatternName } from './community-initiatives-B8KCpwXH.cjs';
-import { T as TestimonialItem } from './blocks-BtDAbw8d.cjs';
+import { S as SectionBackground, s as SectionSpacing, t as PatternName } from './community-initiatives-C3xYbyms.cjs';
+import { T as TestimonialItem } from './blocks-D1hqLk46.cjs';
 import 'react/jsx-runtime';
 import 'class-variance-authority';
-import './button-variants-8mtEHxev.cjs';
+import './button-variants-lRElsmTc.cjs';
 import 'class-variance-authority/types';
 import '@opensite/hooks/usePlatformFromUrl';
 
@@ -60,6 +60,10 @@ interface TestimonialsMinimalNumberedProps {
      * Pattern overlay opacity (0-1)
      */
     patternOpacity?: number;
+    /**
+     * Additional CSS classes for the container
+     */
+    containerClassName?: string;
 }
 /**
  * TestimonialsMinimalNumbered - A minimal testimonial slider featuring large numbered
@@ -86,6 +90,6 @@ interface TestimonialsMinimalNumberedProps {
  * />
  * ```
  */
-declare function TestimonialsMinimalNumbered({ testimonials, testimonialsSlot, autoPlayInterval, className, contentClassName, numberClassName, quoteClassName, authorClassName, navigationClassName, background, spacing, pattern, patternOpacity, }: TestimonialsMinimalNumberedProps): React.JSX.Element;
+declare function TestimonialsMinimalNumbered({ testimonials, testimonialsSlot, autoPlayInterval, className, contentClassName, numberClassName, quoteClassName, authorClassName, navigationClassName, background, spacing, containerClassName, pattern, patternOpacity, }: TestimonialsMinimalNumberedProps): React.JSX.Element;
 
 export { TestimonialsMinimalNumbered, type TestimonialsMinimalNumberedProps };

package/dist/testimonials-minimal-numbered.d.ts

@@ -1,9 +1,9 @@
 import * as React from 'react';
-import { S as SectionBackground, s as SectionSpacing, t as PatternName } from './community-initiatives-rTRuDt0r.js';
-import { T as TestimonialItem } from './blocks-BlWXj9GI.js';
+import { S as SectionBackground, s as SectionSpacing, t as PatternName } from './community-initiatives-o1TkNw2C.js';
+import { T as TestimonialItem } from './blocks-kcru1Ogu.js';
 import 'react/jsx-runtime';
 import 'class-variance-authority';
-import './button-variants-8mtEHxev.js';
+import './button-variants-lRElsmTc.js';
 import 'class-variance-authority/types';
 import '@opensite/hooks/usePlatformFromUrl';
 
@@ -60,6 +60,10 @@ interface TestimonialsMinimalNumberedProps {
      * Pattern overlay opacity (0-1)
      */
     patternOpacity?: number;
+    /**
+     * Additional CSS classes for the container
+     */
+    containerClassName?: string;
 }
 /**
  * TestimonialsMinimalNumbered - A minimal testimonial slider featuring large numbered
@@ -86,6 +90,6 @@ interface TestimonialsMinimalNumberedProps {
  * />
  * ```
  */
-declare function TestimonialsMinimalNumbered({ testimonials, testimonialsSlot, autoPlayInterval, className, contentClassName, numberClassName, quoteClassName, authorClassName, navigationClassName, background, spacing, pattern, patternOpacity, }: TestimonialsMinimalNumberedProps): React.JSX.Element;
+declare function TestimonialsMinimalNumbered({ testimonials, testimonialsSlot, autoPlayInterval, className, contentClassName, numberClassName, quoteClassName, authorClassName, navigationClassName, background, spacing, containerClassName, pattern, patternOpacity, }: TestimonialsMinimalNumberedProps): React.JSX.Element;
 
 export { TestimonialsMinimalNumbered, type TestimonialsMinimalNumberedProps };

package/dist/testimonials-minimal-numbered.js

@@ -451,7 +451,8 @@ function TestimonialsMinimalNumbered({
   authorClassName,
   navigationClassName,
   background,
-  spacing,
+  spacing = "lg",
+  containerClassName = "px-6 sm:px-6 md:px-8 lg:px-8",
   pattern,
   patternOpacity
 }) {
@@ -509,14 +510,14 @@ function TestimonialsMinimalNumbered({
         "span",
         {
           className: cn(
-            "text-8xl font-light leading-none select-none transition-all duration-500 md:text-9xl",
+            "text-4xl md:text-8xl font-light leading-none select-none transition-all duration-500 md:text-9xl",
             numberClassName
           ),
           style: { fontFeatureSettings: '"tnum"' },
           children: String(active + 1).padStart(2, "0")
         }
       ),
-      /* @__PURE__ */ jsxs("div", { className: "flex-1 pt-6", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex-1 pt-0 md:pt-6", children: [
         current.quote && (typeof current.quote === "string" ? /* @__PURE__ */ jsx(
           "blockquote",
           {
@@ -622,13 +623,13 @@ function TestimonialsMinimalNumbered({
                   String(testimonials.length).padStart(2, "0")
                 ] })
               ] }) }),
-              /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1", children: [
+              /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
                 /* @__PURE__ */ jsx(
                   "button",
                   {
                     onClick: handlePrev,
                     className: "rounded-full p-2 transition-all duration-300 ",
-                    children: /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/chevron-left", size: 20 })
+                    children: /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/chevron-left", size: 24 })
                   }
                 ),
                 /* @__PURE__ */ jsx(
@@ -636,7 +637,7 @@ function TestimonialsMinimalNumbered({
                   {
                     onClick: handleNext,
                     className: "rounded-full p-2  transition-all duration-300 ",
-                    children: /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/chevron-right", size: 20 })
+                    children: /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/chevron-right", size: 24 })
                   }
                 )
               ] })

package/dist/testimonials-parallax-number.cjs

@@ -945,10 +945,11 @@ function TestimonialsParallaxNumber({
             framerMotion.motion.div,
             {
               className: cn(
+                "opacity-15",
                 "pointer-events-none absolute -left-8 top-1/2 -translate-y-1/2 select-none text-[20rem] font-bold leading-none tracking-tighter ",
                 numberClassName
               ),
-              style: { x: numberX, y: numberY },
+              style: { x: numberX, y: numberY, opacity: 0.1 },
               children: /* @__PURE__ */ jsxRuntime.jsx(framerMotion.AnimatePresence, { mode: "wait", children: /* @__PURE__ */ jsxRuntime.jsx(
                 framerMotion.motion.span,
                 {
@@ -957,14 +958,14 @@ function TestimonialsParallaxNumber({
                   exit: { opacity: 0, scale: 1.1, filter: "blur(10px)" },
                   transition: { duration: 0.6, ease: [0.22, 1, 0.36, 1] },
                   className: "block",
-                  children: current.backgroundIcon ? /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: current.backgroundIcon }) : current.backgroundLabel != null ? current.backgroundLabel : null
+                  children: current.backgroundIcon ? /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: current.backgroundIcon, size: 320 }) : current.backgroundLabel != null ? current.backgroundLabel : null
                 },
                 activeIndex
               ) })
             }
           ),
           /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative flex", children: [
-            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-center justify-center border-r border-border/50 pr-16", children: [
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-center justify-center border-r-0 md:border-r border-border/50 pr-4 md:pr-16", children: [
               /* @__PURE__ */ jsxRuntime.jsxs(
                 framerMotion.motion.span,
                 {
@@ -990,7 +991,7 @@ function TestimonialsParallaxNumber({
                 }
               ) })
             ] }),
-            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-1 py-12 pl-16", children: [
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-1 py-6 md:py-12 pl-4 md:pl-16", children: [
               /* @__PURE__ */ jsxRuntime.jsx(framerMotion.AnimatePresence, { mode: "wait", children: /* @__PURE__ */ jsxRuntime.jsx(
                 framerMotion.motion.div,
                 {
@@ -1007,7 +1008,7 @@ function TestimonialsParallaxNumber({
                 framerMotion.motion.blockquote,
                 {
                   className: cn(
-                    "text-3xl font-light leading-[1.15] tracking-tight md:text-4xl lg:text-5xl",
+                    "text-2xl md:text-3xl font-light leading-[1.15] tracking-tight md:text-4xl lg:text-5xl",
                     quoteClassName
                   ),
                   initial: "hidden",
@@ -1042,7 +1043,7 @@ function TestimonialsParallaxNumber({
                 },
                 activeIndex
               ) }) }),
-              /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-end justify-between", children: [
+              /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-start md:items-end justify-between", children: [
                 /* @__PURE__ */ jsxRuntime.jsx(framerMotion.AnimatePresence, { mode: "wait", children: /* @__PURE__ */ jsxRuntime.jsx(
                   framerMotion.motion.div,
                   {
@@ -1074,7 +1075,10 @@ function TestimonialsParallaxNumber({
                 /* @__PURE__ */ jsxRuntime.jsxs(
                   "div",
                   {
-                    className: cn("flex items-center gap-4", navigationClassName),
+                    className: cn(
+                      "flex items-center gap-4 flex-col md:flex-row",
+                      navigationClassName
+                    ),
                     children: [
                       /* @__PURE__ */ jsxRuntime.jsx(
                         framerMotion.motion.button,

package/dist/testimonials-parallax-number.d.cts

@@ -1,9 +1,9 @@
 import * as React from 'react';
-import { S as SectionBackground, s as SectionSpacing, t as PatternName } from './community-initiatives-B8KCpwXH.cjs';
-import { T as TestimonialItem } from './blocks-BtDAbw8d.cjs';
+import { S as SectionBackground, s as SectionSpacing, t as PatternName } from './community-initiatives-C3xYbyms.cjs';
+import { T as TestimonialItem } from './blocks-D1hqLk46.cjs';
 import 'react/jsx-runtime';
 import 'class-variance-authority';
-import './button-variants-8mtEHxev.cjs';
+import './button-variants-lRElsmTc.cjs';
 import 'class-variance-authority/types';
 import '@opensite/hooks/usePlatformFromUrl';
 

package/dist/testimonials-parallax-number.d.ts

@@ -1,9 +1,9 @@
 import * as React from 'react';
-import { S as SectionBackground, s as SectionSpacing, t as PatternName } from './community-initiatives-rTRuDt0r.js';
-import { T as TestimonialItem } from './blocks-BlWXj9GI.js';
+import { S as SectionBackground, s as SectionSpacing, t as PatternName } from './community-initiatives-o1TkNw2C.js';
+import { T as TestimonialItem } from './blocks-kcru1Ogu.js';
 import 'react/jsx-runtime';
 import 'class-variance-authority';
-import './button-variants-8mtEHxev.js';
+import './button-variants-lRElsmTc.js';
 import 'class-variance-authority/types';
 import '@opensite/hooks/usePlatformFromUrl';
 

package/dist/testimonials-parallax-number.js

@@ -924,10 +924,11 @@ function TestimonialsParallaxNumber({
             motion.div,
             {
               className: cn(
+                "opacity-15",
                 "pointer-events-none absolute -left-8 top-1/2 -translate-y-1/2 select-none text-[20rem] font-bold leading-none tracking-tighter ",
                 numberClassName
               ),
-              style: { x: numberX, y: numberY },
+              style: { x: numberX, y: numberY, opacity: 0.1 },
               children: /* @__PURE__ */ jsx(AnimatePresence, { mode: "wait", children: /* @__PURE__ */ jsx(
                 motion.span,
                 {
@@ -936,14 +937,14 @@ function TestimonialsParallaxNumber({
                   exit: { opacity: 0, scale: 1.1, filter: "blur(10px)" },
                   transition: { duration: 0.6, ease: [0.22, 1, 0.36, 1] },
                   className: "block",
-                  children: current.backgroundIcon ? /* @__PURE__ */ jsx(DynamicIcon, { name: current.backgroundIcon }) : current.backgroundLabel != null ? current.backgroundLabel : null
+                  children: current.backgroundIcon ? /* @__PURE__ */ jsx(DynamicIcon, { name: current.backgroundIcon, size: 320 }) : current.backgroundLabel != null ? current.backgroundLabel : null
                 },
                 activeIndex
               ) })
             }
           ),
           /* @__PURE__ */ jsxs("div", { className: "relative flex", children: [
-            /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center justify-center border-r border-border/50 pr-16", children: [
+            /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center justify-center border-r-0 md:border-r border-border/50 pr-4 md:pr-16", children: [
               /* @__PURE__ */ jsxs(
                 motion.span,
                 {
@@ -969,7 +970,7 @@ function TestimonialsParallaxNumber({
                 }
               ) })
             ] }),
-            /* @__PURE__ */ jsxs("div", { className: "flex-1 py-12 pl-16", children: [
+            /* @__PURE__ */ jsxs("div", { className: "flex-1 py-6 md:py-12 pl-4 md:pl-16", children: [
               /* @__PURE__ */ jsx(AnimatePresence, { mode: "wait", children: /* @__PURE__ */ jsx(
                 motion.div,
                 {
@@ -986,7 +987,7 @@ function TestimonialsParallaxNumber({
                 motion.blockquote,
                 {
                   className: cn(
-                    "text-3xl font-light leading-[1.15] tracking-tight md:text-4xl lg:text-5xl",
+                    "text-2xl md:text-3xl font-light leading-[1.15] tracking-tight md:text-4xl lg:text-5xl",
                     quoteClassName
                   ),
                   initial: "hidden",
@@ -1021,7 +1022,7 @@ function TestimonialsParallaxNumber({
                 },
                 activeIndex
               ) }) }),
-              /* @__PURE__ */ jsxs("div", { className: "flex items-end justify-between", children: [
+              /* @__PURE__ */ jsxs("div", { className: "flex items-start md:items-end justify-between", children: [
                 /* @__PURE__ */ jsx(AnimatePresence, { mode: "wait", children: /* @__PURE__ */ jsx(
                   motion.div,
                   {
@@ -1053,7 +1054,10 @@ function TestimonialsParallaxNumber({
                 /* @__PURE__ */ jsxs(
                   "div",
                   {
-                    className: cn("flex items-center gap-4", navigationClassName),
+                    className: cn(
+                      "flex items-center gap-4 flex-col md:flex-row",
+                      navigationClassName
+                    ),
                     children: [
                       /* @__PURE__ */ jsx(
                         motion.button,

package/dist/testimonials-quote-carousel.d.cts

@@ -1,9 +1,9 @@
 import * as React from 'react';
-import { S as SectionBackground, s as SectionSpacing, t as PatternName } from './community-initiatives-B8KCpwXH.cjs';
-import { T as TestimonialItem } from './blocks-BtDAbw8d.cjs';
+import { S as SectionBackground, s as SectionSpacing, t as PatternName } from './community-initiatives-C3xYbyms.cjs';
+import { T as TestimonialItem } from './blocks-D1hqLk46.cjs';
 import 'react/jsx-runtime';
 import 'class-variance-authority';
-import './button-variants-8mtEHxev.cjs';
+import './button-variants-lRElsmTc.cjs';
 import 'class-variance-authority/types';
 import '@opensite/hooks/usePlatformFromUrl';
 

package/dist/testimonials-quote-carousel.d.ts

@@ -1,9 +1,9 @@
 import * as React from 'react';
-import { S as SectionBackground, s as SectionSpacing, t as PatternName } from './community-initiatives-rTRuDt0r.js';
-import { T as TestimonialItem } from './blocks-BlWXj9GI.js';
+import { S as SectionBackground, s as SectionSpacing, t as PatternName } from './community-initiatives-o1TkNw2C.js';
+import { T as TestimonialItem } from './blocks-kcru1Ogu.js';
 import 'react/jsx-runtime';
 import 'class-variance-authority';
-import './button-variants-8mtEHxev.js';
+import './button-variants-lRElsmTc.js';
 import 'class-variance-authority/types';
 import '@opensite/hooks/usePlatformFromUrl';
 

package/dist/testimonials-scrolling-columns.cjs

@@ -41,6 +41,67 @@ var DynamicIcon = React__namespace.memo(function DynamicIcon2({
   return /* @__PURE__ */ jsxRuntime.jsx(icon.Icon, { ...props, apiKey: apiKey ?? DEFAULT_ICON_API_KEY });
 });
 DynamicIcon.displayName = "DynamicIcon";
+var DIRECTION_STYLES = {
+  "bottom-to-top": "bg-linear-to-t",
+  "top-to-bottom": "bg-linear-to-b",
+  "left-to-right": "bg-linear-to-r",
+  "right-to-left": "bg-linear-to-l",
+  "bottom-left-to-top-right": "bg-linear-to-tr",
+  "bottom-right-to-top-left": "bg-linear-to-tl",
+  "top-left-to-bottom-right": "bg-linear-to-br",
+  "top-right-to-bottom-left": "bg-linear-to-bl"
+};
+var INTENSITY_STOPS = {
+  low: "from-black/40 via-black/20 to-transparent",
+  default: "from-black/70 via-black/35 to-transparent",
+  high: "from-black/85 via-black/50 to-transparent",
+  "very-high": "from-black/95 via-black/60 to-black/20"
+};
+var RADIAL_INTENSITY = {
+  low: {
+    background: "radial-gradient(ellipse at center, rgba(0,0,0,0.40) 0%, rgba(0,0,0,0.20) 50%, transparent 100%)"
+  },
+  default: {
+    background: "radial-gradient(ellipse at center, rgba(0,0,0,0.70) 0%, rgba(0,0,0,0.35) 50%, transparent 100%)"
+  },
+  high: {
+    background: "radial-gradient(ellipse at center, rgba(0,0,0,0.85) 0%, rgba(0,0,0,0.50) 50%, transparent 100%)"
+  },
+  "very-high": {
+    background: "radial-gradient(ellipse at center, rgba(0,0,0,0.95) 0%, rgba(0,0,0,0.60) 50%, rgba(0,0,0,0.20) 100%)"
+  }
+};
+function GradientOverlay({
+  direction = "bottom-to-top",
+  intensity = "default",
+  className,
+  style,
+  ...props
+}) {
+  if (direction === "radial-center") {
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        className: cn("absolute inset-0", className),
+        style: { ...RADIAL_INTENSITY[intensity], ...style },
+        ...props
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      className: cn(
+        "absolute inset-0",
+        DIRECTION_STYLES[direction],
+        INTENSITY_STOPS[intensity],
+        className
+      ),
+      style,
+      ...props
+    }
+  );
+}
 var maxWidthStyles = {
   sm: "max-w-screen-sm",
   md: "max-w-screen-md",
@@ -483,7 +544,7 @@ function TestimonialsScrollingColumns({
             framerMotion.motion.div,
             {
               className: cn(
-                "relative overflow-hidden rounded-lg bg-card shadow-sm",
+                "relative overflow-hidden rounded-2xl bg-card text-card-foreground shadow-sm",
                 cardClassName
               ),
               variants: itemVariants,
@@ -498,15 +559,25 @@ function TestimonialsScrollingColumns({
                       optixFlowConfig
                     }
                   ),
-                  /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute inset-0 bg-gradient-to-t from-foreground/70 via-foreground/40 to-transparent" })
+                  /* @__PURE__ */ jsxRuntime.jsx(GradientOverlay, {})
                 ] }),
-                /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "absolute bottom-0 left-0 right-0 p-6 text-left text-background", children: [
-                  /* @__PURE__ */ jsxRuntime.jsx(
+                /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "absolute bottom-0 left-0 right-0 p-6 text-left", children: [
+                  testimonial?.logoSrc ? /* @__PURE__ */ jsxRuntime.jsx(
+                    img.Img,
+                    {
+                      src: testimonial.logoSrc,
+                      alt: typeof testimonial.company === "string" ? `${testimonial.company} logo` : typeof testimonial.author === "string" ? `${testimonial.author} company logo` : "Company logo",
+                      className: cn(
+                        "mx-auto mb-6 max-h-12 max-w-32 object-contain md:max-h-16 md:max-w-48"
+                      ),
+                      optixFlowConfig
+                    }
+                  ) : /* @__PURE__ */ jsxRuntime.jsx(
                     DynamicIcon,
                     {
-                      name: "lucide/quote",
-                      size: 32,
-                      className: "mb-4 text-background/40"
+                      name: "mdi/comment-quote-outline",
+                      size: 42,
+                      className: cn("opacity-50")
                     }
                   ),
                   testimonial.quote && (typeof testimonial.quote === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
@@ -518,12 +589,12 @@ function TestimonialsScrollingColumns({
                       ),
                       children: testimonial.quote
                     }
-                  ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: quoteClassName, children: testimonial.quote })),
+                  ) : testimonial.quote),
                   /* @__PURE__ */ jsxRuntime.jsx("figcaption", { className: cn("mt-4", authorClassName), children: /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "font-semibold", children: [
                     "\u2014",
                     " ",
                     testimonial.author && (typeof testimonial.author === "string" ? testimonial.author : null),
-                    testimonial.role && (typeof testimonial.role === "string" ? /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "ml-1 text-background/60", children: [
+                    testimonial.role && (typeof testimonial.role === "string" ? /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "ml-1", children: [
                       ", ",
                       testimonial.role
                     ] }) : null)
@@ -559,19 +630,32 @@ function TestimonialsScrollingColumns({
         /* @__PURE__ */ jsxRuntime.jsxs(
           "div",
           {
-            className: cn("mx-auto mb-12 max-w-2xl text-center", headerClassName),
+            className: cn(
+              "mx-auto mb-12 max-w-full md:max-w-2xl space-y-4 text-center",
+              headerClassName
+            ),
             children: [
               heading && (typeof heading === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
                 "h2",
                 {
                   className: cn(
-                    "text-3xl font-semibold tracking-tight md:text-4xl",
+                    "text-pretty text-3xl md:text-4xl lg:text-6xl",
+                    "font-semibold tracking-tight",
                     headingClassName
                   ),
                   children: heading
                 }
-              ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: headingClassName, children: heading })),
-              description && (typeof description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("mt-4 text-lg ", descriptionClassName), children: description }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("mt-4", descriptionClassName), children: description }))
+              ) : heading),
+              description && (typeof description === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
+                "p",
+                {
+                  className: cn(
+                    "text-base text-base md:text-lg text-balance",
+                    descriptionClassName
+                  ),
+                  children: description
+                }
+              ) : description)
             ]
           }
         ),

package/dist/testimonials-scrolling-columns.d.cts

@@ -1,9 +1,9 @@
 import * as React from 'react';
-import { S as SectionBackground, s as SectionSpacing, t as PatternName } from './community-initiatives-B8KCpwXH.cjs';
-import { T as TestimonialItem, O as OptixFlowConfig } from './blocks-BtDAbw8d.cjs';
+import { S as SectionBackground, s as SectionSpacing, t as PatternName } from './community-initiatives-C3xYbyms.cjs';
+import { T as TestimonialItem, O as OptixFlowConfig } from './blocks-D1hqLk46.cjs';
 import 'react/jsx-runtime';
 import 'class-variance-authority';
-import './button-variants-8mtEHxev.cjs';
+import './button-variants-lRElsmTc.cjs';
 import 'class-variance-authority/types';
 import '@opensite/hooks/usePlatformFromUrl';
 

package/dist/testimonials-scrolling-columns.d.ts

@@ -1,9 +1,9 @@
 import * as React from 'react';
-import { S as SectionBackground, s as SectionSpacing, t as PatternName } from './community-initiatives-rTRuDt0r.js';
-import { T as TestimonialItem, O as OptixFlowConfig } from './blocks-BlWXj9GI.js';
+import { S as SectionBackground, s as SectionSpacing, t as PatternName } from './community-initiatives-o1TkNw2C.js';
+import { T as TestimonialItem, O as OptixFlowConfig } from './blocks-kcru1Ogu.js';
 import 'react/jsx-runtime';
 import 'class-variance-authority';
-import './button-variants-8mtEHxev.js';
+import './button-variants-lRElsmTc.js';
 import 'class-variance-authority/types';
 import '@opensite/hooks/usePlatformFromUrl';