@opensite/ui 2.1.4 → 2.1.5

package/dist/registry.cjs

@@ -3644,7 +3644,7 @@ function AboutCultureTabs({
   ctaImages,
   ctaImagesSlot,
   className,
-  containerClassName,
+  containerClassName = "px-6 sm:px-6 md:px-8 lg:px-8",
   headerClassName,
   badgeClassName,
   headingClassName,
@@ -3656,45 +3656,33 @@ function AboutCultureTabs({
   actionsClassName,
   optixFlowConfig,
   background,
-  spacing,
+  spacing = "xl",
   pattern,
   patternOpacity
 }) {
   const resolvedAspects = aspects ?? [];
-  const [activeTab, setActiveTab] = React25__namespace.useState(resolvedAspects[0]?.id || "");
-  const actionsContent = React25.useMemo(() => {
-    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;
-      return /* @__PURE__ */ jsxRuntime.jsx(
-        Pressable,
-        {
-          asButton: true,
-          className: actionClassName,
-          ...pressableProps,
-          children: children ?? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-            icon,
-            label,
-            iconAfter
-          ] })
-        },
-        index
-      );
-    });
-  }, [actionsSlot, actions]);
+  const [activeTab, setActiveTab] = React25__namespace.useState(
+    resolvedAspects[0]?.id || ""
+  );
   const ctaImagesContent = React25.useMemo(() => {
     if (ctaImagesSlot) return ctaImagesSlot;
     if (!ctaImages || ctaImages.length === 0) return null;
-    return ctaImages.map((src, i) => /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative aspect-square overflow-hidden rounded-md", children: /* @__PURE__ */ jsxRuntime.jsx(
-      img.Img,
+    return ctaImages.map((src, i) => /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
       {
-        src,
-        alt: "Team culture",
-        className: "h-full w-full object-cover",
-        optixFlowConfig
-      }
-    ) }, i));
+        className: "relative aspect-square overflow-hidden rounded-md",
+        children: /* @__PURE__ */ jsxRuntime.jsx(
+          img.Img,
+          {
+            src,
+            alt: "Team culture",
+            className: "h-full w-full object-cover",
+            optixFlowConfig
+          }
+        )
+      },
+      i
+    ));
   }, [ctaImagesSlot, ctaImages, optixFlowConfig]);
   return /* @__PURE__ */ jsxRuntime.jsxs(
     Section,
@@ -3703,14 +3691,32 @@ function AboutCultureTabs({
       spacing,
       pattern,
       patternOpacity,
-      className: cn(className),
+      className,
       containerClassName,
       children: [
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("mx-auto mb-12 max-w-3xl space-y-4 text-center", headerClassName), children: [
-          badgeText && (typeof badgeText === "string" ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("inline-block rounded-lg bg-primary/10 px-3 py-1 text-sm", getAccentColor(background), badgeClassName), children: badgeText }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: badgeClassName, children: badgeText })),
-          heading && (typeof heading === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h2", { className: cn("text-3xl font-bold tracking-tight md:text-4xl", headingClassName), children: heading }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: headingClassName, children: heading })),
-          description && (typeof description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn(getTextColor(background, "muted"), descriptionClassName), children: description }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: descriptionClassName, children: description }))
-        ] }),
+        /* @__PURE__ */ jsxRuntime.jsxs(
+          "div",
+          {
+            className: cn(
+              "mx-auto mb-12 max-w-full md:max-w-md space-y-4 text-center flex flex-col items-center justify-center",
+              headerClassName
+            ),
+            children: [
+              badgeText && (typeof badgeText === "string" ? /* @__PURE__ */ jsxRuntime.jsx(Badge, { className: cn("px-3 py-1", badgeClassName), children: badgeText }) : badgeText),
+              heading && (typeof heading === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
+                "h2",
+                {
+                  className: cn(
+                    "text-3xl font-bold tracking-tight md:text-4xl text-pretty",
+                    headingClassName
+                  ),
+                  children: heading
+                }
+              ) : heading),
+              description && (typeof description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("text-balance", descriptionClassName), children: description }) : description)
+            ]
+          }
+        ),
         aspectsSlot ? aspectsSlot : resolvedAspects.length > 0 ? /* @__PURE__ */ jsxRuntime.jsxs(
           Tabs,
           {
@@ -3723,80 +3729,103 @@ function AboutCultureTabs({
                 TabsTrigger,
                 {
                   value: aspect.id,
-                  className: cn("px-3 py-2.5", `data-[state=active]:${getAccentColor(background)}`, "data-[state=active]:text-primary-foreground"),
+                  className: cn("px-3 py-2.5"),
                   children: aspect.title
                 },
                 aspect.id
               )) }) }),
