@opensite/ui 0.8.6 → 0.8.7

package/dist/hero-welcome-asymmetric-images.cjs

@@ -918,8 +918,44 @@ function HeroWelcomeAsymmetricImages({
       className: cn(className),
       children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("container", containerClassName), children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-start justify-between gap-8 md:flex-row xl:gap-20", children: [
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex w-full flex-col items-start text-left", children: [
-          heading && (typeof heading === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h1", { className: cn("mb-8 text-4xl font-normal text-pretty md:text-7xl", headingClassName), children: heading }) : /* @__PURE__ */ jsxRuntime.jsx("h1", { className: cn("mb-8 text-4xl font-normal text-pretty md:text-7xl", headingClassName), children: heading })),
-          description && (typeof description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("mb-12 max-w-[70%] text-xl font-normal text-muted-foreground", descriptionClassName), children: description }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("mb-12 max-w-[70%] text-xl font-normal text-muted-foreground", descriptionClassName), children: description })),
+          heading && (typeof heading === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
+            "h1",
+            {
+              className: cn(
+                "mb-8 text-4xl font-normal text-pretty md:text-7xl",
+                headingClassName
+              ),
+              children: heading
+            }
+          ) : /* @__PURE__ */ jsxRuntime.jsx(
+            "h1",
+            {
+              className: cn(
+                "mb-8 text-4xl font-normal text-pretty md:text-7xl",
+                headingClassName
+              ),
+              children: heading
+            }
+          )),
+          description && (typeof description === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
+            "p",
+            {
+              className: cn(
+                "mb-12 max-w-[70%] text-xl font-normal text-muted-foreground",
+                descriptionClassName
+              ),
+              children: description
+            }
+          ) : /* @__PURE__ */ jsxRuntime.jsx(
+            "div",
+            {
+              className: cn(
+                "mb-12 max-w-[70%] text-xl font-normal text-muted-foreground",
+                descriptionClassName
+              ),
+              children: description
+            }
+          )),
           renderActions
         ] }),
         renderImages

package/dist/hero-welcome-asymmetric-images.js

