@opensite/ui 3.5.4 → 3.5.6

package/dist/contact-map.cjs

@@ -495,6 +495,46 @@ var DEFAULT_FORM_FIELDS = [
     columnSpan: 12
   }
 ];
+function coerceCoordinate(value) {
+  if (typeof value === "number") {
+    return Number.isFinite(value) ? value : null;
+  }
+  if (typeof value === "string" && value.trim().length > 0) {
+    const parsed = Number(value);
+    return Number.isFinite(parsed) ? parsed : null;
+  }
+  return null;
+}
+function sanitizeMarker(marker) {
+  const markerWithAliases = marker;
+  const latitude = coerceCoordinate(
+    markerWithAliases.latitude ?? markerWithAliases.lat
+  );
+  const longitude = coerceCoordinate(
+    markerWithAliases.longitude ?? markerWithAliases.lng
+  );
+  if (latitude === null || longitude === null) {
+    return null;
+  }
+  return {
+    ...marker,
+    latitude,
+    longitude
+  };
+}
+function sanitizeCluster(cluster) {
+  const markers = cluster.markers.map((marker) => sanitizeMarker(marker)).filter((marker) => marker !== null);
+  if (markers.length === 0) {
+    return null;
+  }
+  const latitude = coerceCoordinate(cluster.latitude);
+  const longitude = coerceCoordinate(cluster.longitude);
+  return {
+    ...cluster,
+    markers,
+    ...latitude !== null && longitude !== null ? { latitude, longitude } : {}
+  };
+}
 function ContactMap({
   sectionId = "contact-map",
   heading,
@@ -530,10 +570,24 @@ function ContactMap({
       }
     );
   }, [formEngineSetup]);