-              resolvedAspects.map((aspect) => /* @__PURE__ */ jsxRuntime.jsxs(TabsContent, { value: aspect.id, className: "space-y-8", children: [
-                /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid gap-6 md:grid-cols-2", children: [
-                  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-4", children: [
-                    /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-2xl font-bold tracking-tight", children: aspect.title }),
-                    /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("leading-relaxed", getTextColor(background, "muted")), children: aspect.description })
-                  ] }),
-                  /* @__PURE__ */ jsxRuntime.jsx(Card, { className: "border-0 bg-gradient-to-br from-primary/5 to-primary/10 p-0", children: /* @__PURE__ */ jsxRuntime.jsxs(CardContent, { className: "space-y-4 p-6 pt-6", children: [
-                    /* @__PURE__ */ jsxRuntime.jsx(
-                      DynamicIcon,
-                      {
-                        name: "lucide/quote",
-                        size: 32,
-                        className: cn(getAccentColor(background), "opacity-40")
-                      }
-                    ),
-                    /* @__PURE__ */ jsxRuntime.jsxs("p", { className: cn("italic", getTextColor(background, "muted")), children: [
-                      '"',
-                      aspect.testimonial.quote,
-                      '"'
+              resolvedAspects.map((aspect) => /* @__PURE__ */ jsxRuntime.jsxs(
+                TabsContent,
+                {
+                  value: aspect.id,
+                  className: "space-y-8",
+                  children: [
+                    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid gap-6 md:grid-cols-2", children: [
+                      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-4", children: [
+                        /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-2xl font-bold tracking-tight", children: aspect.title }),
+                        /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("leading-relaxed"), children: aspect.description })
+                      ] }),
+                      /* @__PURE__ */ jsxRuntime.jsx(Card, { className: "border-0 p-0", children: /* @__PURE__ */ jsxRuntime.jsxs(CardContent, { className: "space-y-4 p-6 pt-6", children: [
+                        /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/quote", size: 32 }),
+                        /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "italic", children: [
+                          '"',
+                          aspect.testimonial.quote,
+                          '"'
+                        ] }),
+                        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3 pt-2", children: [
+                          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative h-10 w-10 overflow-hidden rounded-full", children: /* @__PURE__ */ jsxRuntime.jsx(
+                            img.Img,
+                            {
+                              src: aspect.testimonial.avatar,
+                              alt: aspect.testimonial.author,
+                              className: "h-full w-full object-cover",
+                              optixFlowConfig
+                            }
+                          ) }),
+                          /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+                            /* @__PURE__ */ jsxRuntime.jsx("h4", { className: "text-sm font-medium", children: aspect.testimonial.author }),
+                            /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs", children: aspect.testimonial.role })
+                          ] })
+                        ] })
+                      ] }) })
                     ] }),
