@opensite/ui 0.3.4 → 0.4.1

package/dist/hero-newsletter-minimal.js

@@ -427,111 +427,6 @@ var Pressable = React.forwardRef(
   }
 );
 Pressable.displayName = "Pressable";
-var svgCache = /* @__PURE__ */ new Map();
-function DynamicIcon({
-  name,
-  size = 28,
-  color,
-  className,
-  alt
-}) {
-  const [svgContent, setSvgContent] = React.useState(null);
-  const [isLoading, setIsLoading] = React.useState(true);
-  const [error, setError] = React.useState(null);
-  const { url, iconName } = React.useMemo(() => {
-    const separator = name.includes("/") ? "/" : ":";
-    const [prefix, iconName2] = name.split(separator);
-    const baseUrl = `https://icons.opensite.ai/api/icon/${prefix}/${iconName2}?format=svg&width=${size}&height=${size}`;
-    return {
-      url: baseUrl,
-      iconName: iconName2
-    };
-  }, [name, size]);
-  React.useEffect(() => {
-    let isMounted = true;
-    const fetchSvg = async () => {
-      const cached = svgCache.get(url);
-      if (cached) {
-        if (isMounted) {
-          setSvgContent(cached);
-          setIsLoading(false);
-        }
-        return;
-      }
-      try {
-        setIsLoading(true);
-        setError(null);
-        const response = await fetch(url);
-        if (!response.ok) {
-          throw new Error(`Failed to fetch icon: ${response.status}`);
-        }
-        let svg = await response.text();
-        svg = processSvgForCurrentColor(svg);
-        svgCache.set(url, svg);
-        if (isMounted) {
-          setSvgContent(svg);
-          setIsLoading(false);
-        }
-      } catch (err) {
-        if (isMounted) {
-          setError(err instanceof Error ? err.message : "Failed to load icon");
-          setIsLoading(false);
-        }
-      }
-    };
-    fetchSvg();
-    return () => {
-      isMounted = false;
-    };
-  }, [url]);
-  if (isLoading) {
-    return /* @__PURE__ */ jsx(
-      "span",
-      {
-        className: cn("inline-block", className),
-        style: { width: size, height: size },
-        "aria-hidden": "true"
-      }
-    );
-  }
-  if (error || !svgContent) {
-    return /* @__PURE__ */ jsx(
-      "span",
-      {
-        className: cn("inline-block", className),
-        style: { width: size, height: size },
-        role: "img",
-        "aria-label": alt || iconName
-      }
-    );
-  }
-  return /* @__PURE__ */ jsx(
-    "span",
-    {
-      className: cn("inline-flex items-center justify-center", className),
-      style: {
-        width: size,
-        height: size,
-        color: color || "inherit"
-      },
-      role: "img",
-      "aria-label": alt || iconName,
-      dangerouslySetInnerHTML: { __html: svgContent }
-    }
-  );
-}
-function processSvgForCurrentColor(svg) {
-  let processed = svg;
-  processed = processed.replace(
-    /stroke=["'](#000000|#000|black)["']/gi,
-    'stroke="currentColor"'
-  );
-  processed = processed.replace(
-    /fill=["'](#000000|#000|black)["']/gi,
-    'fill="currentColor"'
-  );
-  return processed;
-}
 function Input({ className, type, ...props }) {
   return /* @__PURE__ */ jsx(
     "input",
@@ -548,26 +443,14 @@ function Input({ className, type, ...props }) {
     }
   );
 }
-var defaultSubmitAction = {
-  label: "Subscribe",
-  href: "#",
-  variant: "default",
-  className: "h-12 px-8",
-  iconAfter: /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/arrow-right", size: 16, className: "ml-2" })
-};
-var defaultStats = [
-  { value: "Weekly newsletter", icon: /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/mail", size: 16 }) },
-  { value: "50K+ subscribers", icon: /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/users", size: 16 }) },
-  { value: "4.9/5 rating", icon: /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/star", size: 16 }) }
-];
 function HeroNewsletterMinimal({
-  heading = "Stay ahead of the curve",
-  description = "Join 50,000+ professionals who get our weekly insights on design, development, and business growth.",
+  heading,
+  description,
   inputPlaceholder = "Enter your email",
-  submitAction = defaultSubmitAction,
+  submitAction,
   formSlot,
   disclaimer = "Free forever. No spam. Unsubscribe anytime.",
-  stats = defaultStats,
+  stats,
   statsSlot,
   className,
   containerClassName,
@@ -588,6 +471,7 @@ function HeroNewsletterMinimal({
   };
   const renderForm = () => {
     if (formSlot) return formSlot;
+    if (!submitAction) return null;
     const { label, icon, iconAfter, children, className: actionClassName, ...pressableProps } = submitAction;
     return /* @__PURE__ */ jsxs(Fragment, { children: [
       /* @__PURE__ */ jsx(

package/dist/hero-overlay-cta-grid.cjs

@@ -703,36 +703,16 @@ var imagePlaceholders = [
   "https://toastability-production.s3.amazonaws.com/e13qu3083lkhdg7th64vb628172a",
   "https://toastability-production.s3.amazonaws.com/w87w0fyjdol9yzwo7yywkgxidvzo"
 ];
-var defaultCards = [
-  {
-    label: "Personal Coverage",
-    subtitle: "Tailored protection for families, homes, and vehicles.",
-    href: "/personal-coverage",
-    icon: "lucide/user"
-  },
-  {
-    label: "Event Protection",
-    subtitle: "Flexible coverage for special events and gatherings.",
-    href: "/event-coverage",
-    icon: "lucide/ticket-check"
-  },
-  {
-    label: "Commercial Coverage",
-    subtitle: "Business-ready policies backed by OpenSite AI insights.",
-    href: "/business-coverage",
-    icon: "lucide/briefcase"
-  }
-];
 function HeroOverlayCtaGrid({
-  badgeText = "OpenSite AI Certified Advisors",
-  badgeIcon = "lucide/shield-check",
+  badgeText,
+  badgeIcon,
   badgeSlot,
-  heading = "Coverage guidance powered by OpenSite AI",
-  description = "Independent advisors backed by OpenSite AI insights help you secure the right coverage with clarity, speed, and confidence.",
+  heading,
+  description,
   primaryCta = { label: "Get a Free Quote", href: "/quote" },
   secondaryCta = { label: "Explore Coverage", href: "/coverage" },
   actionsSlot,
-  cards = defaultCards,
+  cards,
   cardsSlot,
   backgroundImage = imagePlaceholders[0],
   backgroundAlt = "OpenSite AI coverage advisory hero background",
@@ -760,6 +740,7 @@ function HeroOverlayCtaGrid({
   };
   const renderCards = () => {
     if (cardsSlot) return cardsSlot;
+    if (!cards || cards.length === 0) return null;
     return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mx-auto w-full max-w-6xl overflow-hidden rounded-3xl border border-border bg-background/95 shadow-2xl", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-1 divide-y divide-border md:grid-cols-3 md:divide-x md:divide-y-0", children: cards.map((card) => /* @__PURE__ */ jsxRuntime.jsxs(
       Pressable,
       {

package/dist/hero-overlay-cta-grid.js

@@ -682,36 +682,16 @@ var imagePlaceholders = [
   "https://toastability-production.s3.amazonaws.com/e13qu3083lkhdg7th64vb628172a",
   "https://toastability-production.s3.amazonaws.com/w87w0fyjdol9yzwo7yywkgxidvzo"
 ];
-var defaultCards = [
-  {
-    label: "Personal Coverage",
-    subtitle: "Tailored protection for families, homes, and vehicles.",
-    href: "/personal-coverage",
-    icon: "lucide/user"
-  },
-  {
-    label: "Event Protection",
-    subtitle: "Flexible coverage for special events and gatherings.",
-    href: "/event-coverage",
-    icon: "lucide/ticket-check"
-  },
-  {
-    label: "Commercial Coverage",
-    subtitle: "Business-ready policies backed by OpenSite AI insights.",
-    href: "/business-coverage",
-    icon: "lucide/briefcase"
-  }
-];
 function HeroOverlayCtaGrid({
-  badgeText = "OpenSite AI Certified Advisors",
-  badgeIcon = "lucide/shield-check",
+  badgeText,
+  badgeIcon,
   badgeSlot,
-  heading = "Coverage guidance powered by OpenSite AI",
-  description = "Independent advisors backed by OpenSite AI insights help you secure the right coverage with clarity, speed, and confidence.",
+  heading,
+  description,
   primaryCta = { label: "Get a Free Quote", href: "/quote" },
   secondaryCta = { label: "Explore Coverage", href: "/coverage" },
   actionsSlot,
-  cards = defaultCards,
+  cards,
   cardsSlot,
   backgroundImage = imagePlaceholders[0],
   backgroundAlt = "OpenSite AI coverage advisory hero background",
@@ -739,6 +719,7 @@ function HeroOverlayCtaGrid({
   };
   const renderCards = () => {
     if (cardsSlot) return cardsSlot;
+    if (!cards || cards.length === 0) return null;
     return /* @__PURE__ */ jsx("div", { className: "mx-auto w-full max-w-6xl overflow-hidden rounded-3xl border border-border bg-background/95 shadow-2xl", children: /* @__PURE__ */ jsx("div", { className: "grid grid-cols-1 divide-y divide-border md:grid-cols-3 md:divide-x md:divide-y-0", children: cards.map((card) => /* @__PURE__ */ jsxs(
       Pressable,
       {

package/dist/hero-pattern-badge-logos.cjs

@@ -483,28 +483,13 @@ var Pressable = React__namespace.forwardRef(
   }
 );
 Pressable.displayName = "Pressable";
-
-// lib/mediaPlaceholders.ts
-var logoPlaceholders = {
-  darkHorizontalLogo: "https://cdn.ing/assets/i/r/285986/5ivxh3ivywsmm6uslf3te38r6tg1/logo-dark.png",
-  lightHorizontalLogo: "https://cdn.ing/assets/i/r/285985/vs7w9ov4y1afgp95pb7nqkvnchq6/logo-light.png"
-};
-var defaultActions = [
-  { label: "Get Started", href: "#", variant: "default" },
-  { label: "Learn More", href: "#", variant: "outline" }
-];
-var defaultLogos = [
-  { src: logoPlaceholders.darkHorizontalLogo, alt: "Opensite AI", imgClassName: "h-6 dark:invert" },
-  { src: logoPlaceholders.darkHorizontalLogo, alt: "Partner", imgClassName: "h-5 dark:invert" },
-  { src: { light: logoPlaceholders.darkHorizontalLogo, dark: logoPlaceholders.lightHorizontalLogo }, alt: "Partner", imgClassName: "h-6" }
-];
 function HeroPatternBadgeLogos({
-  badge = /* @__PURE__ */ jsxRuntime.jsx(Badge, { variant: "outline", className: "transition-colors hover:bg-secondary/20", children: "New Release" }),
-  heading = "This is a heading for your new project",
-  description = "Lorem ipsum dolor sit amet consectetur adipisicing elit. Elig doloremque mollitia fugiat omnis! Porro facilis quo animi consequatur.",
-  actions = defaultActions,
+  badge,
+  heading,
+  description,
+  actions,
   actionsSlot,
-  logos = defaultLogos,
+  logos,
   logosSlot,
   logosTagline = "Powering the next generation of digital products",
   backgroundImageUrl = "https://cdn.ing/assets/files/record/286186/nbdflpgp4ostrno079hygibsflp3",

package/dist/hero-pattern-badge-logos.js

@@ -461,28 +461,13 @@ var Pressable = React.forwardRef(
   }
 );
 Pressable.displayName = "Pressable";
-
-// lib/mediaPlaceholders.ts
-var logoPlaceholders = {
-  darkHorizontalLogo: "https://cdn.ing/assets/i/r/285986/5ivxh3ivywsmm6uslf3te38r6tg1/logo-dark.png",
-  lightHorizontalLogo: "https://cdn.ing/assets/i/r/285985/vs7w9ov4y1afgp95pb7nqkvnchq6/logo-light.png"
-};
-var defaultActions = [
-  { label: "Get Started", href: "#", variant: "default" },
-  { label: "Learn More", href: "#", variant: "outline" }
-];
-var defaultLogos = [
-  { src: logoPlaceholders.darkHorizontalLogo, alt: "Opensite AI", imgClassName: "h-6 dark:invert" },
-  { src: logoPlaceholders.darkHorizontalLogo, alt: "Partner", imgClassName: "h-5 dark:invert" },
-  { src: { light: logoPlaceholders.darkHorizontalLogo, dark: logoPlaceholders.lightHorizontalLogo }, alt: "Partner", imgClassName: "h-6" }
-];
 function HeroPatternBadgeLogos({
-  badge = /* @__PURE__ */ jsx(Badge, { variant: "outline", className: "transition-colors hover:bg-secondary/20", children: "New Release" }),
-  heading = "This is a heading for your new project",
-  description = "Lorem ipsum dolor sit amet consectetur adipisicing elit. Elig doloremque mollitia fugiat omnis! Porro facilis quo animi consequatur.",
-  actions = defaultActions,
+  badge,
+  heading,
+  description,
+  actions,
   actionsSlot,
-  logos = defaultLogos,
+  logos,
   logosSlot,
   logosTagline = "Powering the next generation of digital products",
   backgroundImageUrl = "https://cdn.ing/assets/files/record/286186/nbdflpgp4ostrno079hygibsflp3",

package/dist/hero-pattern-logo-tech-stack.cjs

@@ -450,151 +450,16 @@ var Pressable = React__namespace.forwardRef(
   }
 );
 Pressable.displayName = "Pressable";
-var svgCache = /* @__PURE__ */ new Map();
-function DynamicIcon({
-  name,
-  size = 28,
-  color,
-  className,
-  alt
-}) {
-  const [svgContent, setSvgContent] = React__namespace.useState(null);
-  const [isLoading, setIsLoading] = React__namespace.useState(true);
-  const [error, setError] = React__namespace.useState(null);
-  const { url, iconName } = React__namespace.useMemo(() => {
-    const separator = name.includes("/") ? "/" : ":";
-    const [prefix, iconName2] = name.split(separator);
-    const baseUrl = `https://icons.opensite.ai/api/icon/${prefix}/${iconName2}?format=svg&width=${size}&height=${size}`;
-    return {
-      url: baseUrl,
-      iconName: iconName2
-    };
-  }, [name, size]);
-  React__namespace.useEffect(() => {
-    let isMounted = true;
-    const fetchSvg = async () => {
-      const cached = svgCache.get(url);
-      if (cached) {
-        if (isMounted) {
-          setSvgContent(cached);
-          setIsLoading(false);
-        }
-        return;
-      }
-      try {
-        setIsLoading(true);
-        setError(null);
-        const response = await fetch(url);
-        if (!response.ok) {
-          throw new Error(`Failed to fetch icon: ${response.status}`);
-        }
-        let svg = await response.text();
-        svg = processSvgForCurrentColor(svg);
-        svgCache.set(url, svg);
-        if (isMounted) {
-          setSvgContent(svg);
-          setIsLoading(false);
-        }
-      } catch (err) {
-        if (isMounted) {
-          setError(err instanceof Error ? err.message : "Failed to load icon");
-          setIsLoading(false);
-        }
-      }
-    };
-    fetchSvg();
-    return () => {
-      isMounted = false;
-    };
-  }, [url]);
-  if (isLoading) {
-    return /* @__PURE__ */ jsxRuntime.jsx(
-      "span",
-      {
-        className: cn("inline-block", className),
-        style: { width: size, height: size },
-        "aria-hidden": "true"
-      }
-    );
-  }
-  if (error || !svgContent) {
-    return /* @__PURE__ */ jsxRuntime.jsx(
-      "span",
-      {
-        className: cn("inline-block", className),
-        style: { width: size, height: size },
-        role: "img",
-        "aria-label": alt || iconName
-      }
-    );
-  }
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    "span",
-    {
-      className: cn("inline-flex items-center justify-center", className),
-      style: {
-        width: size,
-        height: size,
-        color: color || "inherit"
-      },
-      role: "img",
-      "aria-label": alt || iconName,
-      dangerouslySetInnerHTML: { __html: svgContent }
-    }
-  );
-}
-function processSvgForCurrentColor(svg) {
-  let processed = svg;
-  processed = processed.replace(
-    /stroke=["'](#000000|#000|black)["']/gi,
-    'stroke="currentColor"'
-  );
-  processed = processed.replace(
-    /fill=["'](#000000|#000|black)["']/gi,
-    'fill="currentColor"'
-  );
-  return processed;
-}
-
-// lib/mediaPlaceholders.ts
-var logoPlaceholders = {
-  logoMark: "https://cdn.ing/assets/i/r/285975/eud79qeya11q5w6ueyhklueardyx/monochrome-rounded-square-app-icon-circular-emblem.png"};
-var defaultLogo = {
-  src: logoPlaceholders.logoMark,
-  alt: "logo",
-  imgClassName: "h-16"
-};
-var defaultActions = [
-  {
-    label: "Get Started",
-    href: "#",
-    variant: "default",
-    className: "shadow-sm transition-shadow hover:shadow"
-  },
-  {
-    label: "Learn more",
-    href: "#",
-    variant: "outline",
-    className: "group",
-    iconAfter: /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/external-link", size: 16, className: "ml-2 transition-transform group-hover:translate-x-0.5" })
-  }
-];
-var defaultTechLogos = [
-  { src: logoPlaceholders.logoMark, alt: "technology logo", href: "#" },
-  { src: logoPlaceholders.logoMark, alt: "technology logo", href: "#" },
-  { src: logoPlaceholders.logoMark, alt: "technology logo", href: "#" },
-  { src: logoPlaceholders.logoMark, alt: "technology logo", href: "#" }
-];
 function HeroPatternLogoTechStack({
-  logo = defaultLogo,
+  logo,
   logoSlot,
-  heading = "Build your next project with",
+  heading,
   highlightedWord = "Blocks",
-  description = "Lorem ipsum dolor sit amet consectetur adipisicing elit. Elig doloremque mollitia fugiat omnis! Porro facilis quo animi consequatur. Explicabo.",
-  actions = defaultActions,
+  description,
+  actions,
   actionsSlot,
   techStackLabel = "Built with open-source technologies",
-  techLogos = defaultTechLogos,
+  techLogos,
   techLogosSlot,
   backgroundImage = "https://cdn.ing/assets/files/record/286187/4gpn0yq2ptra8iwlvmwwv860ggwv",
   className,
@@ -608,6 +473,7 @@ function HeroPatternLogoTechStack({
 }) {
   const renderLogo = () => {
     if (logoSlot) return logoSlot;
+    if (!logo) return null;
     const logoSrc = typeof logo.src === "string" ? logo.src : logo.src.light;
     return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "rounded-xl bg-background/30 p-4 shadow-sm backdrop-blur-sm", children: /* @__PURE__ */ jsxRuntime.jsx(
       img.Img,
@@ -621,6 +487,7 @@ function HeroPatternLogoTechStack({
   };
   const renderActions = () => {
     if (actionsSlot) return actionsSlot;
+    if (!actions || actions.length === 0) return null;
     return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("mt-6 flex justify-center gap-3", actionsClassName), children: actions.map((action, index) => {
       const { label, icon, iconAfter, children, className: actionClassName, ...pressableProps } = action;
       return /* @__PURE__ */ jsxRuntime.jsx(

package/dist/hero-pattern-logo-tech-stack.js

@@ -428,151 +428,16 @@ var Pressable = React.forwardRef(
   }
 );
 Pressable.displayName = "Pressable";
-var svgCache = /* @__PURE__ */ new Map();
-function DynamicIcon({
-  name,
-  size = 28,
-  color,
-  className,
-  alt
-}) {
-  const [svgContent, setSvgContent] = React.useState(null);
-  const [isLoading, setIsLoading] = React.useState(true);
-  const [error, setError] = React.useState(null);
-  const { url, iconName } = React.useMemo(() => {
-    const separator = name.includes("/") ? "/" : ":";
-    const [prefix, iconName2] = name.split(separator);
-    const baseUrl = `https://icons.opensite.ai/api/icon/${prefix}/${iconName2}?format=svg&width=${size}&height=${size}`;
-    return {
-      url: baseUrl,
-      iconName: iconName2
-    };
-  }, [name, size]);
-  React.useEffect(() => {
-    let isMounted = true;
-    const fetchSvg = async () => {
-      const cached = svgCache.get(url);
-      if (cached) {
-        if (isMounted) {
-          setSvgContent(cached);
-          setIsLoading(false);
-        }
-        return;
-      }
-      try {
-        setIsLoading(true);
-        setError(null);
-        const response = await fetch(url);
-        if (!response.ok) {
-          throw new Error(`Failed to fetch icon: ${response.status}`);
-        }
-        let svg = await response.text();
-        svg = processSvgForCurrentColor(svg);
-        svgCache.set(url, svg);
-        if (isMounted) {
-          setSvgContent(svg);
-          setIsLoading(false);
-        }
-      } catch (err) {
-        if (isMounted) {
-          setError(err instanceof Error ? err.message : "Failed to load icon");
-          setIsLoading(false);
-        }
-      }
-    };
-    fetchSvg();
-    return () => {
-      isMounted = false;
-    };
-  }, [url]);
-  if (isLoading) {
-    return /* @__PURE__ */ jsx(
-      "span",
-      {
-        className: cn("inline-block", className),
-        style: { width: size, height: size },
-        "aria-hidden": "true"
-      }
-    );
-  }
-  if (error || !svgContent) {
-    return /* @__PURE__ */ jsx(
-      "span",
-      {
-        className: cn("inline-block", className),
-        style: { width: size, height: size },
-        role: "img",
-        "aria-label": alt || iconName
-      }
-    );
-  }
-  return /* @__PURE__ */ jsx(
-    "span",
-    {
-      className: cn("inline-flex items-center justify-center", className),
-      style: {
-        width: size,
-        height: size,
-        color: color || "inherit"
-      },
-      role: "img",
-      "aria-label": alt || iconName,
-      dangerouslySetInnerHTML: { __html: svgContent }
-    }
-  );
-}
-function processSvgForCurrentColor(svg) {
-  let processed = svg;
-  processed = processed.replace(
-    /stroke=["'](#000000|#000|black)["']/gi,
-    'stroke="currentColor"'
-  );
-  processed = processed.replace(
-    /fill=["'](#000000|#000|black)["']/gi,
-    'fill="currentColor"'
-  );
-  return processed;
-}
-
-// lib/mediaPlaceholders.ts
-var logoPlaceholders = {
-  logoMark: "https://cdn.ing/assets/i/r/285975/eud79qeya11q5w6ueyhklueardyx/monochrome-rounded-square-app-icon-circular-emblem.png"};
-var defaultLogo = {
-  src: logoPlaceholders.logoMark,
-  alt: "logo",
-  imgClassName: "h-16"
-};
-var defaultActions = [
-  {
-    label: "Get Started",
-    href: "#",
-    variant: "default",
-    className: "shadow-sm transition-shadow hover:shadow"
-  },
-  {
-    label: "Learn more",
-    href: "#",
-    variant: "outline",
-    className: "group",
-    iconAfter: /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/external-link", size: 16, className: "ml-2 transition-transform group-hover:translate-x-0.5" })
-  }
-];
-var defaultTechLogos = [
-  { src: logoPlaceholders.logoMark, alt: "technology logo", href: "#" },
-  { src: logoPlaceholders.logoMark, alt: "technology logo", href: "#" },
-  { src: logoPlaceholders.logoMark, alt: "technology logo", href: "#" },
-  { src: logoPlaceholders.logoMark, alt: "technology logo", href: "#" }
-];
 function HeroPatternLogoTechStack({
-  logo = defaultLogo,
+  logo,
   logoSlot,
-  heading = "Build your next project with",
+  heading,
   highlightedWord = "Blocks",
-  description = "Lorem ipsum dolor sit amet consectetur adipisicing elit. Elig doloremque mollitia fugiat omnis! Porro facilis quo animi consequatur. Explicabo.",
-  actions = defaultActions,
+  description,
+  actions,
   actionsSlot,
   techStackLabel = "Built with open-source technologies",
-  techLogos = defaultTechLogos,
+  techLogos,
   techLogosSlot,
   backgroundImage = "https://cdn.ing/assets/files/record/286187/4gpn0yq2ptra8iwlvmwwv860ggwv",
   className,
@@ -586,6 +451,7 @@ function HeroPatternLogoTechStack({
 }) {
   const renderLogo = () => {
     if (logoSlot) return logoSlot;
+    if (!logo) return null;
     const logoSrc = typeof logo.src === "string" ? logo.src : logo.src.light;
     return /* @__PURE__ */ jsx("div", { className: "rounded-xl bg-background/30 p-4 shadow-sm backdrop-blur-sm", children: /* @__PURE__ */ jsx(
       Img,
@@ -599,6 +465,7 @@ function HeroPatternLogoTechStack({
   };
   const renderActions = () => {
     if (actionsSlot) return actionsSlot;
+    if (!actions || actions.length === 0) return null;
     return /* @__PURE__ */ jsx("div", { className: cn("mt-6 flex justify-center gap-3", actionsClassName), children: actions.map((action, index) => {
       const { label, icon, iconAfter, children, className: actionClassName, ...pressableProps } = action;
       return /* @__PURE__ */ jsx(