+  const sanitizedMapData = React4__namespace.useMemo(() => {
+    const markers = (mapProps?.markers ?? []).map((marker) => sanitizeMarker(marker)).filter((marker) => marker !== null);
+    const clusters = (mapProps?.clusters ?? []).map((cluster) => sanitizeCluster(cluster)).filter((cluster) => cluster !== null);
+    return {
+      markers,
+      clusters,
+      hasRenderableMap: markers.length > 0 || clusters.length > 0
+    };
+  }, [mapProps?.clusters, mapProps?.markers]);
   const resolvedMapProps = React4__namespace.useMemo(() => {
+    if (!sanitizedMapData.hasRenderableMap) {
+      return null;
+    }
     return {
       panelPosition: "top-left",
       ...mapProps,
+      markers: sanitizedMapData.markers,
+      clusters: sanitizedMapData.clusters,
       // Don't override mapWrapperClassName if it's provided in mapProps
       mapWrapperClassName: mapProps?.mapWrapperClassName,
       className: cn(mapClassName, mapProps?.className),
@@ -542,7 +596,8 @@ function ContactMap({
       IconComponent: DynamicIcon,
       ImgComponent: img.Img
     };
-  }, [mapClassName, mapProps, optixFlowConfig]);
+  }, [mapClassName, mapProps, optixFlowConfig, sanitizedMapData]);
+  const hasMap = resolvedMapProps !== null;
   return /* @__PURE__ */ jsxRuntime.jsx(
     Section,
     {
@@ -557,8 +612,10 @@ function ContactMap({
         "div",
         {
           className: cn(
-            "mx-auto grid max-w-full md:max-w-7xl gap-8 lg:grid-cols-[minmax(0,0.9fr)_minmax(0,1.1fr)]",
-            contentGridClassName
+            "mx-auto grid max-w-full gap-8",
+            hasMap && "md:max-w-7xl lg:grid-cols-[minmax(0,0.9fr)_minmax(0,1.1fr)]",
+            contentGridClassName,
+            !hasMap && "md:max-w-3xl lg:grid-cols-1"
           ),
           children: [
             /* @__PURE__ */ jsxRuntime.jsx(Card, { className: cn("shadow-lg rounded-xl", cardClassName), children: /* @__PURE__ */ jsxRuntime.jsxs(CardContent, { className: cardContentClassName, children: [
@@ -586,7 +643,7 @@ function ContactMap({
               ] }),
               renderForm
             ] }) }),
-            /* @__PURE__ */ jsxRuntime.jsx(
+            resolvedMapProps ? /* @__PURE__ */ jsxRuntime.jsx(
               "div",
               {
                 className: cn(
@@ -600,7 +657,7 @@ function ContactMap({
                 },
                 children: /* @__PURE__ */ jsxRuntime.jsx(maps.GeoMap, { ...resolvedMapProps })
               }
-            )
+            ) : null
           ]
         }
       )

package/dist/contact-map.js

@@ -474,6 +474,46 @@ var DEFAULT_FORM_FIELDS = [
     columnSpan: 12
   }
 ];
+function coerceCoordinate(value) {
+  if (typeof value === "number") {
+    return Number.isFinite(value) ? value : null;
+  }
+  if (typeof value === "string" && value.trim().length > 0) {
+    const parsed = Number(value);
+    return Number.isFinite(parsed) ? parsed : null;
+  }
+  return null;
+}
+function sanitizeMarker(marker) {
+  const markerWithAliases = marker;
+  const latitude = coerceCoordinate(
+    markerWithAliases.latitude ?? markerWithAliases.lat
+  );
+  const longitude = coerceCoordinate(
+    markerWithAliases.longitude ?? markerWithAliases.lng
+  );
+  if (latitude === null || longitude === null) {
+    return null;
+  }
+  return {
+    ...marker,
+    latitude,
+    longitude
+  };
+}
+function sanitizeCluster(cluster) {
+  const markers = cluster.markers.map((marker) => sanitizeMarker(marker)).filter((marker) => marker !== null);
+  if (markers.length === 0) {
+    return null;
+  }
+  const latitude = coerceCoordinate(cluster.latitude);
+  const longitude = coerceCoordinate(cluster.longitude);
+  return {
+    ...cluster,
+    markers,
+    ...latitude !== null && longitude !== null ? { latitude, longitude } : {}
+  };
+}
 function ContactMap({
   sectionId = "contact-map",
   heading,
@@ -509,10 +549,24 @@ function ContactMap({
       }
     );
   }, [formEngineSetup]);
+  const sanitizedMapData = React4.useMemo(() => {
+    const markers = (mapProps?.markers ?? []).map((marker) => sanitizeMarker(marker)).filter((marker) => marker !== null);
+    const clusters = (mapProps?.clusters ?? []).map((cluster) => sanitizeCluster(cluster)).filter((cluster) => cluster !== null);
+    return {
+      markers,
+      clusters,
+      hasRenderableMap: markers.length > 0 || clusters.length > 0
+    };
+  }, [mapProps?.clusters, mapProps?.markers]);
   const resolvedMapProps = React4.useMemo(() => {
+    if (!sanitizedMapData.hasRenderableMap) {
+      return null;
+    }
     return {
       panelPosition: "top-left",
       ...mapProps,
+      markers: sanitizedMapData.markers,
+      clusters: sanitizedMapData.clusters,
       // Don't override mapWrapperClassName if it's provided in mapProps
       mapWrapperClassName: mapProps?.mapWrapperClassName,
       className: cn(mapClassName, mapProps?.className),
@@ -521,7 +575,8 @@ function ContactMap({
       IconComponent: DynamicIcon,
       ImgComponent: Img
     };
-  }, [mapClassName, mapProps, optixFlowConfig]);
+  }, [mapClassName, mapProps, optixFlowConfig, sanitizedMapData]);
+  const hasMap = resolvedMapProps !== null;
   return /* @__PURE__ */ jsx(
     Section,
     {
@@ -536,8 +591,10 @@ function ContactMap({
         "div",
         {
           className: cn(
-            "mx-auto grid max-w-full md:max-w-7xl gap-8 lg:grid-cols-[minmax(0,0.9fr)_minmax(0,1.1fr)]",
-            contentGridClassName
+            "mx-auto grid max-w-full gap-8",
+            hasMap && "md:max-w-7xl lg:grid-cols-[minmax(0,0.9fr)_minmax(0,1.1fr)]",
+            contentGridClassName,
+            !hasMap && "md:max-w-3xl lg:grid-cols-1"
           ),
           children: [
             /* @__PURE__ */ jsx(Card, { className: cn("shadow-lg rounded-xl", cardClassName), children: /* @__PURE__ */ jsxs(CardContent, { className: cardContentClassName, children: [
@@ -565,7 +622,7 @@ function ContactMap({
               ] }),
               renderForm
             ] }) }),
-            /* @__PURE__ */ jsx(
+            resolvedMapProps ? /* @__PURE__ */ jsx(
               "div",
               {
                 className: cn(
@@ -579,7 +636,7 @@ function ContactMap({
                 },
                 children: /* @__PURE__ */ jsx(GeoMap, { ...resolvedMapProps })
               }
-            )
+            ) : null
           ]
         }
       )

package/dist/registry.cjs

@@ -16674,6 +16674,46 @@ var DEFAULT_FORM_FIELDS23 = [
     columnSpan: 12
   }
 ];
+function coerceCoordinate(value) {
+  if (typeof value === "number") {
+    return Number.isFinite(value) ? value : null;
+  }
+  if (typeof value === "string" && value.trim().length > 0) {
+    const parsed = Number(value);
+    return Number.isFinite(parsed) ? parsed : null;
+  }
+  return null;
+}
+function sanitizeMarker(marker) {
+  const markerWithAliases = marker;
+  const latitude = coerceCoordinate(
+    markerWithAliases.latitude ?? markerWithAliases.lat
+  );
+  const longitude = coerceCoordinate(
+    markerWithAliases.longitude ?? markerWithAliases.lng
+  );
+  if (latitude === null || longitude === null) {
+    return null;
+  }
+  return {
+    ...marker,
+    latitude,
+    longitude
+  };
+}
+function sanitizeCluster(cluster) {
+  const markers = cluster.markers.map((marker) => sanitizeMarker(marker)).filter((marker) => marker !== null);
+  if (markers.length === 0) {
+    return null;
+  }
+  const latitude = coerceCoordinate(cluster.latitude);
+  const longitude = coerceCoordinate(cluster.longitude);
+  return {
+    ...cluster,
+    markers,
+    ...latitude !== null && longitude !== null ? { latitude, longitude } : {}
+  };
+}
 function ContactMap({
   sectionId = "contact-map",
   heading,
@@ -16709,10 +16749,24 @@ function ContactMap({
       }
     );
   }, [formEngineSetup]);
+  const sanitizedMapData = React30__namespace.useMemo(() => {
+    const markers = (mapProps?.markers ?? []).map((marker) => sanitizeMarker(marker)).filter((marker) => marker !== null);
+    const clusters = (mapProps?.clusters ?? []).map((cluster) => sanitizeCluster(cluster)).filter((cluster) => cluster !== null);
+    return {
+      markers,
+      clusters,
+      hasRenderableMap: markers.length > 0 || clusters.length > 0
+    };
+  }, [mapProps?.clusters, mapProps?.markers]);
   const resolvedMapProps = React30__namespace.useMemo(() => {
+    if (!sanitizedMapData.hasRenderableMap) {
+      return null;
+    }
     return {
       panelPosition: "top-left",
       ...mapProps,
+      markers: sanitizedMapData.markers,
+      clusters: sanitizedMapData.clusters,
       // Don't override mapWrapperClassName if it's provided in mapProps
       mapWrapperClassName: mapProps?.mapWrapperClassName,
       className: cn(mapClassName, mapProps?.className),
@@ -16721,7 +16775,8 @@ function ContactMap({
       IconComponent: DynamicIcon,
       ImgComponent: img.Img
     };
-  }, [mapClassName, mapProps, optixFlowConfig]);
+  }, [mapClassName, mapProps, optixFlowConfig, sanitizedMapData]);
+  const hasMap = resolvedMapProps !== null;
   return /* @__PURE__ */ jsxRuntime.jsx(
     Section,
     {
@@ -16736,8 +16791,10 @@ function ContactMap({
         "div",
         {
           className: cn(
-            "mx-auto grid max-w-full md:max-w-7xl gap-8 lg:grid-cols-[minmax(0,0.9fr)_minmax(0,1.1fr)]",
-            contentGridClassName
+            "mx-auto grid max-w-full gap-8",
+            hasMap && "md:max-w-7xl lg:grid-cols-[minmax(0,0.9fr)_minmax(0,1.1fr)]",
+            contentGridClassName,
+            !hasMap && "md:max-w-3xl lg:grid-cols-1"
           ),
           children: [
             /* @__PURE__ */ jsxRuntime.jsx(Card, { className: cn("shadow-lg rounded-xl", cardClassName), children: /* @__PURE__ */ jsxRuntime.jsxs(CardContent, { className: cardContentClassName, children: [
@@ -16765,7 +16822,7 @@ function ContactMap({
               ] }),
               renderForm
             ] }) }),
-            /* @__PURE__ */ jsxRuntime.jsx(
+            resolvedMapProps ? /* @__PURE__ */ jsxRuntime.jsx(
               "div",
               {
                 className: cn(
@@ -16779,7 +16836,7 @@ function ContactMap({
                 },
                 children: /* @__PURE__ */ jsxRuntime.jsx(maps.GeoMap, { ...resolvedMapProps })
               }
-            )
+            ) : null
           ]
         }
       )
@@ -97870,8 +97927,8 @@ function StatsGrowthTimeline({
                 }
               ),
               milestone.title && (typeof milestone.title === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "mb-2 text-xl font-bold", children: milestone.title }) : milestone.title),
-              milestone.description && (typeof milestone.description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mb-4 text-muted-foreground", children: milestone.description }) : milestone.description),
-              milestone.metric && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-4 rounded-lg border bg-background p-4 shadow-sm", children: [
+              milestone.description && (typeof milestone.description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mb-4 opacity-70 text-balance", children: milestone.description }) : milestone.description),
+              milestone.metric && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-4 rounded-lg border bg-card text-card-foreground p-4 shadow-sm", children: [
                 renderMilestoneIcon(milestone),
                 /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
                   /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-2xl font-semibold", children: milestone.metric.value }),
@@ -97932,8 +97989,8 @@ function StatsGrowthTimeline({
           futureClassName
         ),
         children: [
-          futureHeading && (typeof futureHeading === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "mb-4 text-2xl font-bold", children: futureHeading }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-4", children: futureHeading })),
-          futureDescription && (typeof futureDescription === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mx-auto mb-8 max-w-full md:max-w-lg text-balance", children: futureDescription }) : futureDescription),
+          futureHeading && (typeof futureHeading === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-2xl font-bold", children: futureHeading }) : futureHeading),
+          futureDescription && (typeof futureDescription === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "max-w-full md:max-w-md text-balance", children: futureDescription }) : futureDescription),
           /* @__PURE__ */ jsxRuntime.jsx(
             BlockActions,
             {
@@ -97978,12 +98035,12 @@ function StatsGrowthTimeline({
               ),
               children: heading
             }
-          ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("mb-4", headingClassName), children: heading })),
+          ) : heading),
           description && (typeof description === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
             "p",
             {
               className: cn(
-                "mx-auto max-w-3xl text-lg text-muted-foreground",
+                "max-w-full md:max-w-md text-base md:text-lg text-balance",
                 descriptionClassName
               ),
               children: description

package/dist/registry.js

@@ -16634,6 +16634,46 @@ var DEFAULT_FORM_FIELDS23 = [
     columnSpan: 12
   }
 ];
+function coerceCoordinate(value) {
+  if (typeof value === "number") {
+    return Number.isFinite(value) ? value : null;
+  }
+  if (typeof value === "string" && value.trim().length > 0) {
+    const parsed = Number(value);
+    return Number.isFinite(parsed) ? parsed : null;
+  }
+  return null;
+}
+function sanitizeMarker(marker) {
+  const markerWithAliases = marker;
+  const latitude = coerceCoordinate(
+    markerWithAliases.latitude ?? markerWithAliases.lat
+  );
+  const longitude = coerceCoordinate(
+    markerWithAliases.longitude ?? markerWithAliases.lng
+  );
+  if (latitude === null || longitude === null) {
+    return null;
+  }
+  return {
+    ...marker,
+    latitude,
+    longitude
+  };
+}
+function sanitizeCluster(cluster) {
+  const markers = cluster.markers.map((marker) => sanitizeMarker(marker)).filter((marker) => marker !== null);
+  if (markers.length === 0) {
+    return null;
+  }
+  const latitude = coerceCoordinate(cluster.latitude);
+  const longitude = coerceCoordinate(cluster.longitude);
+  return {
+    ...cluster,
+    markers,
+    ...latitude !== null && longitude !== null ? { latitude, longitude } : {}
+  };
+}
 function ContactMap({
   sectionId = "contact-map",
   heading,
@@ -16669,10 +16709,24 @@ function ContactMap({
       }
     );
   }, [formEngineSetup]);
+  const sanitizedMapData = React30.useMemo(() => {
+    const markers = (mapProps?.markers ?? []).map((marker) => sanitizeMarker(marker)).filter((marker) => marker !== null);
+    const clusters = (mapProps?.clusters ?? []).map((cluster) => sanitizeCluster(cluster)).filter((cluster) => cluster !== null);
+    return {
+      markers,
+      clusters,
+      hasRenderableMap: markers.length > 0 || clusters.length > 0
+    };
+  }, [mapProps?.clusters, mapProps?.markers]);
   const resolvedMapProps = React30.useMemo(() => {
+    if (!sanitizedMapData.hasRenderableMap) {
+      return null;
+    }
     return {
       panelPosition: "top-left",
       ...mapProps,
+      markers: sanitizedMapData.markers,
+      clusters: sanitizedMapData.clusters,
       // Don't override mapWrapperClassName if it's provided in mapProps
       mapWrapperClassName: mapProps?.mapWrapperClassName,
       className: cn(mapClassName, mapProps?.className),
@@ -16681,7 +16735,8 @@ function ContactMap({
       IconComponent: DynamicIcon,
       ImgComponent: Img
     };
-  }, [mapClassName, mapProps, optixFlowConfig]);
+  }, [mapClassName, mapProps, optixFlowConfig, sanitizedMapData]);
+  const hasMap = resolvedMapProps !== null;
   return /* @__PURE__ */ jsx(
     Section,
     {
@@ -16696,8 +16751,10 @@ function ContactMap({
         "div",
         {
           className: cn(
-            "mx-auto grid max-w-full md:max-w-7xl gap-8 lg:grid-cols-[minmax(0,0.9fr)_minmax(0,1.1fr)]",
-            contentGridClassName
+            "mx-auto grid max-w-full gap-8",
+            hasMap && "md:max-w-7xl lg:grid-cols-[minmax(0,0.9fr)_minmax(0,1.1fr)]",
+            contentGridClassName,
+            !hasMap && "md:max-w-3xl lg:grid-cols-1"
           ),
           children: [
             /* @__PURE__ */ jsx(Card, { className: cn("shadow-lg rounded-xl", cardClassName), children: /* @__PURE__ */ jsxs(CardContent, { className: cardContentClassName, children: [
@@ -16725,7 +16782,7 @@ function ContactMap({
               ] }),
               renderForm
             ] }) }),
-            /* @__PURE__ */ jsx(
+            resolvedMapProps ? /* @__PURE__ */ jsx(
               "div",
               {
                 className: cn(
@@ -16739,7 +16796,7 @@ function ContactMap({
                 },
                 children: /* @__PURE__ */ jsx(GeoMap, { ...resolvedMapProps })
               }
-            )
+            ) : null
           ]
         }
       )
@@ -97830,8 +97887,8 @@ function StatsGrowthTimeline({
                 }
               ),
               milestone.title && (typeof milestone.title === "string" ? /* @__PURE__ */ jsx("h3", { className: "mb-2 text-xl font-bold", children: milestone.title }) : milestone.title),
-              milestone.description && (typeof milestone.description === "string" ? /* @__PURE__ */ jsx("p", { className: "mb-4 text-muted-foreground", children: milestone.description }) : milestone.description),
-              milestone.metric && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-4 rounded-lg border bg-background p-4 shadow-sm", children: [
+              milestone.description && (typeof milestone.description === "string" ? /* @__PURE__ */ jsx("p", { className: "mb-4 opacity-70 text-balance", children: milestone.description }) : milestone.description),
+              milestone.metric && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-4 rounded-lg border bg-card text-card-foreground p-4 shadow-sm", children: [
                 renderMilestoneIcon(milestone),
                 /* @__PURE__ */ jsxs("div", { children: [
                   /* @__PURE__ */ jsx("div", { className: "text-2xl font-semibold", children: milestone.metric.value }),
@@ -97892,8 +97949,8 @@ function StatsGrowthTimeline({
           futureClassName
         ),
         children: [
-          futureHeading && (typeof futureHeading === "string" ? /* @__PURE__ */ jsx("h3", { className: "mb-4 text-2xl font-bold", children: futureHeading }) : /* @__PURE__ */ jsx("div", { className: "mb-4", children: futureHeading })),
-          futureDescription && (typeof futureDescription === "string" ? /* @__PURE__ */ jsx("p", { className: "mx-auto mb-8 max-w-full md:max-w-lg text-balance", children: futureDescription }) : futureDescription),
+          futureHeading && (typeof futureHeading === "string" ? /* @__PURE__ */ jsx("h3", { className: "text-2xl font-bold", children: futureHeading }) : futureHeading),
+          futureDescription && (typeof futureDescription === "string" ? /* @__PURE__ */ jsx("p", { className: "max-w-full md:max-w-md text-balance", children: futureDescription }) : futureDescription),
           /* @__PURE__ */ jsx(
             BlockActions,
             {
@@ -97938,12 +97995,12 @@ function StatsGrowthTimeline({
               ),
               children: heading
             }
-          ) : /* @__PURE__ */ jsx("div", { className: cn("mb-4", headingClassName), children: heading })),
+          ) : heading),
           description && (typeof description === "string" ? /* @__PURE__ */ jsx(
             "p",
             {
               className: cn(
-                "mx-auto max-w-3xl text-lg text-muted-foreground",
+                "max-w-full md:max-w-md text-base md:text-lg text-balance",
                 descriptionClassName
               ),
               children: description

package/dist/stats-growth-timeline.cjs

@@ -603,8 +603,8 @@ function StatsGrowthTimeline({
                 }
               ),
               milestone.title && (typeof milestone.title === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "mb-2 text-xl font-bold", children: milestone.title }) : milestone.title),
-              milestone.description && (typeof milestone.description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mb-4 text-muted-foreground", children: milestone.description }) : milestone.description),
-              milestone.metric && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-4 rounded-lg border bg-background p-4 shadow-sm", children: [
+              milestone.description && (typeof milestone.description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mb-4 opacity-70 text-balance", children: milestone.description }) : milestone.description),
+              milestone.metric && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-4 rounded-lg border bg-card text-card-foreground p-4 shadow-sm", children: [
                 renderMilestoneIcon(milestone),
                 /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
                   /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-2xl font-semibold", children: milestone.metric.value }),
@@ -665,8 +665,8 @@ function StatsGrowthTimeline({
           futureClassName
         ),
         children: [
-          futureHeading && (typeof futureHeading === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "mb-4 text-2xl font-bold", children: futureHeading }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-4", children: futureHeading })),
-          futureDescription && (typeof futureDescription === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mx-auto mb-8 max-w-full md:max-w-lg text-balance", children: futureDescription }) : futureDescription),
+          futureHeading && (typeof futureHeading === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-2xl font-bold", children: futureHeading }) : futureHeading),
+          futureDescription && (typeof futureDescription === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "max-w-full md:max-w-md text-balance", children: futureDescription }) : futureDescription),
           /* @__PURE__ */ jsxRuntime.jsx(
             BlockActions,
             {
@@ -711,12 +711,12 @@ function StatsGrowthTimeline({
               ),
               children: heading
             }
-          ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("mb-4", headingClassName), children: heading })),
+          ) : heading),
           description && (typeof description === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
             "p",
             {
               className: cn(
-                "mx-auto max-w-3xl text-lg text-muted-foreground",
+                "max-w-full md:max-w-md text-base md:text-lg text-balance",
                 descriptionClassName
               ),
               children: description

package/dist/stats-growth-timeline.js

@@ -582,8 +582,8 @@ function StatsGrowthTimeline({
                 }
               ),
               milestone.title && (typeof milestone.title === "string" ? /* @__PURE__ */ jsx("h3", { className: "mb-2 text-xl font-bold", children: milestone.title }) : milestone.title),
-              milestone.description && (typeof milestone.description === "string" ? /* @__PURE__ */ jsx("p", { className: "mb-4 text-muted-foreground", children: milestone.description }) : milestone.description),
-              milestone.metric && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-4 rounded-lg border bg-background p-4 shadow-sm", children: [
+              milestone.description && (typeof milestone.description === "string" ? /* @__PURE__ */ jsx("p", { className: "mb-4 opacity-70 text-balance", children: milestone.description }) : milestone.description),
+              milestone.metric && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-4 rounded-lg border bg-card text-card-foreground p-4 shadow-sm", children: [
                 renderMilestoneIcon(milestone),
                 /* @__PURE__ */ jsxs("div", { children: [
                   /* @__PURE__ */ jsx("div", { className: "text-2xl font-semibold", children: milestone.metric.value }),
@@ -644,8 +644,8 @@ function StatsGrowthTimeline({
           futureClassName
         ),
         children: [
-          futureHeading && (typeof futureHeading === "string" ? /* @__PURE__ */ jsx("h3", { className: "mb-4 text-2xl font-bold", children: futureHeading }) : /* @__PURE__ */ jsx("div", { className: "mb-4", children: futureHeading })),
-          futureDescription && (typeof futureDescription === "string" ? /* @__PURE__ */ jsx("p", { className: "mx-auto mb-8 max-w-full md:max-w-lg text-balance", children: futureDescription }) : futureDescription),
+          futureHeading && (typeof futureHeading === "string" ? /* @__PURE__ */ jsx("h3", { className: "text-2xl font-bold", children: futureHeading }) : futureHeading),
+          futureDescription && (typeof futureDescription === "string" ? /* @__PURE__ */ jsx("p", { className: "max-w-full md:max-w-md text-balance", children: futureDescription }) : futureDescription),
           /* @__PURE__ */ jsx(
             BlockActions,
             {
@@ -690,12 +690,12 @@ function StatsGrowthTimeline({
               ),
               children: heading
             }
-          ) : /* @__PURE__ */ jsx("div", { className: cn("mb-4", headingClassName), children: heading })),
+          ) : heading),
           description && (typeof description === "string" ? /* @__PURE__ */ jsx(
             "p",
             {
               className: cn(
-                "mx-auto max-w-3xl text-lg text-muted-foreground",
+                "max-w-full md:max-w-md text-base md:text-lg text-balance",
                 descriptionClassName
               ),
               children: description

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@opensite/ui",
-  "version": "3.5.4",
+  "version": "3.5.6",
   "description": "Foundational UI component library for OpenSite Semantic Site Builder with tree-shakable exports and abstract styling",
   "keywords": [
     "react",