@@ -897,8 +897,44 @@ function HeroWelcomeAsymmetricImages({
       className: cn(className),
       children: /* @__PURE__ */ jsx("div", { className: cn("container", containerClassName), children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-start justify-between gap-8 md:flex-row xl:gap-20", children: [
         /* @__PURE__ */ jsxs("div", { className: "flex w-full flex-col items-start text-left", children: [
-          heading && (typeof heading === "string" ? /* @__PURE__ */ jsx("h1", { className: cn("mb-8 text-4xl font-normal text-pretty md:text-7xl", headingClassName), children: heading }) : /* @__PURE__ */ jsx("h1", { className: cn("mb-8 text-4xl font-normal text-pretty md:text-7xl", headingClassName), children: heading })),
-          description && (typeof description === "string" ? /* @__PURE__ */ jsx("p", { className: cn("mb-12 max-w-[70%] text-xl font-normal text-muted-foreground", descriptionClassName), children: description }) : /* @__PURE__ */ jsx("div", { className: cn("mb-12 max-w-[70%] text-xl font-normal text-muted-foreground", descriptionClassName), children: description })),
+          heading && (typeof heading === "string" ? /* @__PURE__ */ jsx(
+            "h1",
+            {
+              className: cn(
+                "mb-8 text-4xl font-normal text-pretty md:text-7xl",
+                headingClassName
+              ),
+              children: heading
+            }
+          ) : /* @__PURE__ */ jsx(
+            "h1",
+            {
+              className: cn(
+                "mb-8 text-4xl font-normal text-pretty md:text-7xl",
+                headingClassName
+              ),
+              children: heading
+            }
+          )),
+          description && (typeof description === "string" ? /* @__PURE__ */ jsx(
+            "p",
+            {
+              className: cn(
+                "mb-12 max-w-[70%] text-xl font-normal text-muted-foreground",
+                descriptionClassName
+              ),
+              children: description
+            }
+          ) : /* @__PURE__ */ jsx(
+            "div",
+            {
+              className: cn(
+                "mb-12 max-w-[70%] text-xl font-normal text-muted-foreground",
+                descriptionClassName
+              ),
+              children: description
+            }
+          )),
           renderActions
         ] }),
         renderImages

package/dist/image-slider.cjs

@@ -159,7 +159,6 @@ var ImageSlider = ({
               img.Img,
               {
                 src: activeImage.src,
-                mediaId: activeImage.mediaId,
                 alt: activeImage.alt,
                 className: cn(
                   "h-full w-full object-cover object-center",
@@ -171,7 +170,7 @@ var ImageSlider = ({
               }
             )
           },
-          `${currentIndex}-${activeImage.src ?? activeImage.mediaId ?? "image"}`
+          `${currentIndex}-${activeImage.src ?? "image"}`
         ) : null }),
         overlayContent,
         children ? /* @__PURE__ */ jsxRuntime.jsx(

package/dist/image-slider.d.cts

@@ -15,10 +15,6 @@ interface ImageSliderImage {
      * Alt text for accessibility
      */
     alt: string;
-    /**
-     * Optional legacy media ID for the image component
-     */
-    mediaId?: number;
     /**
      * Additional CSS classes for the image
      */

package/dist/image-slider.d.ts

@@ -15,10 +15,6 @@ interface ImageSliderImage {
      * Alt text for accessibility
      */
     alt: string;
-    /**
-     * Optional legacy media ID for the image component
-     */
-    mediaId?: number;
     /**
      * Additional CSS classes for the image
      */

package/dist/image-slider.js

@@ -137,7 +137,6 @@ var ImageSlider = ({
               Img,
               {
                 src: activeImage.src,
-                mediaId: activeImage.mediaId,
                 alt: activeImage.alt,
                 className: cn(
                   "h-full w-full object-cover object-center",
@@ -149,7 +148,7 @@ var ImageSlider = ({
               }
             )
           },
-          `${currentIndex}-${activeImage.src ?? activeImage.mediaId ?? "image"}`
+          `${currentIndex}-${activeImage.src ?? "image"}`
         ) : null }),
         overlayContent,
         children ? /* @__PURE__ */ jsx(

package/dist/index.cjs

@@ -830,7 +830,6 @@ var ImageSlider = ({
               img.Img,
               {
                 src: activeImage.src,
-                mediaId: activeImage.mediaId,
                 alt: activeImage.alt,
                 className: cn(
                   "h-full w-full object-cover object-center",
@@ -842,7 +841,7 @@ var ImageSlider = ({
               }
             )
           },
-          `${currentIndex}-${activeImage.src ?? activeImage.mediaId ?? "image"}`
+          `${currentIndex}-${activeImage.src ?? "image"}`
         ) : null }),
         overlayContent,
         children ? /* @__PURE__ */ jsxRuntime.jsx(
@@ -1683,13 +1682,13 @@ function AboutSplitHero({
   const bgColorClass = React4.useMemo(() => {
     switch (background) {
       case "dark":
-        return "bg-gray-900 text-white";
+        return "bg-foreground text-background";
       case "gray":
-        return "bg-gray-100 text-gray-900";
+        return "bg-muted";
       case "white":
-        return "bg-white text-gray-900";
+        return "bg-background";
       default:
-        return "bg-background text-foreground";
+        return "bg-background";
     }
   }, [background]);
   const desktopOrder = directionConfig.desktop === "mediaRight" ? "lg:flex-row" : "lg:flex-row-reverse";
@@ -1941,7 +1940,7 @@ function AboutMissionPrinciples({
                   "p",
                   {
                     className: cn(
-                      "mb-4 text-foreground/80",
+                      "mb-4 text-muted-foreground",
                       visionDescriptionClassName
                     ),
                     children: visionDescription
@@ -3025,7 +3024,7 @@ function FooterSimpleCentered({
         {
           href: link.href,
           className: cn(
-            "text-sm text-muted-foreground transition-colors hover:text-foreground",
+            "text-sm text-muted-foreground transition-colors hover:text-primary",
             sitemapLinkClassName
           ),
           children: link.label
@@ -3042,7 +3041,7 @@ function FooterSimpleCentered({
         {
           href: link.href,
           className: cn(
-            "text-sm text-muted-foreground transition-colors hover:text-foreground",
+            "text-sm text-muted-foreground transition-colors hover:text-primary",
             bottomLinkClassName
           ),
           children: link.text
@@ -3481,7 +3480,7 @@ function FooterCtaBanner({
               {
                 href: social.href,
                 "aria-label": social.label,
-                className: cn("text-muted-foreground transition-colors hover:text-foreground", socialLinkClassName),
+                className: cn("text-muted-foreground transition-colors hover:text-primary", socialLinkClassName),
                 children: /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: social.icon, size: 20 })
               }
             ) }, idx)) })
@@ -3492,7 +3491,7 @@ function FooterCtaBanner({
               Pressable,
               {
                 href: link.href,
-                className: cn("hover:text-foreground", navLinkClassName),
+                className: cn("hover:text-primary", navLinkClassName),
                 children: link.name
               }
             ) }, linkIdx)) })
@@ -3505,14 +3504,14 @@ function FooterCtaBanner({
               Pressable,
               {
                 href: attributionHref,
-                className: "hover:text-foreground",
+                className: "hover:text-primary",
                 target: "_blank",
                 rel: "noopener noreferrer",
                 children: attributionText
               }
             )
           ] }),
-          /* @__PURE__ */ jsxRuntime.jsx("ul", { className: cn("flex gap-4", legalLinksClassName), children: legalLinks?.map((link, idx) => /* @__PURE__ */ jsxRuntime.jsx("li", { children: /* @__PURE__ */ jsxRuntime.jsx(Pressable, { href: link.href, className: cn("hover:text-foreground", legalLinkClassName), children: link.name }) }, idx)) })
+          /* @__PURE__ */ jsxRuntime.jsx("ul", { className: cn("flex gap-4", legalLinksClassName), children: legalLinks?.map((link, idx) => /* @__PURE__ */ jsxRuntime.jsx("li", { children: /* @__PURE__ */ jsxRuntime.jsx(Pressable, { href: link.href, className: cn("hover:text-primary", legalLinkClassName), children: link.name }) }, idx)) })
         ] })
       ] }) })
     }
