@opensite/ui 2.8.6 → 2.8.8

package/dist/testimonials-scrolling-columns.js

@@ -20,6 +20,67 @@ var DynamicIcon = React.memo(function DynamicIcon2({
   return /* @__PURE__ */ jsx(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__ */ jsx(
+      "div",
+      {
+        className: cn("absolute inset-0", className),
+        style: { ...RADIAL_INTENSITY[intensity], ...style },
+        ...props
+      }
+    );
+  }
+  return /* @__PURE__ */ 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",
@@ -462,7 +523,7 @@ function TestimonialsScrollingColumns({
             motion.div,
             {
               className: cn(
-                "relative overflow-hidden rounded-lg bg-card shadow-sm",
+                "relative overflow-hidden rounded-2xl shadow-sm",
                 cardClassName
               ),
               variants: itemVariants,
@@ -477,35 +538,40 @@ function TestimonialsScrollingColumns({
                       optixFlowConfig
                     }
                   ),
-                  /* @__PURE__ */ jsx("div", { className: "absolute inset-0 bg-gradient-to-t from-foreground/70 via-foreground/40 to-transparent" })
+                  /* @__PURE__ */ jsx(GradientOverlay, {})
                 ] }),
-                /* @__PURE__ */ jsxs("div", { className: "absolute bottom-0 left-0 right-0 p-6 text-left text-background", children: [
-                  /* @__PURE__ */ jsx(
+                /* @__PURE__ */ jsxs("div", { className: "absolute bottom-0 left-0 right-0 p-6 text-left", children: [
+                  testimonial?.logoSrc ? /* @__PURE__ */ jsx(
+                    Img,
+                    {
+                      src: testimonial.logoSrc,
+                      alt: typeof testimonial.company === "string" ? `${testimonial.company} logo` : typeof testimonial.author === "string" ? `${testimonial.author} company logo` : "Company logo",
+                      className: cn(
+                        "flex justify-start items-start mb-6 max-h-10 max-w-32 object-contain md:max-h-10 md:max-w-48"
+                      ),
+                      optixFlowConfig
+                    }
+                  ) : /* @__PURE__ */ 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__ */ jsx(
                     "blockquote",
                     {
                       className: cn(
-                        "text-base font-medium leading-relaxed",
+                        "text-base font-base leading-relaxed",
                         quoteClassName
                       ),
                       children: testimonial.quote
                     }
-                  ) : /* @__PURE__ */ jsx("div", { className: quoteClassName, children: testimonial.quote })),
-                  /* @__PURE__ */ jsx("figcaption", { className: cn("mt-4", authorClassName), children: /* @__PURE__ */ jsxs("p", { className: "font-semibold", children: [
-                    "\u2014",
-                    " ",
-                    testimonial.author && (typeof testimonial.author === "string" ? testimonial.author : null),
-                    testimonial.role && (typeof testimonial.role === "string" ? /* @__PURE__ */ jsxs("span", { className: "ml-1 text-background/60", children: [
-                      ", ",
-                      testimonial.role
-                    ] }) : null)
+                  ) : testimonial.quote),
+                  /* @__PURE__ */ jsx("figcaption", { className: cn("mt-4", authorClassName), children: /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
+                    testimonial.author && (typeof testimonial.author === "string" ? /* @__PURE__ */ jsx("div", { className: "uppercase text-base font-semibold", children: testimonial.author }) : null),
+                    testimonial.role && (typeof testimonial.role === "string" ? /* @__PURE__ */ jsx("div", { className: "text-sm font-thin", children: testimonial.role }) : null)
                   ] }) })
                 ] })
               ]
@@ -538,19 +604,32 @@ function TestimonialsScrollingColumns({
         /* @__PURE__ */ 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__ */ 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__ */ jsx("div", { className: headingClassName, children: heading })),
-              description && (typeof description === "string" ? /* @__PURE__ */ jsx("p", { className: cn("mt-4 text-lg ", descriptionClassName), children: description }) : /* @__PURE__ */ jsx("div", { className: cn("mt-4", descriptionClassName), children: description }))
+              ) : heading),
+              description && (typeof description === "string" ? /* @__PURE__ */ jsx(
+                "p",
+                {
+                  className: cn(
+                    "text-base md:text-lg text-balance",
+                    descriptionClassName
+                  ),
+                  children: description
+                }
+              ) : description)
             ]
           }
         ),

package/dist/testimonials-simple-grid.cjs

@@ -936,7 +936,7 @@ function TestimonialsSimpleGrid({
                 "bg-card text-card-foreground",
                 "flex flex-col gap-6",
                 testimonial.linkConfig?.href ? "cursor-pointer hover:bg-black hover:text-white transition-all duration-500" : "",
-                "rounded-2xl py-6 shadow-xl group",
+                "rounded-2xl py-0 shadow-xl group",
                 "ring-4 ring-ring",
                 cardClassName
               ),
@@ -944,7 +944,7 @@ function TestimonialsSimpleGrid({
                 CardContent,
                 {
                   className: cn(
-                    "px-6 h-full flex flex-col-reverse items-stretch justify-between gap-12",
+                    "px-0 h-full flex flex-col-reverse items-stretch justify-between gap-12",
                     cardContentClassName
                   ),
                   children: [
@@ -956,7 +956,7 @@ function TestimonialsSimpleGrid({
                           authorClassName
                         ),
                         children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-4", children: [
-                          /* @__PURE__ */ jsxRuntime.jsxs(Avatar, { className: "relative flex shrink-0 overflow-hidden rounded-full size-12 ring-4 ring-primary shadow-lg", children: [
+                          /* @__PURE__ */ jsxRuntime.jsxs(Avatar, { className: "relative flex shrink-0 size-24 border-t-4 border-r-4 border-primary rounded-tr-xl rounded-tl-none rounded-br-none rounded-bl-none shadow-xl", children: [
                             /* @__PURE__ */ jsxRuntime.jsx(
                               AvatarImage,
                               {
@@ -966,11 +966,28 @@ function TestimonialsSimpleGrid({
                             ),
                             /* @__PURE__ */ jsxRuntime.jsx(AvatarFallback, { children: getInitials(authorName) })
                           ] }),
-                          /* @__PURE__ */ jsxRuntime.jsx("div", { children: testimonial.author && (typeof testimonial.author === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "font-medium leading-none", children: testimonial.author }) : testimonial.author) })
+                          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-1 pt-2 pr-6 pb-2", children: [
+                            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-0", children: [
+                              testimonial.author && (typeof testimonial.author === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-lg font-semibold leading-relaxed", children: testimonial.author }) : testimonial.author),
+                              testimonial.role && (typeof testimonial.role === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-base", children: testimonial.role }) : testimonial.role)
+                            ] }),
+                            testimonial.linkConfig?.href && /* @__PURE__ */ jsxRuntime.jsx(
+                              Pressable,
+                              {
+                                href: testimonial.linkConfig.href,
+                                className: cn(
+                                  "text-base  transition-all duration-300",
+                                  "underline underline-offset-4",
+                                  testimonial.linkConfig.className
+                                ),
+                                children: testimonial.linkConfig.label
+                              }
+                            )
+                          ] })
                         ] })
                       }
                     ),
-                    testimonial.quote && (typeof testimonial.quote === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm leading-relaxed", children: testimonial.quote }) : testimonial.quote)
+                    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "pt-6 md: pt-8 px-6 md:px-8", children: testimonial.quote && (typeof testimonial.quote === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm leading-relaxed", children: testimonial.quote }) : testimonial.quote) })
                   ]
                 }
               )

package/dist/testimonials-simple-grid.js

@@ -914,7 +914,7 @@ function TestimonialsSimpleGrid({
                 "bg-card text-card-foreground",
                 "flex flex-col gap-6",
                 testimonial.linkConfig?.href ? "cursor-pointer hover:bg-black hover:text-white transition-all duration-500" : "",
-                "rounded-2xl py-6 shadow-xl group",
+                "rounded-2xl py-0 shadow-xl group",
                 "ring-4 ring-ring",
                 cardClassName
               ),
@@ -922,7 +922,7 @@ function TestimonialsSimpleGrid({
                 CardContent,
                 {
                   className: cn(
-                    "px-6 h-full flex flex-col-reverse items-stretch justify-between gap-12",
+                    "px-0 h-full flex flex-col-reverse items-stretch justify-between gap-12",
                     cardContentClassName
                   ),
                   children: [
@@ -934,7 +934,7 @@ function TestimonialsSimpleGrid({
                           authorClassName
                         ),
                         children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-4", children: [
-                          /* @__PURE__ */ jsxs(Avatar, { className: "relative flex shrink-0 overflow-hidden rounded-full size-12 ring-4 ring-primary shadow-lg", children: [
+                          /* @__PURE__ */ jsxs(Avatar, { className: "relative flex shrink-0 size-24 border-t-4 border-r-4 border-primary rounded-tr-xl rounded-tl-none rounded-br-none rounded-bl-none shadow-xl", children: [
                             /* @__PURE__ */ jsx(
                               AvatarImage,
                               {
@@ -944,11 +944,28 @@ function TestimonialsSimpleGrid({
                             ),
                             /* @__PURE__ */ jsx(AvatarFallback, { children: getInitials(authorName) })
                           ] }),
-                          /* @__PURE__ */ jsx("div", { children: testimonial.author && (typeof testimonial.author === "string" ? /* @__PURE__ */ jsx("p", { className: "font-medium leading-none", children: testimonial.author }) : testimonial.author) })
+                          /* @__PURE__ */ jsxs("div", { className: "space-y-1 pt-2 pr-6 pb-2", children: [
+                            /* @__PURE__ */ jsxs("div", { className: "space-y-0", children: [
+                              testimonial.author && (typeof testimonial.author === "string" ? /* @__PURE__ */ jsx("p", { className: "text-lg font-semibold leading-relaxed", children: testimonial.author }) : testimonial.author),
+                              testimonial.role && (typeof testimonial.role === "string" ? /* @__PURE__ */ jsx("p", { className: "text-base", children: testimonial.role }) : testimonial.role)
+                            ] }),
+                            testimonial.linkConfig?.href && /* @__PURE__ */ jsx(
+                              Pressable,
+                              {
+                                href: testimonial.linkConfig.href,
+                                className: cn(
+                                  "text-base  transition-all duration-300",
+                                  "underline underline-offset-4",
+                                  testimonial.linkConfig.className
+                                ),
+                                children: testimonial.linkConfig.label
+                              }
+                            )
+                          ] })
                         ] })
                       }
                     ),
-                    testimonial.quote && (typeof testimonial.quote === "string" ? /* @__PURE__ */ jsx("p", { className: "text-sm leading-relaxed", children: testimonial.quote }) : testimonial.quote)
+                    /* @__PURE__ */ jsx("div", { className: "pt-6 md: pt-8 px-6 md:px-8", children: testimonial.quote && (typeof testimonial.quote === "string" ? /* @__PURE__ */ jsx("p", { className: "text-sm leading-relaxed", children: testimonial.quote }) : testimonial.quote) })
                   ]
                 }
               )

package/dist/testimonials-slider-minimal.cjs

@@ -989,7 +989,7 @@ function TestimonialsSliderMinimal({
               Avatar,
               {
                 className: cn(
-                  "relative flex shrink-0 overflow-hidden rounded-3xl ring-8 ring-primary shadow-xl size-24",
+                  "relative flex shrink-0 overflow-hidden rounded-full ring-4 ring-primary shadow-xl size-12",
                   avatarClassName
                 ),
                 children: [

package/dist/testimonials-slider-minimal.js

@@ -967,7 +967,7 @@ function TestimonialsSliderMinimal({
               Avatar,
               {
                 className: cn(
-                  "relative flex shrink-0 overflow-hidden rounded-3xl ring-8 ring-primary shadow-xl size-24",
+                  "relative flex shrink-0 overflow-hidden rounded-full ring-4 ring-primary shadow-xl size-12",
                   avatarClassName
                 ),
                 children: [