@opensite/ui 0.8.1 → 0.8.3

package/dist/feature-image-overlay-badge.js

@@ -3,7 +3,7 @@ import * as React from 'react';
 import React__default, { useMemo } from 'react';
 import { clsx } from 'clsx';
 import { twMerge } from 'tailwind-merge';
-import { jsx, jsxs } from 'react/jsx-runtime';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { cva } from 'class-variance-authority';
 import { Slot } from '@radix-ui/react-slot';
 import * as AvatarPrimitive from '@radix-ui/react-avatar';
@@ -1080,28 +1080,30 @@ function FeatureImageOverlayBadge({
           description && (typeof description === "string" ? /* @__PURE__ */ jsx("p", { className: cn("text-muted-foreground lg:text-lg", descriptionClassName), children: description }) : /* @__PURE__ */ jsx("div", { className: cn("text-muted-foreground lg:text-lg", descriptionClassName), children: description })),
           /* @__PURE__ */ jsx("div", { className: actionsClassName, children: actionsContent })
         ] }),
-        /* @__PURE__ */ jsxs("div", { className: cn("relative rounded-xl", imageWrapperClassName), children: [
+        imageContent && /* @__PURE__ */ jsxs("div", { className: cn("relative rounded-xl", imageWrapperClassName), children: [
           imageContent,
-          /* @__PURE__ */ jsx("div", { className: cn("absolute top-0 right-0 bottom-0 left-0 rounded-xl bg-linear-to-t from-primary via-transparent to-transparent", overlayClassName) }),
-          /* @__PURE__ */ jsxs("div", { className: "absolute top-0 flex h-full w-full flex-col justify-between p-7", children: [
-            /* @__PURE__ */ jsxs("span", { className: cn("ml-auto flex w-fit items-center gap-2 rounded-full bg-background/30 px-4 py-2.5 text-sm font-semibold backdrop-blur-sm", avatarBadgeClassName), children: [
-              /* @__PURE__ */ jsx(Avatar, { className: "size-7 rounded-full", children: /* @__PURE__ */ jsx(AvatarImage, { src: avatarSrc, alt: "Avatar" }) }),
-              avatarBadgeText
-            ] }),
-            /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-5 text-background", children: [
-              overlayTitle && (typeof overlayTitle === "string" ? /* @__PURE__ */ jsx("h4", { className: cn("text-lg font-semibold lg:text-3xl", overlayTitleClassName), children: overlayTitle }) : /* @__PURE__ */ jsx("div", { className: cn("text-lg font-semibold lg:text-3xl", overlayTitleClassName), children: overlayTitle })),
-              overlayLinkText && /* @__PURE__ */ jsxs(
-                Pressable,
-                {
-                  href: overlayLinkUrl,
-                  onClick: overlayLinkOnClick,
-                  className: "flex items-center gap-1 font-medium",
-                  children: [
-                    overlayLinkText,
-                    /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/chevron-right", size: 16 })
-                  ]
-                }
-              )
+          (avatarSrc || avatarBadgeText || overlayTitle || overlayLinkText) && /* @__PURE__ */ jsxs(Fragment, { children: [
+            /* @__PURE__ */ jsx("div", { className: cn("absolute top-0 right-0 bottom-0 left-0 rounded-xl bg-linear-to-t from-primary via-transparent to-transparent", overlayClassName) }),
+            /* @__PURE__ */ jsxs("div", { className: "absolute top-0 flex h-full w-full flex-col justify-between p-7", children: [
+              (avatarSrc || avatarBadgeText) && /* @__PURE__ */ jsxs("span", { className: cn("ml-auto flex w-fit items-center gap-2 rounded-full bg-background/30 px-4 py-2.5 text-sm font-semibold backdrop-blur-sm", avatarBadgeClassName), children: [
+                avatarSrc && /* @__PURE__ */ jsx(Avatar, { className: "size-7 rounded-full", children: /* @__PURE__ */ jsx(AvatarImage, { src: avatarSrc, alt: "Avatar" }) }),
+                avatarBadgeText
+              ] }),
+              (overlayTitle || overlayLinkText) && /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-5 text-background", children: [
+                overlayTitle && (typeof overlayTitle === "string" ? /* @__PURE__ */ jsx("h4", { className: cn("text-lg font-semibold lg:text-3xl", overlayTitleClassName), children: overlayTitle }) : /* @__PURE__ */ jsx("div", { className: cn("text-lg font-semibold lg:text-3xl", overlayTitleClassName), children: overlayTitle })),
+                overlayLinkText && /* @__PURE__ */ jsxs(
+                  Pressable,
+                  {
+                    href: overlayLinkUrl,
+                    onClick: overlayLinkOnClick,
+                    className: "flex items-center gap-1 font-medium",
+                    children: [
+                      overlayLinkText,
+                      /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/chevron-right", size: 16 })
+                    ]
+                  }
+                )
+              ] })
             ] })
           ] })
         ] })

package/dist/feature-integration-cards.cjs

@@ -949,26 +949,25 @@ function FeatureIntegrationCards({
   patternOpacity,
   patternClassName
 }) {
-  const renderIntegrationIcon = React.useMemo(() => (integration) => {
+  const renderIntegrationIcon = React.useCallback((integration) => {
     if (integration.iconSlot) return integration.iconSlot;
-    if (integration.icon) {
-      return /* @__PURE__ */ jsxRuntime.jsx(
-        img.Img,
-        {
-          src: integration.icon,
-          alt: integration.iconAlt || (typeof integration.title === "string" ? integration.title : "Integration icon"),
-          className: cn("h-auto w-7", integration.iconClassName),
-          loading: "lazy",
-          optixFlowConfig
-        }
-      );
-    }
-    return null;
+    if (!integration.icon) return null;
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      img.Img,
+      {
+        src: integration.icon,
+        alt: integration.iconAlt || (typeof integration.title === "string" ? integration.title : "Integration icon"),
+        className: cn("h-auto w-7", integration.iconClassName),
+        loading: "lazy",
+        optixFlowConfig
+      }
+    );
   }, [optixFlowConfig]);
-  const renderLinkLabel = React.useMemo(() => (integration) => {
+  const renderLinkLabel = React.useCallback((integration) => {
     if (integration.linkLabelSlot) return integration.linkLabelSlot;
+    if (!integration.linkLabel) return null;
     return /* @__PURE__ */ jsxRuntime.jsxs("span", { className: cn("flex items-center gap-1 rounded-full border px-3 py-2.5 text-sm", integration.linkLabelClassName), children: [
-      integration.linkLabel || "Visit Website",
+      integration.linkLabel,
       /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/arrow-right", size: 16 })
     ] });
   }, []);
@@ -976,10 +975,12 @@ function FeatureIntegrationCards({
     if (integrationsSlot) return integrationsSlot;
     if (!integrations || integrations.length === 0) return null;
     return integrations.map((integration, index) => {
+      const iconContent = renderIntegrationIcon(integration);
+      const linkLabelContent = renderLinkLabel(integration);
       const cardContent = /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between", children: [
-          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "grid size-12 shrink-0 place-content-center rounded-md border", children: renderIntegrationIcon(integration) }),
-          renderLinkLabel(integration)
+          iconContent && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "grid size-12 shrink-0 place-content-center rounded-md border", children: iconContent }),
+          linkLabelContent
         ] }),
         /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
           integration.title && (typeof integration.title === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h3", { className: cn("font-medium md:text-lg", integration.titleClassName), children: integration.title }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("font-medium md:text-lg", integration.titleClassName), children: integration.title })),

package/dist/feature-integration-cards.js

@@ -1,6 +1,6 @@
 "use client";
 import * as React from 'react';
-import React__default, { useMemo } from 'react';
+import React__default, { useCallback, useMemo } from 'react';
 import { clsx } from 'clsx';
 import { twMerge } from 'tailwind-merge';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
@@ -928,26 +928,25 @@ function FeatureIntegrationCards({
   patternOpacity,
   patternClassName
 }) {
-  const renderIntegrationIcon = useMemo(() => (integration) => {
+  const renderIntegrationIcon = useCallback((integration) => {
     if (integration.iconSlot) return integration.iconSlot;
-    if (integration.icon) {
-      return /* @__PURE__ */ jsx(
-        Img,
-        {
-          src: integration.icon,
-          alt: integration.iconAlt || (typeof integration.title === "string" ? integration.title : "Integration icon"),
-          className: cn("h-auto w-7", integration.iconClassName),
-          loading: "lazy",
-          optixFlowConfig
-        }
-      );
-    }
-    return null;
+    if (!integration.icon) return null;
+    return /* @__PURE__ */ jsx(
+      Img,
+      {
+        src: integration.icon,
+        alt: integration.iconAlt || (typeof integration.title === "string" ? integration.title : "Integration icon"),
+        className: cn("h-auto w-7", integration.iconClassName),
+        loading: "lazy",
+        optixFlowConfig
+      }
+    );
   }, [optixFlowConfig]);
-  const renderLinkLabel = useMemo(() => (integration) => {
+  const renderLinkLabel = useCallback((integration) => {
     if (integration.linkLabelSlot) return integration.linkLabelSlot;
+    if (!integration.linkLabel) return null;
     return /* @__PURE__ */ jsxs("span", { className: cn("flex items-center gap-1 rounded-full border px-3 py-2.5 text-sm", integration.linkLabelClassName), children: [
-      integration.linkLabel || "Visit Website",
+      integration.linkLabel,
       /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/arrow-right", size: 16 })
     ] });
   }, []);
@@ -955,10 +954,12 @@ function FeatureIntegrationCards({
     if (integrationsSlot) return integrationsSlot;
     if (!integrations || integrations.length === 0) return null;
     return integrations.map((integration, index) => {
+      const iconContent = renderIntegrationIcon(integration);
+      const linkLabelContent = renderLinkLabel(integration);
       const cardContent = /* @__PURE__ */ jsxs(Fragment, { children: [
         /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
-          /* @__PURE__ */ jsx("span", { className: "grid size-12 shrink-0 place-content-center rounded-md border", children: renderIntegrationIcon(integration) }),
-          renderLinkLabel(integration)
+          iconContent && /* @__PURE__ */ jsx("span", { className: "grid size-12 shrink-0 place-content-center rounded-md border", children: iconContent }),
+          linkLabelContent
         ] }),
         /* @__PURE__ */ jsxs("div", { children: [
           integration.title && (typeof integration.title === "string" ? /* @__PURE__ */ jsx("h3", { className: cn("font-medium md:text-lg", integration.titleClassName), children: integration.title }) : /* @__PURE__ */ jsx("div", { className: cn("font-medium md:text-lg", integration.titleClassName), children: integration.title })),

package/dist/feature-numbered-cards.cjs

@@ -529,7 +529,7 @@ function FeatureNumberedCards({
   patternOpacity,
   patternClassName
 }) {
-  const renderChecklistItems = (feature) => {
+  const renderChecklistItems = React.useCallback((feature) => {
     if (feature.checklistSlot) return feature.checklistSlot;
     if (!feature.checklistItems || feature.checklistItems.length === 0) return null;
     return feature.checklistItems.map((item, itemIndex) => {
@@ -549,7 +549,7 @@ function FeatureNumberedCards({
         /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm md:text-base", children: content })
       ] }, itemIndex);
     });
-  };
+  }, []);
   const featuresContent = React.useMemo(() => {
     if (featuresSlot) return featuresSlot;
     if (!features || features.length === 0) return null;

package/dist/feature-numbered-cards.js

@@ -1,6 +1,6 @@
 "use client";
 import * as React from 'react';
-import React__default, { useMemo } from 'react';
+import React__default, { useCallback, useMemo } from 'react';
 import { clsx } from 'clsx';
 import { twMerge } from 'tailwind-merge';
 import { jsx, jsxs } from 'react/jsx-runtime';
@@ -508,7 +508,7 @@ function FeatureNumberedCards({
   patternOpacity,
   patternClassName
 }) {
-  const renderChecklistItems = (feature) => {
+  const renderChecklistItems = useCallback((feature) => {
     if (feature.checklistSlot) return feature.checklistSlot;
     if (!feature.checklistItems || feature.checklistItems.length === 0) return null;
     return feature.checklistItems.map((item, itemIndex) => {
@@ -528,7 +528,7 @@ function FeatureNumberedCards({
         /* @__PURE__ */ jsx("p", { className: "text-sm md:text-base", children: content })
       ] }, itemIndex);
     });
-  };
+  }, []);
   const featuresContent = useMemo(() => {
     if (featuresSlot) return featuresSlot;
     if (!features || features.length === 0) return null;

package/dist/feature-pattern-grid-links.cjs

@@ -554,22 +554,6 @@ var Pressable = React__namespace.forwardRef(
   }
 );
 Pressable.displayName = "Pressable";
-
-// lib/patternSvgs.ts
-var patternSvgs = {
-  squareAltGrid: "https://cdn.ing/assets/files/record/286187/4gpn0yq2ptra8iwlvmwwv860ggwv",
-  grid1: "https://cdn.ing/assets/files/record/286186/nbdflpgp4ostrno079hygibsflp3",
-  noise: "https://cdn.ing/assets/i/r/286188/zrqcp9hynh3j7p2laihwzfbujgrl/noise.png",
-  dots: "https://cdn.ing/assets/files/record/286198/yfsjx9thvtxzhl2qtshxyhkrm524",
-  dotPattern: "https://cdn.ing/assets/files/record/286192/7ig0cku8aqbboiza8nuk6hw0nnsr",
-  dotPattern2: "https://cdn.ing/assets/files/record/286189/arez6gd2s7isn9i1o6c7sexdq7bl",
-  circles: "https://cdn.ing/assets/files/record/286190/gtmia3sncjtzetdshc20zf1d3c17",
-  waves: "https://cdn.ing/assets/files/record/286191/mqlb33fzxz9cdth1bx7if0wmpkp1",
-  crossPattern: "https://cdn.ing/assets/files/record/286193/9yfqwdbnqaipbp7fsb3wbzzmq472",
-  architect: "https://cdn.ing/assets/files/record/286194/vgs88ugpvyhxu13wqgy0acvae6re",
-  tinyCheckers: "https://cdn.ing/assets/files/record/286195/65efaknsw8kcpf9o3c2gybytsl5b",
-  p6: "https://cdn.ing/assets/i/r/286196/6kl0rqnd6mjk8j7e525fo8fo0vkc/p6.webp"
-};
 var maxWidthStyles = {
   sm: "max-w-screen-sm",
   md: "max-w-screen-md",
@@ -598,6 +582,22 @@ var Container = React__namespace.default.forwardRef(
   }
 );
 Container.displayName = "Container";
+
+// lib/patternSvgs.ts
+var patternSvgs = {
+  squareAltGrid: "https://cdn.ing/assets/files/record/286187/4gpn0yq2ptra8iwlvmwwv860ggwv",
+  grid1: "https://cdn.ing/assets/files/record/286186/nbdflpgp4ostrno079hygibsflp3",
+  noise: "https://cdn.ing/assets/i/r/286188/zrqcp9hynh3j7p2laihwzfbujgrl/noise.png",
+  dots: "https://cdn.ing/assets/files/record/286198/yfsjx9thvtxzhl2qtshxyhkrm524",
+  dotPattern: "https://cdn.ing/assets/files/record/286192/7ig0cku8aqbboiza8nuk6hw0nnsr",
+  dotPattern2: "https://cdn.ing/assets/files/record/286189/arez6gd2s7isn9i1o6c7sexdq7bl",
+  circles: "https://cdn.ing/assets/files/record/286190/gtmia3sncjtzetdshc20zf1d3c17",
+  waves: "https://cdn.ing/assets/files/record/286191/mqlb33fzxz9cdth1bx7if0wmpkp1",
+  crossPattern: "https://cdn.ing/assets/files/record/286193/9yfqwdbnqaipbp7fsb3wbzzmq472",
+  architect: "https://cdn.ing/assets/files/record/286194/vgs88ugpvyhxu13wqgy0acvae6re",
+  tinyCheckers: "https://cdn.ing/assets/files/record/286195/65efaknsw8kcpf9o3c2gybytsl5b",
+  p6: "https://cdn.ing/assets/i/r/286196/6kl0rqnd6mjk8j7e525fo8fo0vkc/p6.webp"
+};
 var maskTop = "radial-gradient(ellipse 70% 60% at 50% 0%, #000 60%, transparent 100%)";
 var maskBottom = "radial-gradient(ellipse 100% 80% at 50% 100%, #000 50%, transparent 90%)";
 var maskCenter = "radial-gradient(ellipse 60% 60% at 50% 50%, #000 30%, transparent 70%)";
@@ -932,7 +932,6 @@ Section.displayName = "Section";
 function FeaturePatternGridLinks({
   features,
   featuresSlot,
-  patternUrl = patternSvgs.dotPattern,
   className,
   containerClassName,
   gridClassName,
@@ -943,26 +942,28 @@ function FeaturePatternGridLinks({
   patternOpacity,
   patternClassName
 }) {
-  const renderFeatureIcon = (feature) => {
+  const renderFeatureIcon = React.useCallback((feature) => {
     if (feature.icon) return feature.icon;
     if (feature.iconName) return /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: feature.iconName, size: 24, className: feature.iconClassName });
     return null;
-  };
-  const renderFeatureLink = (feature) => {
+  }, []);
+  const renderFeatureLink = React.useCallback((feature) => {
     if (feature.linkSlot) return feature.linkSlot;
-    if (!feature.link) return null;
+    if (!feature.link && !feature.linkLabel) return null;
+    const label = feature.linkLabel || (feature.link ? "Learn more" : null);
+    if (!label) return null;
     return /* @__PURE__ */ jsxRuntime.jsxs(
       Pressable,
       {
         href: feature.link,
         className: cn("flex items-center gap-2 text-sm font-medium", feature.linkClassName),
         children: [
-          feature.linkLabel || "Learn more",
+          label,
           /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/chevron-right", size: 16 })
         ]
       }
     );
-  };
+  }, []);
   const featuresContent = React.useMemo(() => {
     if (featuresSlot) return featuresSlot;
     if (!features || features.length === 0) return null;
@@ -981,7 +982,7 @@ function FeaturePatternGridLinks({
       },
       index
     ));
-  }, [featuresSlot, features, cardClassName]);
+  }, [featuresSlot, features, cardClassName, renderFeatureIcon, renderFeatureLink]);
   return /* @__PURE__ */ jsxRuntime.jsx(
     Section,
     {
@@ -990,12 +991,8 @@ function FeaturePatternGridLinks({
       pattern,
       patternOpacity,
       patternClassName,
-      className: cn("bg-muted/30", className),
+      className,
       containerClassName,
-      style: {
-        backgroundImage: `url(${patternUrl})`,
-        backgroundRepeat: "repeat"
-      },
       children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("grid gap-6 md:grid-cols-2 lg:grid-cols-3", gridClassName), children: featuresContent })
     }
   );

package/dist/feature-pattern-grid-links.d.cts

@@ -66,10 +66,6 @@ interface FeaturePatternGridLinksProps {
      * Custom slot for rendering features (overrides features array)
      */
     featuresSlot?: React.ReactNode;
-    /**
-     * Background pattern URL
-     */
-    patternUrl?: string;
     /**
      * Additional CSS classes for the section
      */
@@ -124,6 +120,6 @@ interface FeaturePatternGridLinksProps {
  * />
  * ```
  */
-declare function FeaturePatternGridLinks({ features, featuresSlot, patternUrl, className, containerClassName, gridClassName, cardClassName, background, spacing, pattern, patternOpacity, patternClassName, }: FeaturePatternGridLinksProps): React.JSX.Element;
+declare function FeaturePatternGridLinks({ features, featuresSlot, className, containerClassName, gridClassName, cardClassName, background, spacing, pattern, patternOpacity, patternClassName, }: FeaturePatternGridLinksProps): React.JSX.Element;
 
 export { FeaturePatternGridLinks, type FeaturePatternGridLinksProps };

package/dist/feature-pattern-grid-links.d.ts

@@ -66,10 +66,6 @@ interface FeaturePatternGridLinksProps {
      * Custom slot for rendering features (overrides features array)
      */
     featuresSlot?: React.ReactNode;
-    /**
-     * Background pattern URL
-     */
-    patternUrl?: string;
     /**
      * Additional CSS classes for the section
      */
@@ -124,6 +120,6 @@ interface FeaturePatternGridLinksProps {
  * />
  * ```
  */
-declare function FeaturePatternGridLinks({ features, featuresSlot, patternUrl, className, containerClassName, gridClassName, cardClassName, background, spacing, pattern, patternOpacity, patternClassName, }: FeaturePatternGridLinksProps): React.JSX.Element;
+declare function FeaturePatternGridLinks({ features, featuresSlot, className, containerClassName, gridClassName, cardClassName, background, spacing, pattern, patternOpacity, patternClassName, }: FeaturePatternGridLinksProps): React.JSX.Element;
 
 export { FeaturePatternGridLinks, type FeaturePatternGridLinksProps };

package/dist/feature-pattern-grid-links.js

@@ -1,6 +1,6 @@
 "use client";
 import * as React from 'react';
-import React__default, { useMemo } from 'react';
+import React__default, { useCallback, useMemo } from 'react';
 import { clsx } from 'clsx';
 import { twMerge } from 'tailwind-merge';
 import { jsx, jsxs } from 'react/jsx-runtime';
@@ -533,22 +533,6 @@ var Pressable = React.forwardRef(
   }
 );
 Pressable.displayName = "Pressable";
-
-// lib/patternSvgs.ts
-var patternSvgs = {
-  squareAltGrid: "https://cdn.ing/assets/files/record/286187/4gpn0yq2ptra8iwlvmwwv860ggwv",
-  grid1: "https://cdn.ing/assets/files/record/286186/nbdflpgp4ostrno079hygibsflp3",
-  noise: "https://cdn.ing/assets/i/r/286188/zrqcp9hynh3j7p2laihwzfbujgrl/noise.png",
-  dots: "https://cdn.ing/assets/files/record/286198/yfsjx9thvtxzhl2qtshxyhkrm524",
-  dotPattern: "https://cdn.ing/assets/files/record/286192/7ig0cku8aqbboiza8nuk6hw0nnsr",
-  dotPattern2: "https://cdn.ing/assets/files/record/286189/arez6gd2s7isn9i1o6c7sexdq7bl",
-  circles: "https://cdn.ing/assets/files/record/286190/gtmia3sncjtzetdshc20zf1d3c17",
-  waves: "https://cdn.ing/assets/files/record/286191/mqlb33fzxz9cdth1bx7if0wmpkp1",
-  crossPattern: "https://cdn.ing/assets/files/record/286193/9yfqwdbnqaipbp7fsb3wbzzmq472",
-  architect: "https://cdn.ing/assets/files/record/286194/vgs88ugpvyhxu13wqgy0acvae6re",
-  tinyCheckers: "https://cdn.ing/assets/files/record/286195/65efaknsw8kcpf9o3c2gybytsl5b",
-  p6: "https://cdn.ing/assets/i/r/286196/6kl0rqnd6mjk8j7e525fo8fo0vkc/p6.webp"
-};
 var maxWidthStyles = {
   sm: "max-w-screen-sm",
   md: "max-w-screen-md",
@@ -577,6 +561,22 @@ var Container = React__default.forwardRef(
   }
 );
 Container.displayName = "Container";
+
+// lib/patternSvgs.ts
+var patternSvgs = {
+  squareAltGrid: "https://cdn.ing/assets/files/record/286187/4gpn0yq2ptra8iwlvmwwv860ggwv",
+  grid1: "https://cdn.ing/assets/files/record/286186/nbdflpgp4ostrno079hygibsflp3",
+  noise: "https://cdn.ing/assets/i/r/286188/zrqcp9hynh3j7p2laihwzfbujgrl/noise.png",
+  dots: "https://cdn.ing/assets/files/record/286198/yfsjx9thvtxzhl2qtshxyhkrm524",
+  dotPattern: "https://cdn.ing/assets/files/record/286192/7ig0cku8aqbboiza8nuk6hw0nnsr",
+  dotPattern2: "https://cdn.ing/assets/files/record/286189/arez6gd2s7isn9i1o6c7sexdq7bl",
+  circles: "https://cdn.ing/assets/files/record/286190/gtmia3sncjtzetdshc20zf1d3c17",
+  waves: "https://cdn.ing/assets/files/record/286191/mqlb33fzxz9cdth1bx7if0wmpkp1",
+  crossPattern: "https://cdn.ing/assets/files/record/286193/9yfqwdbnqaipbp7fsb3wbzzmq472",
+  architect: "https://cdn.ing/assets/files/record/286194/vgs88ugpvyhxu13wqgy0acvae6re",
+  tinyCheckers: "https://cdn.ing/assets/files/record/286195/65efaknsw8kcpf9o3c2gybytsl5b",
+  p6: "https://cdn.ing/assets/i/r/286196/6kl0rqnd6mjk8j7e525fo8fo0vkc/p6.webp"
+};
 var maskTop = "radial-gradient(ellipse 70% 60% at 50% 0%, #000 60%, transparent 100%)";
 var maskBottom = "radial-gradient(ellipse 100% 80% at 50% 100%, #000 50%, transparent 90%)";
 var maskCenter = "radial-gradient(ellipse 60% 60% at 50% 50%, #000 30%, transparent 70%)";
@@ -911,7 +911,6 @@ Section.displayName = "Section";
 function FeaturePatternGridLinks({
   features,
   featuresSlot,
-  patternUrl = patternSvgs.dotPattern,
   className,
   containerClassName,
   gridClassName,
@@ -922,26 +921,28 @@ function FeaturePatternGridLinks({
   patternOpacity,
   patternClassName
 }) {
-  const renderFeatureIcon = (feature) => {
+  const renderFeatureIcon = useCallback((feature) => {
     if (feature.icon) return feature.icon;
     if (feature.iconName) return /* @__PURE__ */ jsx(DynamicIcon, { name: feature.iconName, size: 24, className: feature.iconClassName });
     return null;
-  };
-  const renderFeatureLink = (feature) => {
+  }, []);
+  const renderFeatureLink = useCallback((feature) => {
     if (feature.linkSlot) return feature.linkSlot;
-    if (!feature.link) return null;
+    if (!feature.link && !feature.linkLabel) return null;
+    const label = feature.linkLabel || (feature.link ? "Learn more" : null);
+    if (!label) return null;
     return /* @__PURE__ */ jsxs(
       Pressable,
       {
         href: feature.link,
         className: cn("flex items-center gap-2 text-sm font-medium", feature.linkClassName),
         children: [
-          feature.linkLabel || "Learn more",
+          label,
           /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/chevron-right", size: 16 })
         ]
       }
     );
-  };
+  }, []);
   const featuresContent = useMemo(() => {
     if (featuresSlot) return featuresSlot;
     if (!features || features.length === 0) return null;
@@ -960,7 +961,7 @@ function FeaturePatternGridLinks({
       },
       index
     ));
-  }, [featuresSlot, features, cardClassName]);
+  }, [featuresSlot, features, cardClassName, renderFeatureIcon, renderFeatureLink]);
   return /* @__PURE__ */ jsx(
     Section,
     {
@@ -969,12 +970,8 @@ function FeaturePatternGridLinks({
       pattern,
       patternOpacity,
       patternClassName,
-      className: cn("bg-muted/30", className),
+      className,
       containerClassName,
-      style: {
-        backgroundImage: `url(${patternUrl})`,
-        backgroundRepeat: "repeat"
-      },
       children: /* @__PURE__ */ jsx("div", { className: cn("grid gap-6 md:grid-cols-2 lg:grid-cols-3", gridClassName), children: featuresContent })
     }
   );