@opensite/ui 3.4.9 → 3.5.1

package/dist/hero-stats-social-proof.d.cts

@@ -53,7 +53,7 @@ interface HeroStatsSocialProofProps {
     statusCard?: {
         title?: React.ReactNode;
         subtitle?: React.ReactNode;
-        icon?: React.ReactNode;
+        icon?: React.ReactNode | string;
     };
     /**
      * Custom slot for status card (overrides statusCard)

package/dist/hero-stats-social-proof.d.ts

@@ -53,7 +53,7 @@ interface HeroStatsSocialProofProps {
     statusCard?: {
         title?: React.ReactNode;
         subtitle?: React.ReactNode;
-        icon?: React.ReactNode;
+        icon?: React.ReactNode | string;
     };
     /**
      * Custom slot for status card (overrides statusCard)

package/dist/hero-stats-social-proof.js

@@ -1,5 +1,6 @@
 "use client";
-import React, { useMemo } from 'react';
+import * as React from 'react';
+import React__default, { useMemo } from 'react';
 import { clsx } from 'clsx';
 import { twMerge } from 'tailwind-merge';
 import { Img } from '@page-speed/img';
@@ -7,6 +8,7 @@ import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { Pressable, buttonVariants } from '@page-speed/pressable';
 import { Slot } from '@radix-ui/react-slot';
 import { cva } from 'class-variance-authority';
+import { Icon } from '@page-speed/icon';
 
 // components/blocks/hero/hero-stats-social-proof.tsx
 function cn(...inputs) {
@@ -21,7 +23,7 @@ var maxWidthStyles = {
   "4xl": "max-w-[1536px]",
   full: "max-w-full"
 };
-var Container = React.forwardRef(
+var Container = React__default.forwardRef(
   ({ children, maxWidth = "xl", className, as = "div", ...props }, ref) => {
     const Component = as;
     return /* @__PURE__ */ jsx(
@@ -327,7 +329,7 @@ var spacingStyles = {
 };
 var predefinedSpacings = ["none", "sm", "md", "lg", "xl", "hero"];
 var isPredefinedSpacing = (spacing) => predefinedSpacings.includes(spacing);
-var Section = React.forwardRef(
+var Section = React__default.forwardRef(
   ({
     id,
     title,
@@ -420,6 +422,19 @@ function Badge({
     }
   );
 }
+var DEFAULT_ICON_API_KEY = "au382bi7fsh96w9h9xlrnat2jglx";
+var DynamicIcon = React.memo(function DynamicIcon2({
+  apiKey,
+  name,
+  ...props
+}) {
+  if (name == null) return null;
+  if (typeof name !== "string") {
+    return /* @__PURE__ */ jsx(Fragment, { children: name });
+  }
+  return /* @__PURE__ */ jsx(Icon, { ...props, name, apiKey: apiKey ?? DEFAULT_ICON_API_KEY });
+});
+DynamicIcon.displayName = "DynamicIcon";
 var MOBILE_CLASSES = {
   "fit-left": "items-start md:items-center",
   "fit-center": "items-center",
@@ -547,7 +562,7 @@ function HeroStatsSocialProof({
           "pr-4 md:pr-6 shadow-2xl bg-card text-card-foreground"
         ),
         children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
-          statusCard.icon && /* @__PURE__ */ jsx("div", { className: "flex shrink-0 h-12 w-12 items-center justify-center rounded-full bg-primary text-primary-foreground shadow-lg", children: statusCard.icon }),
+          statusCard.icon ? /* @__PURE__ */ jsx("div", { className: "flex shrink-0 h-12 w-12 items-center justify-center rounded-full bg-primary text-primary-foreground shadow-lg", children: /* @__PURE__ */ jsx(DynamicIcon, { name: statusCard.icon }) }) : null,
           /* @__PURE__ */ jsxs("div", { className: "text-balance", children: [
             statusCard.title && /* @__PURE__ */ jsx("div", { className: "font-semibold text-sm md:text-md leading-snug", children: statusCard.title }),
             statusCard.subtitle && /* @__PURE__ */ jsx("div", { className: "text-sm leading-snug tracking-tight", children: statusCard.subtitle })