@opensite/ui 2.1.3 → 2.1.4

package/dist/hero-mobile-app-download.d.cts

@@ -1,9 +1,9 @@
 import * as React from 'react';
-import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-r_NhxVet.cjs';
-import { A as ActionConfig, I as ImageItem, O as OptixFlowConfig } from './blocks-DP3Vofl4.cjs';
+import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-CPyEa7IX.cjs';
+import { A as ActionConfig, I as ImageItem, O as OptixFlowConfig } from './blocks-tmd_MRJv.cjs';
 import 'react/jsx-runtime';
 import 'class-variance-authority';
-import './button-variants-CdNtNOuP.cjs';
+import './button-variants-8mtEHxev.cjs';
 import 'class-variance-authority/types';
 
 interface AppStoreAction extends ActionConfig {

package/dist/hero-mobile-app-download.d.ts

@@ -1,9 +1,9 @@
 import * as React from 'react';
-import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-DmVsuoHE.js';
-import { A as ActionConfig, I as ImageItem, O as OptixFlowConfig } from './blocks-XLPGq8A5.js';
+import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-hxnFe3w6.js';
+import { A as ActionConfig, I as ImageItem, O as OptixFlowConfig } from './blocks-DRE-f6cS.js';
 import 'react/jsx-runtime';
 import 'class-variance-authority';
-import './button-variants-CdNtNOuP.js';
+import './button-variants-8mtEHxev.js';
 import 'class-variance-authority/types';
 
 interface AppStoreAction extends ActionConfig {

package/dist/hero-newsletter-minimal.cjs

@@ -406,6 +406,14 @@ var Section = React3__namespace.default.forwardRef(
   }
 );
 Section.displayName = "Section";
+var DEFAULT_STYLE_RULES = {
+  formContainer: "",
+  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"
+};
 var DEFAULT_FORM_FIELDS = [
   {
     name: "email",
@@ -419,12 +427,7 @@ var DEFAULT_FORM_FIELDS = [
 function HeroNewsletterMinimal({
   heading,
   description,
-  formFields = DEFAULT_FORM_FIELDS,
-  formConfig,
-  onSubmit,
-  onSuccess,
-  onError,
-  successMessage,
+  formEngineSetup,
   buttonAction,
   helperText,
   formSlot,
@@ -433,7 +436,7 @@ function HeroNewsletterMinimal({
   patternClassName,
   statsSlot,
   background,
-  containerClassName = "px-6 sm:px-6 md:px-8 lg:px-8",
+  containerClassName = "pmx-auto w-full max-w-7xl relative z-10 px-6 sm:px-6 md:px-8 lg:px-8 flex flex-col items-center justify-center",
   spacing = "xl",
   pattern,
   patternOpacity,
@@ -444,14 +447,23 @@ function HeroNewsletterMinimal({
   disclaimerClassName,
   statsClassName
 }) {
-  const {
-    uploadTokens,
-    uploadProgress,
-    isUploading,
-    uploadFiles,
-    removeFile,
-    resetUpload
-  } = integration.useFileUpload({ onError });
+  const formStyleRules = React3__namespace.useMemo(() => {
+    return {
+      formContainer: formEngineSetup?.formLayoutSettings?.styleRules?.formContainer ?? DEFAULT_STYLE_RULES.formContainer,
+      fieldsContainer: formEngineSetup?.formLayoutSettings?.styleRules?.fieldsContainer ?? DEFAULT_STYLE_RULES.fieldsContainer,
+      fieldClassName: formEngineSetup?.formLayoutSettings?.styleRules?.fieldClassName ?? DEFAULT_STYLE_RULES.fieldClassName,
+      formClassName: formEngineSetup?.formLayoutSettings?.styleRules?.formClassName ?? DEFAULT_STYLE_RULES.formClassName,
+      successMessageClassName: formEngineSetup?.formLayoutSettings?.styleRules?.successMessageClassName ?? DEFAULT_STYLE_RULES.successMessageClassName,
+      errorMessageClassName: formEngineSetup?.formLayoutSettings?.styleRules?.errorMessageClassName ?? DEFAULT_STYLE_RULES.errorMessageClassName
+    };
+  }, [formEngineSetup?.formLayoutSettings?.styleRules]);
+  const formFields = React3__namespace.useMemo(() => {
+    if (formEngineSetup && formEngineSetup?.fields && formEngineSetup?.fields?.length > 0) {
+      return formEngineSetup.fields;
+    } else {
+      return DEFAULT_FORM_FIELDS;
+    }
+  }, [formEngineSetup?.fields]);
   const renderStats = React3__namespace.useMemo(() => {
     if (statsSlot) return statsSlot;
     if (!stats || stats.length === 0) return null;
@@ -480,6 +492,7 @@ function HeroNewsletterMinimal({
   }, [statsSlot, stats]);
   const renderForm = React3__namespace.useMemo(() => {
     if (formSlot) return formSlot;
+    if (!formEngineSetup) return null;
     const defaultButtonAction = {
       label: "Subscribe",
       variant: "default"
@@ -489,52 +502,27 @@ function HeroNewsletterMinimal({
       /* @__PURE__ */ jsxRuntime.jsx(
         integration.FormEngine,
         {
-          api: formConfig,
-          fields: formFields,
+          ...formEngineSetup,
           formLayoutSettings: {
+            ...formEngineSetup.formLayoutSettings,
             formLayout: "button-group",
             buttonGroupSetup: {
+              ...formEngineSetup.formLayoutSettings?.buttonGroupSetup,
               size: "lg",
               submitLabel: /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
                 action.label,
                 action.iconAfter
               ] }),
               submitVariant: action.variant || "default"
-            }
+            },
+            styleRules: formStyleRules
           },
-          successMessage,
-          onSubmit,
-          onSuccess: (data) => {
-            resetUpload();
-            onSuccess?.(data);
-          },
-          onError,
-          uploadTokens,
-          uploadProgress,
-          onFileUpload: uploadFiles,
-          onFileRemove: removeFile,
-          isUploading
+          fields: formFields
         }
       ),
       helperText && (typeof helperText === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("text-sm mt-2 text-center"), children: helperText }) : helperText)
     ] });
-  }, [
-    formSlot,
-    formFields,
-    formConfig,
-    buttonAction,
-    uploadTokens,
-    uploadProgress,
-    uploadFiles,
-    removeFile,
-    isUploading,
-    successMessage,
-    onSubmit,
-    onSuccess,
-    onError,
-    helperText,
-    resetUpload
-  ]);
+  }, [formSlot, formEngineSetup, buttonAction, formFields, formStyleRules, helperText]);
   return /* @__PURE__ */ jsxRuntime.jsx(
     Section,
     {
@@ -545,58 +533,49 @@ function HeroNewsletterMinimal({
       patternClassName,
       className,
       containerClassName,
-      children: /* @__PURE__ */ jsxRuntime.jsxs(
-        "div",
-        {
-          className: cn(
-            "container flex flex-col items-center justify-center text-center",
-            containerClassName
-          ),
-          children: [
-            heading && (typeof heading === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
-              "h1",
-              {
-                className: cn(
-                  "max-w-3xl text-5xl font-bold tracking-tight md:text-6xl lg:text-7xl text-pretty",
-                  headingClassName
-                ),
-                children: heading
-              }
-            ) : heading),
-            description && (typeof description === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
-              "p",
-              {
-                className: cn(
-                  "mt-6 max-w-full md:max-w-lg text-lg md:text-xl text-balance",
-                  descriptionClassName
-                ),
-                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
-              }
+      children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-center justify-center", children: [
+        heading && (typeof heading === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
+          "h1",
+          {
+            className: cn(
+              "max-w-3xl text-5xl font-bold tracking-tight md:text-6xl lg:text-7xl text-pretty text-center",
+              headingClassName
             ),
-            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",
-              {
-                className: cn(
-                  "mt-16 flex flex-wrap items-center justify-center gap-8 md:gap-12",
-                  statsClassName
-                ),
-                children: renderStats
-              }
-            )
-          ]
-        }
-      )
+            children: heading
+          }
+        ) : heading),
+        description && (typeof description === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
+          "p",
+          {
+            className: cn(
+              "mt-6 max-w-full md:max-w-lg text-lg md:text-xl text-balance text-center",
+              descriptionClassName
+            ),
+            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
+          }
+        ),
+        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",
+          {
+            className: cn(
+              "mt-16 flex flex-wrap items-center justify-center gap-8 md:gap-12",
+              statsClassName
+            ),
+            children: renderStats
+          }
+        )
+      ] })
     }
   );
 }