-                    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3 pt-2", children: [
-                      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative h-10 w-10 overflow-hidden rounded-full", children: /* @__PURE__ */ jsxRuntime.jsx(
-                        img.Img,
-                        {
-                          src: aspect.testimonial.avatar,
-                          alt: aspect.testimonial.author,
-                          className: "h-full w-full object-cover",
-                          optixFlowConfig
-                        }
-                      ) }),
-                      /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
-                        /* @__PURE__ */ jsxRuntime.jsx("h4", { className: "text-sm font-medium", children: aspect.testimonial.author }),
-                        /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("text-xs", getTextColor(background, "muted")), children: aspect.testimonial.role })
-                      ] })
-                    ] })
-                  ] }) })
-                ] }),
-                /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-1 gap-4 md:grid-cols-3", children: aspect.images.map((image, idx) => /* @__PURE__ */ jsxRuntime.jsx(
-                  "div",
-                  {
-                    className: "relative aspect-[4/3] overflow-hidden rounded-lg",
-                    children: /* @__PURE__ */ jsxRuntime.jsx(
-                      img.Img,
+                    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-1 gap-4 md:grid-cols-3", children: aspect.images.map((image, idx) => /* @__PURE__ */ jsxRuntime.jsx(
+                      "div",
                       {
-                        src: image,
-                        alt: `${aspect.title} culture`,
-                        className: "h-full w-full transform object-cover transition-transform duration-500 hover:scale-105",
-                        optixFlowConfig
-                      }
-                    )
-                  },
-                  idx
-                )) })
-              ] }, aspect.id))
+                        className: "relative aspect-4/3 overflow-hidden rounded-lg",
+                        children: /* @__PURE__ */ jsxRuntime.jsx(
+                          img.Img,
+                          {
+                            src: image,
+                            alt: `${aspect.title} culture`,
+                            className: "h-full w-full transform object-cover transition-transform duration-500 hover:scale-105",
+                            optixFlowConfig
+                          }
+                        )
+                      },
+                      idx
+                    )) })
+                  ]
+                },
+                aspect.id
+              ))
             ]
           }
         ) : null,
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("relative mt-16 rounded-xl border bg-background p-8 md:p-12", ctaClassName), children: [
-          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid items-center gap-8 md:grid-cols-2", children: [
-            /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
-              ctaHeading && (typeof ctaHeading === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h3", { className: cn("mb-4 text-2xl font-bold", ctaHeadingClassName), children: ctaHeading }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("mb-4", ctaHeadingClassName), children: ctaHeading })),
-              ctaDescription && (typeof ctaDescription === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("mb-6", getTextColor(background, "muted"), ctaDescriptionClassName), children: ctaDescription }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("mb-6", ctaDescriptionClassName), children: ctaDescription })),
-              (actionsSlot || actions && actions.length > 0) && /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("flex gap-4", actionsClassName), children: actionsContent })
-            ] }),
-            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-3 gap-2", children: ctaImagesContent })
-          ] }),
-          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute -left-5 -top-5 h-10 w-10 rounded-full bg-primary/10" }),
-          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute -bottom-5 -right-5 h-10 w-10 rounded-full bg-primary/10" })
-        ] })
+        /* @__PURE__ */ jsxRuntime.jsxs(
+          "div",
+          {
+            className: cn(
+              "relative mt-16 rounded-xl border p-8 md:p-12",
+              ctaClassName
+            ),
+            children: [
+              /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid items-center gap-8 md:grid-cols-2", children: [
+                /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+                  ctaHeading && (typeof ctaHeading === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
+                    "h3",
+                    {
+                      className: cn("mb-4 text-2xl font-bold", ctaHeadingClassName),
+                      children: ctaHeading
+                    }
+                  ) : ctaHeading),
+                  ctaDescription && (typeof ctaDescription === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("mb-6", ctaDescriptionClassName), children: ctaDescription }) : ctaDescription),
+                  /* @__PURE__ */ jsxRuntime.jsx(
+                    BlockActions,
+                    {
+                      actions,
+                      actionsSlot,
+                      actionsClassName
+                    }
+                  )
+                ] }),
+                /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-3 gap-2", children: ctaImagesContent })
+              ] }),
+              /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute -left-5 -top-5 h-10 w-10 rounded-full bg-primary/10" }),
+              /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute -bottom-5 -right-5 h-10 w-10 rounded-full bg-primary/10" })
+            ]
+          }
+        )
       ]
     }
   );
@@ -60183,12 +60212,12 @@ function HeroPricingComparison({
   );
 }
 var DEFAULT_STYLE_RULES3 = {
-  formContainer: "",
+  formContainer: "mt-10 flex justify-center items-center w-full max-w-md flex-col gap-4 sm:flex-row",
   fieldsContainer: "",
   fieldClassName: "",
   formClassName: "",
-  successMessageClassName: "text-green-600 dark:text-green-400 mt-4 p-3 rounded-md bg-green-50 dark:bg-green-950/20",
-  errorMessageClassName: "text-red-600 dark:text-red-400 mt-4 p-3 rounded-md bg-red-50 dark:bg-red-950/20"
+  successMessageClassName: "text-primary-foreground mt-4 p-3 rounded-md bg-primary",
+  errorMessageClassName: "text-destructive-foreground mt-4 p-3 rounded-md bg-destructive"
 };
 var DEFAULT_FORM_FIELDS44 = [
   {
@@ -60219,7 +60248,6 @@ function HeroNewsletterMinimal({
   className,
   headingClassName,
   descriptionClassName,
-  formClassName,
   disclaimerClassName,
   statsClassName
 }) {
@@ -60298,7 +60326,14 @@ function HeroNewsletterMinimal({
       ),
       helperText && (typeof helperText === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("text-sm mt-2 text-center"), children: helperText }) : helperText)
     ] });
-  }, [formSlot, formEngineSetup, buttonAction, formFields, formStyleRules, helperText]);
+  }, [
+    formSlot,
+    formEngineSetup,
+    buttonAction,
+    formFields,
+    formStyleRules,
+    helperText
+  ]);
   return /* @__PURE__ */ jsxRuntime.jsx(
     Section,
     {
@@ -60330,16 +60365,7 @@ function HeroNewsletterMinimal({
             children: description
           }
         ) : description),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          "div",
-          {
-            className: cn(
-              "mt-10 flex w-full max-w-md flex-col gap-4 sm:flex-row",
-              formClassName
-            ),
-            children: renderForm
-          }
-        ),
+        renderForm,
         disclaimer && (typeof disclaimer === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("mt-4 text-sm", disclaimerClassName), children: disclaimer }) : disclaimer),
         (statsSlot || stats && stats.length > 0) && /* @__PURE__ */ jsxRuntime.jsx(
           "div",