@@ -3848,7 +3847,7 @@ function FooterAnimatedSocial({
           Pressable,
           {
             href: link.href,
-            className: cn("group flex items-center gap-2 py-2 text-foreground transition-colors hover:text-foreground/80", socialLinkClassName),
+            className: cn("group flex items-center gap-2 py-2 transition-colors hover:text-muted-foreground", socialLinkClassName),
             children: [
               /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xl font-medium", children: link.name }),
               /* @__PURE__ */ jsxRuntime.jsx(
@@ -3886,7 +3885,7 @@ function FooterAnimatedSocial({
             children: [
               /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("space-y-8", leftColumnClassName), children: [
                 /* @__PURE__ */ jsxRuntime.jsxs(framerMotion.motion.div, { variants: itemVariants, className: "space-y-6", children: [
-                  /* @__PURE__ */ jsxRuntime.jsx("h2", { className: cn("text-4xl leading-tight font-bold text-foreground lg:text-5xl", headingClassName), children: heading }),
+                  /* @__PURE__ */ jsxRuntime.jsx("h2", { className: cn("text-4xl leading-tight font-bold lg:text-5xl", headingClassName), children: heading }),
                   /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("max-w-md text-lg leading-relaxed text-muted-foreground", descriptionClassName), children: description })
                 ] }),
                 ctaUrl && ctaText && /* @__PURE__ */ jsxRuntime.jsx(framerMotion.motion.div, { variants: itemVariants, children: /* @__PURE__ */ jsxRuntime.jsx(
@@ -3923,7 +3922,7 @@ function FooterAnimatedSocial({
                       framerMotion.motion.a,
                       {
                         href: attributionHref,
-                        className: "underline underline-offset-4 transition-colors hover:text-foreground",
+                        className: "underline underline-offset-4 transition-colors hover:text-primary",
                         whileHover: { scale: 1.05 },
                         transition: {
                           type: "spring",
@@ -4114,7 +4113,7 @@ function FooterNewsletterMinimal({
       Pressable,
       {
         href: item.href,
-        className: cn("tracking-tight text-foreground hover:text-foreground/30", navLinkClassName),
+        className: cn("tracking-tight hover:text-muted-foreground", navLinkClassName),
         children: item.label
       }
     ) }, idx));
@@ -4125,7 +4124,7 @@ function FooterNewsletterMinimal({
       Pressable,
       {
         href: item.href,
-        className: cn("group flex items-center gap-1 tracking-tight text-foreground hover:text-foreground/30", socialLinkClassName),
+        className: cn("group flex items-center gap-1 tracking-tight hover:text-muted-foreground", socialLinkClassName),
         children: [
           item.label,
           " ",
@@ -4134,7 +4133,7 @@ function FooterNewsletterMinimal({
             {
               name: "lucide/arrow-up-right",
               size: 14,
-              className: "text-foreground group-hover:text-muted-foreground/50"
+              className: "group-hover:text-muted-foreground/50"
             }
           )
         ]
@@ -4147,7 +4146,7 @@ function FooterNewsletterMinimal({
       Pressable,
       {
         href: item.href,
-        className: cn("group flex items-center gap-1 tracking-tight text-foreground hover:text-foreground/30", footerLinkClassName),
+        className: cn("group flex items-center gap-1 tracking-tight hover:text-muted-foreground", footerLinkClassName),
         children: item.label
       }
     ) }, item.label));
@@ -4273,7 +4272,7 @@ function FooterNewsletterMinimal({
             Pressable,
             {
               href: attributionHref,
-              className: "mt-2 inline-block hover:text-foreground",
+              className: "mt-2 inline-block hover:text-primary",
               target: "_blank",
               rel: "noopener noreferrer",
               children: attributionText
@@ -4369,7 +4368,7 @@ function FooterCtaSocial({
           Pressable,
           {
             href: `mailto:${email}`,
-            className: "transition-colors hover:text-foreground",
+            className: "transition-colors hover:text-primary",
             children: email
           }
         ) }),
@@ -4379,7 +4378,7 @@ function FooterCtaSocial({
             Pressable,
             {
               href: attributionHref,
-              className: "mt-2 inline-block hover:text-foreground",
+              className: "mt-2 inline-block hover:text-primary",
               target: "_blank",
               rel: "noopener noreferrer",
               children: attributionText

package/dist/index.js

@@ -807,7 +807,6 @@ var ImageSlider = ({
               Img,
               {
                 src: activeImage.src,
-                mediaId: activeImage.mediaId,
                 alt: activeImage.alt,
                 className: cn(
                   "h-full w-full object-cover object-center",
@@ -819,7 +818,7 @@ var ImageSlider = ({
               }
             )
           },
-          `${currentIndex}-${activeImage.src ?? activeImage.mediaId ?? "image"}`
+          `${currentIndex}-${activeImage.src ?? "image"}`
         ) : null }),
         overlayContent,
         children ? /* @__PURE__ */ jsx(
@@ -1660,13 +1659,13 @@ function AboutSplitHero({
   const bgColorClass = useMemo(() => {
     switch (background) {
       case "dark":
-        return "bg-gray-900 text-white";
+        return "bg-foreground text-background";
       case "gray":
-        return "bg-gray-100 text-gray-900";
+        return "bg-muted";
       case "white":
-        return "bg-white text-gray-900";
+        return "bg-background";
       default:
-        return "bg-background text-foreground";
+        return "bg-background";
     }
   }, [background]);
   const desktopOrder = directionConfig.desktop === "mediaRight" ? "lg:flex-row" : "lg:flex-row-reverse";
@@ -1918,7 +1917,7 @@ function AboutMissionPrinciples({
                   "p",
                   {
                     className: cn(
-                      "mb-4 text-foreground/80",
+                      "mb-4 text-muted-foreground",
                       visionDescriptionClassName
                     ),
                     children: visionDescription
@@ -3002,7 +3001,7 @@ function FooterSimpleCentered({
         {
           href: link.href,
           className: cn(
-            "text-sm text-muted-foreground transition-colors hover:text-foreground",
+            "text-sm text-muted-foreground transition-colors hover:text-primary",
             sitemapLinkClassName
           ),
           children: link.label
@@ -3019,7 +3018,7 @@ function FooterSimpleCentered({
         {
           href: link.href,
           className: cn(
-            "text-sm text-muted-foreground transition-colors hover:text-foreground",
+            "text-sm text-muted-foreground transition-colors hover:text-primary",
             bottomLinkClassName
           ),
           children: link.text
@@ -3458,7 +3457,7 @@ function FooterCtaBanner({
               {
                 href: social.href,
                 "aria-label": social.label,
-                className: cn("text-muted-foreground transition-colors hover:text-foreground", socialLinkClassName),
+                className: cn("text-muted-foreground transition-colors hover:text-primary", socialLinkClassName),
                 children: /* @__PURE__ */ jsx(DynamicIcon, { name: social.icon, size: 20 })
               }
             ) }, idx)) })
@@ -3469,7 +3468,7 @@ function FooterCtaBanner({
               Pressable,
               {
                 href: link.href,
-                className: cn("hover:text-foreground", navLinkClassName),
+                className: cn("hover:text-primary", navLinkClassName),
                 children: link.name
               }
             ) }, linkIdx)) })
@@ -3482,14 +3481,14 @@ function FooterCtaBanner({
               Pressable,
               {
                 href: attributionHref,
-                className: "hover:text-foreground",
+                className: "hover:text-primary",
                 target: "_blank",
                 rel: "noopener noreferrer",
                 children: attributionText
               }
             )
           ] }),
-          /* @__PURE__ */ jsx("ul", { className: cn("flex gap-4", legalLinksClassName), children: legalLinks?.map((link, idx) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(Pressable, { href: link.href, className: cn("hover:text-foreground", legalLinkClassName), children: link.name }) }, idx)) })
+          /* @__PURE__ */ jsx("ul", { className: cn("flex gap-4", legalLinksClassName), children: legalLinks?.map((link, idx) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(Pressable, { href: link.href, className: cn("hover:text-primary", legalLinkClassName), children: link.name }) }, idx)) })
         ] })
       ] }) })
     }
@@ -3825,7 +3824,7 @@ function FooterAnimatedSocial({
           Pressable,
           {
             href: link.href,
-            className: cn("group flex items-center gap-2 py-2 text-foreground transition-colors hover:text-foreground/80", socialLinkClassName),
+            className: cn("group flex items-center gap-2 py-2 transition-colors hover:text-muted-foreground", socialLinkClassName),
             children: [
               /* @__PURE__ */ jsx("span", { className: "text-xl font-medium", children: link.name }),
               /* @__PURE__ */ jsx(
@@ -3863,7 +3862,7 @@ function FooterAnimatedSocial({
             children: [
               /* @__PURE__ */ jsxs("div", { className: cn("space-y-8", leftColumnClassName), children: [
                 /* @__PURE__ */ jsxs(motion.div, { variants: itemVariants, className: "space-y-6", children: [
-                  /* @__PURE__ */ jsx("h2", { className: cn("text-4xl leading-tight font-bold text-foreground lg:text-5xl", headingClassName), children: heading }),
+                  /* @__PURE__ */ jsx("h2", { className: cn("text-4xl leading-tight font-bold lg:text-5xl", headingClassName), children: heading }),
                   /* @__PURE__ */ jsx("p", { className: cn("max-w-md text-lg leading-relaxed text-muted-foreground", descriptionClassName), children: description })
                 ] }),
                 ctaUrl && ctaText && /* @__PURE__ */ jsx(motion.div, { variants: itemVariants, children: /* @__PURE__ */ jsx(
@@ -3900,7 +3899,7 @@ function FooterAnimatedSocial({
                       motion.a,
                       {
                         href: attributionHref,
-                        className: "underline underline-offset-4 transition-colors hover:text-foreground",
+                        className: "underline underline-offset-4 transition-colors hover:text-primary",
                         whileHover: { scale: 1.05 },
                         transition: {
                           type: "spring",
@@ -4091,7 +4090,7 @@ function FooterNewsletterMinimal({
       Pressable,
       {
         href: item.href,
-        className: cn("tracking-tight text-foreground hover:text-foreground/30", navLinkClassName),
+        className: cn("tracking-tight hover:text-muted-foreground", navLinkClassName),
         children: item.label
       }
     ) }, idx));
@@ -4102,7 +4101,7 @@ function FooterNewsletterMinimal({
       Pressable,
       {
         href: item.href,
-        className: cn("group flex items-center gap-1 tracking-tight text-foreground hover:text-foreground/30", socialLinkClassName),
+        className: cn("group flex items-center gap-1 tracking-tight hover:text-muted-foreground", socialLinkClassName),
         children: [
           item.label,
           " ",
@@ -4111,7 +4110,7 @@ function FooterNewsletterMinimal({
             {
               name: "lucide/arrow-up-right",
               size: 14,
-              className: "text-foreground group-hover:text-muted-foreground/50"
+              className: "group-hover:text-muted-foreground/50"
             }
           )
         ]
@@ -4124,7 +4123,7 @@ function FooterNewsletterMinimal({
       Pressable,
       {
         href: item.href,
-        className: cn("group flex items-center gap-1 tracking-tight text-foreground hover:text-foreground/30", footerLinkClassName),
+        className: cn("group flex items-center gap-1 tracking-tight hover:text-muted-foreground", footerLinkClassName),
         children: item.label
       }
     ) }, item.label));
@@ -4250,7 +4249,7 @@ function FooterNewsletterMinimal({
             Pressable,
             {
               href: attributionHref,
-              className: "mt-2 inline-block hover:text-foreground",
+              className: "mt-2 inline-block hover:text-primary",
               target: "_blank",
               rel: "noopener noreferrer",
               children: attributionText
@@ -4346,7 +4345,7 @@ function FooterCtaSocial({
           Pressable,
           {
             href: `mailto:${email}`,
-            className: "transition-colors hover:text-foreground",
+            className: "transition-colors hover:text-primary",
             children: email
           }
         ) }),
@@ -4356,7 +4355,7 @@ function FooterCtaSocial({
             Pressable,
             {
               href: attributionHref,
-              className: "mt-2 inline-block hover:text-foreground",
+              className: "mt-2 inline-block hover:text-primary",
               target: "_blank",
               rel: "noopener noreferrer",
               children: attributionText

package/dist/industries-badge-list-bordered.cjs

@@ -439,7 +439,7 @@ function IndustriesBadgeListBordered({
   servicesClassName,
   itemClassName,
   background,
-  spacing,
+  spacing = "py-6 md:py-32",
   pattern,
   patternOpacity,
   patternClassName,
@@ -453,7 +453,7 @@ function IndustriesBadgeListBordered({
       {
         variant: "outline",
         className: cn(
-          "mb-4 rounded-none border-0 bg-muted p-2 text-primary uppercase",
+          "mb-4 rounded-none border-0 bg-muted p-2  uppercase",
           badgeClassName
         ),
         children: badge
@@ -486,7 +486,7 @@ function IndustriesBadgeListBordered({
           service.className
         ),
         children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-1 items-start gap-4 md:grid-cols-12 md:items-center md:gap-8", children: [
-          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "order-2 md:order-0 md:col-span-4", children: /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-lg font-semibold text-foreground md:text-xl", children: service.title }) }),
+          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "order-2 md:order-0 md:col-span-4", children: /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-lg font-semibold  md:text-xl", children: service.title }) }),
           /* @__PURE__ */ jsxRuntime.jsx("div", { className: "order-1 md:order-0 md:col-span-2 md:flex md:justify-center", children: /* @__PURE__ */ jsxRuntime.jsx(
             img.Img,
             {
@@ -497,12 +497,18 @@ function IndustriesBadgeListBordered({
               optixFlowConfig
             }
           ) }),
-          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "order-3 md:order-0 md:col-span-6", children: /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm leading-relaxed text-muted-foreground", children: service.description }) })
+          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "order-3 md:order-0 md:col-span-6", children: /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm leading-relaxed ", children: service.description }) })
         ] })
       },
       index
     )) });
-  }, [servicesSlot, services, servicesClassName, itemClassName, optixFlowConfig]);
+  }, [
+    servicesSlot,
+    services,
+    servicesClassName,
+    itemClassName,
+    optixFlowConfig
+  ]);
   return /* @__PURE__ */ jsxRuntime.jsx(
     Section,
     {
@@ -513,7 +519,7 @@ function IndustriesBadgeListBordered({
       patternOpacity,
       patternClassName,
       children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: containerClassName, children: [
-        (badgeSlot || badge || headingSlot || heading) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("mb-16", headerClassName), children: [
+        (badgeSlot || badge || headingSlot || heading) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("mb-6 md:mb-16", headerClassName), children: [
           renderBadge,
           renderHeading
         ] }),

package/dist/industries-badge-list-bordered.js

@@ -433,7 +433,7 @@ function IndustriesBadgeListBordered({
   servicesClassName,
   itemClassName,
   background,
-  spacing,
+  spacing = "py-6 md:py-32",
   pattern,
   patternOpacity,
   patternClassName,
@@ -447,7 +447,7 @@ function IndustriesBadgeListBordered({
       {
         variant: "outline",
         className: cn(
-          "mb-4 rounded-none border-0 bg-muted p-2 text-primary uppercase",
+          "mb-4 rounded-none border-0 bg-muted p-2  uppercase",
           badgeClassName
         ),
         children: badge
@@ -480,7 +480,7 @@ function IndustriesBadgeListBordered({
           service.className
         ),
         children: /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-1 items-start gap-4 md:grid-cols-12 md:items-center md:gap-8", children: [
-          /* @__PURE__ */ jsx("div", { className: "order-2 md:order-0 md:col-span-4", children: /* @__PURE__ */ jsx("h3", { className: "text-lg font-semibold text-foreground md:text-xl", children: service.title }) }),
+          /* @__PURE__ */ jsx("div", { className: "order-2 md:order-0 md:col-span-4", children: /* @__PURE__ */ jsx("h3", { className: "text-lg font-semibold  md:text-xl", children: service.title }) }),
           /* @__PURE__ */ jsx("div", { className: "order-1 md:order-0 md:col-span-2 md:flex md:justify-center", children: /* @__PURE__ */ jsx(
             Img,
             {
@@ -491,12 +491,18 @@ function IndustriesBadgeListBordered({
               optixFlowConfig
             }
           ) }),
-          /* @__PURE__ */ jsx("div", { className: "order-3 md:order-0 md:col-span-6", children: /* @__PURE__ */ jsx("p", { className: "text-sm leading-relaxed text-muted-foreground", children: service.description }) })
+          /* @__PURE__ */ jsx("div", { className: "order-3 md:order-0 md:col-span-6", children: /* @__PURE__ */ jsx("p", { className: "text-sm leading-relaxed ", children: service.description }) })
         ] })
       },
       index
     )) });
-  }, [servicesSlot, services, servicesClassName, itemClassName, optixFlowConfig]);
+  }, [
+    servicesSlot,
+    services,
+    servicesClassName,
+    itemClassName,
+    optixFlowConfig
+  ]);
   return /* @__PURE__ */ jsx(
     Section,
     {
@@ -507,7 +513,7 @@ function IndustriesBadgeListBordered({
       patternOpacity,
       patternClassName,
       children: /* @__PURE__ */ jsxs("div", { className: containerClassName, children: [
-        (badgeSlot || badge || headingSlot || heading) && /* @__PURE__ */ jsxs("div", { className: cn("mb-16", headerClassName), children: [
+        (badgeSlot || badge || headingSlot || heading) && /* @__PURE__ */ jsxs("div", { className: cn("mb-6 md:mb-16", headerClassName), children: [
           renderBadge,
           renderHeading
         ] }),