package/dist/hero-newsletter-minimal.d.cts

@@ -1,10 +1,10 @@
 import * as React from 'react';
-import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-r_NhxVet.cjs';
-import { FormFieldConfig, PageSpeedFormConfig } from '@page-speed/forms/integration';
-import { A as ActionConfig, S as StatItem } from './blocks-DP3Vofl4.cjs';
+import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-CPyEa7IX.cjs';
+import { FormEngineProps } from '@page-speed/forms/integration';
+import { A as ActionConfig, S as StatItem } from './blocks-tmd_MRJv.cjs';
 import 'react/jsx-runtime';
 import 'class-variance-authority';
-import './button-variants-CdNtNOuP.cjs';
+import './button-variants-8mtEHxev.cjs';
 import 'class-variance-authority/types';
 
 interface HeroNewsletterMinimalProps {
@@ -17,29 +17,9 @@ interface HeroNewsletterMinimalProps {
      */
     description?: React.ReactNode;
     /**
-     * Form field configuration
+     * Full form engine setup and props
      */
-    formFields?: FormFieldConfig[];
-    /**
-     * Form configuration for submission
-     */
-    formConfig?: PageSpeedFormConfig;
-    /**
-     * Custom submit handler
-     */
-    onSubmit?: (values: Record<string, any>) => void | Promise<void>;
-    /**
-     * Success callback
-     */
-    onSuccess?: (data: unknown) => void;
-    /**
-     * Error callback
-     */
-    onError?: (error: Error) => void;
-    /**
-     * Success message to display
-     */
-    successMessage?: React.ReactNode;
+    formEngineSetup?: FormEngineProps;
     /**
      * Submit button configuration
      */
@@ -116,6 +96,6 @@ interface HeroNewsletterMinimalProps {
      */
     patternClassName?: string;
 }
-declare function HeroNewsletterMinimal({ heading, description, formFields, formConfig, onSubmit, onSuccess, onError, successMessage, buttonAction, helperText, formSlot, disclaimer, stats, patternClassName, statsSlot, background, containerClassName, spacing, pattern, patternOpacity, className, headingClassName, descriptionClassName, formClassName, disclaimerClassName, statsClassName, }: HeroNewsletterMinimalProps): React.JSX.Element;
+declare function HeroNewsletterMinimal({ heading, description, formEngineSetup, buttonAction, helperText, formSlot, disclaimer, stats, patternClassName, statsSlot, background, containerClassName, spacing, pattern, patternOpacity, className, headingClassName, descriptionClassName, formClassName, disclaimerClassName, statsClassName, }: HeroNewsletterMinimalProps): React.JSX.Element;
 
 export { HeroNewsletterMinimal, type HeroNewsletterMinimalProps };

package/dist/hero-newsletter-minimal.d.ts

@@ -1,10 +1,10 @@
 import * as React from 'react';
-import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-DmVsuoHE.js';
-import { FormFieldConfig, PageSpeedFormConfig } from '@page-speed/forms/integration';
-import { A as ActionConfig, S as StatItem } from './blocks-XLPGq8A5.js';
+import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-hxnFe3w6.js';
+import { FormEngineProps } from '@page-speed/forms/integration';
+import { A as ActionConfig, S as StatItem } from './blocks-DRE-f6cS.js';
 import 'react/jsx-runtime';
 import 'class-variance-authority';
-import './button-variants-CdNtNOuP.js';
+import './button-variants-8mtEHxev.js';
 import 'class-variance-authority/types';
 
 interface HeroNewsletterMinimalProps {
@@ -17,29 +17,9 @@ interface HeroNewsletterMinimalProps {
      */
     description?: React.ReactNode;
     /**
-     * Form field configuration
+     * Full form engine setup and props
      */
-    formFields?: FormFieldConfig[];
-    /**
-     * Form configuration for submission
-     */
-    formConfig?: PageSpeedFormConfig;
-    /**
-     * Custom submit handler
-     */
-    onSubmit?: (values: Record<string, any>) => void | Promise<void>;
-    /**
-     * Success callback
-     */
-    onSuccess?: (data: unknown) => void;
-    /**
-     * Error callback
-     */
-    onError?: (error: Error) => void;
-    /**
-     * Success message to display
-     */
-    successMessage?: React.ReactNode;
+    formEngineSetup?: FormEngineProps;
     /**
      * Submit button configuration
      */
@@ -116,6 +96,6 @@ interface HeroNewsletterMinimalProps {
      */
     patternClassName?: string;
 }
-declare function HeroNewsletterMinimal({ heading, description, formFields, formConfig, onSubmit, onSuccess, onError, successMessage, buttonAction, helperText, formSlot, disclaimer, stats, patternClassName, statsSlot, background, containerClassName, spacing, pattern, patternOpacity, className, headingClassName, descriptionClassName, formClassName, disclaimerClassName, statsClassName, }: HeroNewsletterMinimalProps): React.JSX.Element;
+declare function HeroNewsletterMinimal({ heading, description, formEngineSetup, buttonAction, helperText, formSlot, disclaimer, stats, patternClassName, statsSlot, background, containerClassName, spacing, pattern, patternOpacity, className, headingClassName, descriptionClassName, formClassName, disclaimerClassName, statsClassName, }: HeroNewsletterMinimalProps): React.JSX.Element;
 
 export { HeroNewsletterMinimal, type HeroNewsletterMinimalProps };

package/dist/hero-newsletter-minimal.js

@@ -4,7 +4,7 @@ import React3__default from 'react';
 import { clsx } from 'clsx';
 import { twMerge } from 'tailwind-merge';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
-import { useFileUpload, FormEngine } from '@page-speed/forms/integration';
+import { FormEngine } from '@page-speed/forms/integration';
 
 // components/blocks/hero/hero-newsletter-minimal.tsx
 function cn(...inputs) {
@@ -385,6 +385,14 @@ var Section = React3__default.forwardRef(
   }
 );
 Section.displayName = "Section";
+var DEFAULT_STYLE_RULES = {
+  formContainer: "",
+  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"
+};
 var DEFAULT_FORM_FIELDS = [
   {
     name: "email",
@@ -398,12 +406,7 @@ var DEFAULT_FORM_FIELDS = [
 function HeroNewsletterMinimal({
   heading,
   description,
-  formFields = DEFAULT_FORM_FIELDS,
-  formConfig,
-  onSubmit,
-  onSuccess,
-  onError,
-  successMessage,
+  formEngineSetup,
   buttonAction,
   helperText,
   formSlot,
@@ -412,7 +415,7 @@ function HeroNewsletterMinimal({
   patternClassName,
   statsSlot,
   background,
-  containerClassName = "px-6 sm:px-6 md:px-8 lg:px-8",
+  containerClassName = "pmx-auto w-full max-w-7xl relative z-10 px-6 sm:px-6 md:px-8 lg:px-8 flex flex-col items-center justify-center",
   spacing = "xl",
   pattern,
   patternOpacity,
@@ -423,14 +426,23 @@ function HeroNewsletterMinimal({
   disclaimerClassName,
   statsClassName
 }) {
-  const {
-    uploadTokens,
-    uploadProgress,
-    isUploading,
-    uploadFiles,
-    removeFile,
-    resetUpload
-  } = useFileUpload({ onError });
+  const formStyleRules = React3.useMemo(() => {
+    return {
+      formContainer: formEngineSetup?.formLayoutSettings?.styleRules?.formContainer ?? DEFAULT_STYLE_RULES.formContainer,
+      fieldsContainer: formEngineSetup?.formLayoutSettings?.styleRules?.fieldsContainer ?? DEFAULT_STYLE_RULES.fieldsContainer,
+      fieldClassName: formEngineSetup?.formLayoutSettings?.styleRules?.fieldClassName ?? DEFAULT_STYLE_RULES.fieldClassName,
+      formClassName: formEngineSetup?.formLayoutSettings?.styleRules?.formClassName ?? DEFAULT_STYLE_RULES.formClassName,
+      successMessageClassName: formEngineSetup?.formLayoutSettings?.styleRules?.successMessageClassName ?? DEFAULT_STYLE_RULES.successMessageClassName,
+      errorMessageClassName: formEngineSetup?.formLayoutSettings?.styleRules?.errorMessageClassName ?? DEFAULT_STYLE_RULES.errorMessageClassName
+    };
+  }, [formEngineSetup?.formLayoutSettings?.styleRules]);
+  const formFields = React3.useMemo(() => {
+    if (formEngineSetup && formEngineSetup?.fields && formEngineSetup?.fields?.length > 0) {
+      return formEngineSetup.fields;
+    } else {
+      return DEFAULT_FORM_FIELDS;
+    }
+  }, [formEngineSetup?.fields]);
   const renderStats = React3.useMemo(() => {
     if (statsSlot) return statsSlot;
     if (!stats || stats.length === 0) return null;
@@ -459,6 +471,7 @@ function HeroNewsletterMinimal({
   }, [statsSlot, stats]);
   const renderForm = React3.useMemo(() => {
     if (formSlot) return formSlot;
+    if (!formEngineSetup) return null;
     const defaultButtonAction = {
       label: "Subscribe",
       variant: "default"
@@ -468,52 +481,27 @@ function HeroNewsletterMinimal({
       /* @__PURE__ */ jsx(
         FormEngine,
         {
-          api: formConfig,
-          fields: formFields,
+          ...formEngineSetup,
           formLayoutSettings: {
+            ...formEngineSetup.formLayoutSettings,
             formLayout: "button-group",
             buttonGroupSetup: {
+              ...formEngineSetup.formLayoutSettings?.buttonGroupSetup,
               size: "lg",
               submitLabel: /* @__PURE__ */ jsxs(Fragment, { children: [
                 action.label,
                 action.iconAfter
               ] }),
               submitVariant: action.variant || "default"
-            }
+            },
+            styleRules: formStyleRules
           },
-          successMessage,
-          onSubmit,
-          onSuccess: (data) => {
-            resetUpload();
-            onSuccess?.(data);
-          },
-          onError,
-          uploadTokens,
-          uploadProgress,
-          onFileUpload: uploadFiles,
-          onFileRemove: removeFile,
-          isUploading
+          fields: formFields
         }
       ),
       helperText && (typeof helperText === "string" ? /* @__PURE__ */ jsx("p", { className: cn("text-sm mt-2 text-center"), children: helperText }) : helperText)
     ] });
-  }, [
-    formSlot,
-    formFields,
-    formConfig,
-    buttonAction,
-    uploadTokens,
-    uploadProgress,
-    uploadFiles,
-    removeFile,
-    isUploading,
-    successMessage,
-    onSubmit,
-    onSuccess,
-    onError,
-    helperText,
-    resetUpload
-  ]);
+  }, [formSlot, formEngineSetup, buttonAction, formFields, formStyleRules, helperText]);
   return /* @__PURE__ */ jsx(
     Section,
     {
@@ -524,58 +512,49 @@ function HeroNewsletterMinimal({
       patternClassName,
       className,
       containerClassName,
-      children: /* @__PURE__ */ jsxs(
-        "div",
-        {
-          className: cn(
-            "container flex flex-col items-center justify-center text-center",
-            containerClassName
-          ),
-          children: [
-            heading && (typeof heading === "string" ? /* @__PURE__ */ jsx(
-              "h1",
-              {
-                className: cn(
-                  "max-w-3xl text-5xl font-bold tracking-tight md:text-6xl lg:text-7xl text-pretty",
-                  headingClassName
-                ),
-                children: heading
-              }
-            ) : heading),
-            description && (typeof description === "string" ? /* @__PURE__ */ jsx(
-              "p",
-              {
-                className: cn(
-                  "mt-6 max-w-full md:max-w-lg text-lg md:text-xl text-balance",
-                  descriptionClassName
-                ),
-                children: description
-              }
-            ) : description),
-            /* @__PURE__ */ jsx(
-              "div",
-              {
-                className: cn(
-                  "mt-10 flex w-full max-w-md flex-col gap-4 sm:flex-row",
-                  formClassName
-                ),
-                children: renderForm
-              }
+      children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center justify-center", children: [
+        heading && (typeof heading === "string" ? /* @__PURE__ */ jsx(
+          "h1",
+          {
+            className: cn(
+              "max-w-3xl text-5xl font-bold tracking-tight md:text-6xl lg:text-7xl text-pretty text-center",
+              headingClassName
             ),
-            disclaimer && (typeof disclaimer === "string" ? /* @__PURE__ */ jsx("p", { className: cn("mt-4 text-sm", disclaimerClassName), children: disclaimer }) : disclaimer),
-            (statsSlot || stats && stats.length > 0) && /* @__PURE__ */ jsx(
-              "div",
-              {
-                className: cn(
-                  "mt-16 flex flex-wrap items-center justify-center gap-8 md:gap-12",
-                  statsClassName
-                ),
-                children: renderStats
-              }
-            )
-          ]
-        }
-      )
+            children: heading
+          }
+        ) : heading),
+        description && (typeof description === "string" ? /* @__PURE__ */ jsx(
+          "p",
+          {
+            className: cn(
+              "mt-6 max-w-full md:max-w-lg text-lg md:text-xl text-balance text-center",
+              descriptionClassName
+            ),
+            children: description
+          }
+        ) : description),
+        /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: cn(
+              "mt-10 flex w-full max-w-md flex-col gap-4 sm:flex-row",
+              formClassName
+            ),
+            children: renderForm
+          }
+        ),
+        disclaimer && (typeof disclaimer === "string" ? /* @__PURE__ */ jsx("p", { className: cn("mt-4 text-sm", disclaimerClassName), children: disclaimer }) : disclaimer),
+        (statsSlot || stats && stats.length > 0) && /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: cn(
+              "mt-16 flex flex-wrap items-center justify-center gap-8 md:gap-12",
+              statsClassName
+            ),
+            children: renderStats
+          }
+        )
+      ] })
     }
   );
 }

package/dist/hero-overlay-cta-grid.d.cts

@@ -1,9 +1,9 @@
 import * as React from 'react';
-import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-r_NhxVet.cjs';
+import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-CPyEa7IX.cjs';
 import 'react/jsx-runtime';
-import './blocks-DP3Vofl4.cjs';
+import './blocks-tmd_MRJv.cjs';
 import 'class-variance-authority';
-import './button-variants-CdNtNOuP.cjs';
+import './button-variants-8mtEHxev.cjs';
 import 'class-variance-authority/types';
 
 interface HeroOverlayCtaGridCard {

package/dist/hero-overlay-cta-grid.d.ts

@@ -1,9 +1,9 @@
 import * as React from 'react';
-import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-DmVsuoHE.js';
+import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-hxnFe3w6.js';
 import 'react/jsx-runtime';
-import './blocks-XLPGq8A5.js';
+import './blocks-DRE-f6cS.js';
 import 'class-variance-authority';
-import './button-variants-CdNtNOuP.js';
+import './button-variants-8mtEHxev.js';
 import 'class-variance-authority/types';
 
 interface HeroOverlayCtaGridCard {

package/dist/hero-pattern-badge-logos.d.cts

@@ -1,9 +1,9 @@
 import * as React from 'react';
-import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-r_NhxVet.cjs';
-import { A as ActionConfig, L as LogoItem, O as OptixFlowConfig } from './blocks-DP3Vofl4.cjs';
+import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-CPyEa7IX.cjs';
+import { A as ActionConfig, L as LogoItem, O as OptixFlowConfig } from './blocks-tmd_MRJv.cjs';
 import 'react/jsx-runtime';
 import 'class-variance-authority';
-import './button-variants-CdNtNOuP.cjs';
+import './button-variants-8mtEHxev.cjs';
 import 'class-variance-authority/types';
 
 interface HeroPatternBadgeLogosProps {