@opensite/ui 0.8.9 → 0.9.0

package/dist/feature-checklist-image.js

@@ -11,6 +11,32 @@ import { Img } from '@page-speed/img';
 function cn(...inputs) {
   return twMerge(clsx(inputs));
 }
+function getTextColor(parentBg, variant = "default", options) {
+  const isDark = parentBg === "dark" || parentBg === "secondary" || parentBg === "primary";
+  if (isDark) {
+    switch (variant) {
+      case "default":
+        return "text-foreground";
+      case "muted":
+        return "text-foreground/80";
+      case "subtle":
+        return "text-foreground/60";
+      case "accent":
+        return "text-accent-foreground";
+    }
+  } else {
+    switch (variant) {
+      case "default":
+        return "text-foreground";
+      case "muted":
+        return "text-muted-foreground";
+      case "subtle":
+        return "text-muted-foreground/70";
+      case "accent":
+        return "text-primary";
+    }
+  }
+}
 function normalizePhoneNumber(input) {
   const trimmed = input.trim();
   if (trimmed.toLowerCase().startsWith("tel:")) {
@@ -1056,7 +1082,8 @@ function FeatureChecklistImage({
                 "p",
                 {
                   className: cn(
-                    "mt-1 text-muted-foreground md:mt-6",
+                    "mt-1 md:mt-6",
+                    getTextColor(background, "muted"),
                     descriptionClassName
                   ),
                   children: description
@@ -1065,7 +1092,8 @@ function FeatureChecklistImage({
                 "div",
                 {
                   className: cn(
-                    "mt-1 text-muted-foreground md:mt-6",
+                    "mt-1 md:mt-6",
+                    getTextColor(background, "muted"),
                     descriptionClassName
                   ),
                   children: description

package/dist/feature-checklist-three-column.cjs

@@ -33,6 +33,36 @@ var React__namespace = /*#__PURE__*/_interopNamespace(React);
 function cn(...inputs) {
   return tailwindMerge.twMerge(clsx.clsx(inputs));
 }
+function getTextColor(parentBg, variant = "default", options) {
+  const isDark = parentBg === "dark" || parentBg === "secondary" || parentBg === "primary";
+  if (isDark) {
+    switch (variant) {
+      case "default":
+        return "text-foreground";
+      case "muted":
+        return "text-foreground/80";
+      case "subtle":
+        return "text-foreground/60";
+      case "accent":
+        return "text-accent-foreground";
+    }
+  } else {
+    switch (variant) {
+      case "default":
+        return "text-foreground";
+      case "muted":
+        return "text-muted-foreground";
+      case "subtle":
+        return "text-muted-foreground/70";
+      case "accent":
+        return "text-primary";
+    }
+  }
+}
+function getAccentColor(parentBg, options) {
+  const isDark = parentBg === "dark" || parentBg === "secondary" || parentBg === "primary";
+  return isDark ? "text-accent-foreground" : "text-primary";
+}
 var svgCache = /* @__PURE__ */ new Map();
 function DynamicIcon({
   name,
@@ -996,8 +1026,8 @@ function FeatureChecklistThreeColumn({
   const renderChecklistColumn = React.useCallback((items, slot, gapClass) => {
     if (slot) return slot;
     if (!items || items.length === 0) return null;
-    return /* @__PURE__ */ jsxRuntime.jsx("ul", { className: cn("flex flex-col text-muted-foreground", gapClass, checklistClassName), children: items.map((item, index) => /* @__PURE__ */ jsxRuntime.jsxs("li", { className: cn("flex items-center gap-2", getCheckItemClassName(item)), children: [
-      /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/check", size: 16, className: "text-primary" }),
+    return /* @__PURE__ */ jsxRuntime.jsx("ul", { className: cn("flex flex-col", getTextColor(background, "muted"), gapClass, checklistClassName), children: items.map((item, index) => /* @__PURE__ */ jsxRuntime.jsxs("li", { className: cn("flex items-center gap-2", getCheckItemClassName(item)), children: [
+      /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/check", size: 16, className: getAccentColor(background) }),
       getCheckItemContent(item)
     ] }, index)) });
   }, [checklistClassName, getCheckItemContent, getCheckItemClassName]);
@@ -1050,17 +1080,17 @@ function FeatureChecklistThreeColumn({
       /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mb-3 px-4 pt-5 sm:px-5 md:px-6 md:pt-6", children: [
           card.title && (typeof card.title === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h3", { className: cn("font-medium", card.titleClassName), children: card.title }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("font-medium", card.titleClassName), children: card.title })),
-          card.description && (typeof card.description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("text-muted-foreground", card.descriptionClassName), children: card.description }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("text-muted-foreground", card.descriptionClassName), children: card.description }))
+          card.description && (typeof card.description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn(getTextColor(background, "muted"), card.descriptionClassName), children: card.description }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn(getTextColor(background, "muted"), card.descriptionClassName), children: card.description }))
         ] }),
         /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-px border-t border-dashed" }),
-        /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "text-muted-foreground", children: card.checklistItems?.map((item, itemIndex) => /* @__PURE__ */ jsxRuntime.jsxs(React__namespace.Fragment, { children: [
+        /* @__PURE__ */ jsxRuntime.jsx("ul", { className: getTextColor(background, "muted"), children: card.checklistItems?.map((item, itemIndex) => /* @__PURE__ */ jsxRuntime.jsxs(React__namespace.Fragment, { children: [
           /* @__PURE__ */ jsxRuntime.jsxs("li", { className: cn("flex items-start gap-2 px-4 py-3 sm:px-5 md:px-6", getCheckItemClassName(item)), children: [
             /* @__PURE__ */ jsxRuntime.jsx(
               DynamicIcon,
               {
                 name: "lucide/check",
                 size: 16,
-                className: "mt-1 shrink-0 text-primary"
+                className: cn("mt-1 shrink-0", getAccentColor(background))
               }
             ),
             getCheckItemContent(item)

package/dist/feature-checklist-three-column.d.cts

@@ -1,9 +1,9 @@
 import * as React from 'react';
-import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-Bz_A5vLU.cjs';
-import { O as OptixFlowConfig } from './blocks-Cohq4eio.cjs';
+import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-CPyEa7IX.cjs';
+import { O as OptixFlowConfig } from './blocks-tmd_MRJv.cjs';
 import 'react/jsx-runtime';
 import 'class-variance-authority';
-import './button-variants-lRElsmTc.cjs';
+import './button-variants-8mtEHxev.cjs';
 import 'class-variance-authority/types';
 
 interface FeatureChecklistThreeColumnCheckItem {

package/dist/feature-checklist-three-column.d.ts

@@ -1,9 +1,9 @@
 import * as React from 'react';
-import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-Bi_ClKrO.js';
-import { O as OptixFlowConfig } from './blocks-k17uluAz.js';
+import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-hxnFe3w6.js';
+import { O as OptixFlowConfig } from './blocks-DRE-f6cS.js';
 import 'react/jsx-runtime';
 import 'class-variance-authority';
-import './button-variants-lRElsmTc.js';
+import './button-variants-8mtEHxev.js';
 import 'class-variance-authority/types';
 
 interface FeatureChecklistThreeColumnCheckItem {

package/dist/feature-checklist-three-column.js

@@ -12,6 +12,36 @@ import { Img } from '@page-speed/img';
 function cn(...inputs) {
   return twMerge(clsx(inputs));
 }
+function getTextColor(parentBg, variant = "default", options) {
+  const isDark = parentBg === "dark" || parentBg === "secondary" || parentBg === "primary";
+  if (isDark) {
+    switch (variant) {
+      case "default":
+        return "text-foreground";
+      case "muted":
+        return "text-foreground/80";
+      case "subtle":
+        return "text-foreground/60";
+      case "accent":
+        return "text-accent-foreground";
+    }
+  } else {
+    switch (variant) {
+      case "default":
+        return "text-foreground";
+      case "muted":
+        return "text-muted-foreground";
+      case "subtle":
+        return "text-muted-foreground/70";
+      case "accent":
+        return "text-primary";
+    }
+  }
+}
+function getAccentColor(parentBg, options) {
+  const isDark = parentBg === "dark" || parentBg === "secondary" || parentBg === "primary";
+  return isDark ? "text-accent-foreground" : "text-primary";
+}
 var svgCache = /* @__PURE__ */ new Map();
 function DynamicIcon({
   name,
@@ -975,8 +1005,8 @@ function FeatureChecklistThreeColumn({
   const renderChecklistColumn = useCallback((items, slot, gapClass) => {
     if (slot) return slot;
     if (!items || items.length === 0) return null;
-    return /* @__PURE__ */ jsx("ul", { className: cn("flex flex-col text-muted-foreground", gapClass, checklistClassName), children: items.map((item, index) => /* @__PURE__ */ jsxs("li", { className: cn("flex items-center gap-2", getCheckItemClassName(item)), children: [
-      /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/check", size: 16, className: "text-primary" }),
+    return /* @__PURE__ */ jsx("ul", { className: cn("flex flex-col", getTextColor(background, "muted"), gapClass, checklistClassName), children: items.map((item, index) => /* @__PURE__ */ jsxs("li", { className: cn("flex items-center gap-2", getCheckItemClassName(item)), children: [
+      /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/check", size: 16, className: getAccentColor(background) }),
       getCheckItemContent(item)
     ] }, index)) });
   }, [checklistClassName, getCheckItemContent, getCheckItemClassName]);
@@ -1029,17 +1059,17 @@ function FeatureChecklistThreeColumn({
       /* @__PURE__ */ jsxs("div", { children: [
         /* @__PURE__ */ jsxs("div", { className: "mb-3 px-4 pt-5 sm:px-5 md:px-6 md:pt-6", children: [
           card.title && (typeof card.title === "string" ? /* @__PURE__ */ jsx("h3", { className: cn("font-medium", card.titleClassName), children: card.title }) : /* @__PURE__ */ jsx("div", { className: cn("font-medium", card.titleClassName), children: card.title })),
-          card.description && (typeof card.description === "string" ? /* @__PURE__ */ jsx("p", { className: cn("text-muted-foreground", card.descriptionClassName), children: card.description }) : /* @__PURE__ */ jsx("div", { className: cn("text-muted-foreground", card.descriptionClassName), children: card.description }))
+          card.description && (typeof card.description === "string" ? /* @__PURE__ */ jsx("p", { className: cn(getTextColor(background, "muted"), card.descriptionClassName), children: card.description }) : /* @__PURE__ */ jsx("div", { className: cn(getTextColor(background, "muted"), card.descriptionClassName), children: card.description }))
         ] }),
         /* @__PURE__ */ jsx("div", { className: "h-px border-t border-dashed" }),
-        /* @__PURE__ */ jsx("ul", { className: "text-muted-foreground", children: card.checklistItems?.map((item, itemIndex) => /* @__PURE__ */ jsxs(React.Fragment, { children: [
+        /* @__PURE__ */ jsx("ul", { className: getTextColor(background, "muted"), children: card.checklistItems?.map((item, itemIndex) => /* @__PURE__ */ jsxs(React.Fragment, { children: [
           /* @__PURE__ */ jsxs("li", { className: cn("flex items-start gap-2 px-4 py-3 sm:px-5 md:px-6", getCheckItemClassName(item)), children: [
             /* @__PURE__ */ jsx(
               DynamicIcon,
               {
                 name: "lucide/check",
                 size: 16,
-                className: "mt-1 shrink-0 text-primary"
+                className: cn("mt-1 shrink-0", getAccentColor(background))
               }
             ),
             getCheckItemContent(item)

package/dist/feature-icon-grid-accent.cjs

@@ -30,6 +30,32 @@ var React__namespace = /*#__PURE__*/_interopNamespace(React);
 function cn(...inputs) {
   return tailwindMerge.twMerge(clsx.clsx(inputs));
 }
+function getTextColor(parentBg, variant = "default", options) {
+  const isDark = parentBg === "dark" || parentBg === "secondary" || parentBg === "primary";
+  if (isDark) {
+    switch (variant) {
+      case "default":
+        return "text-foreground";
+      case "muted":
+        return "text-foreground/80";
+      case "subtle":
+        return "text-foreground/60";
+      case "accent":
+        return "text-accent-foreground";
+    }
+  } else {
+    switch (variant) {
+      case "default":
+        return "text-foreground";
+      case "muted":
+        return "text-muted-foreground";
+      case "subtle":
+        return "text-muted-foreground/70";
+      case "accent":
+        return "text-primary";
+    }
+  }
+}
 var svgCache = /* @__PURE__ */ new Map();
 function DynamicIcon({
   name,
@@ -556,14 +582,14 @@ function FeatureIconGridAccent({
             ),
             /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
               feature.title && (typeof feature.title === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-lg font-medium md:text-2xl", children: feature.title }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-lg font-medium md:text-2xl", children: feature.title })),
-              feature.description && (typeof feature.description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-2 text-muted-foreground", children: feature.description }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-2 text-muted-foreground", children: feature.description }))
+              feature.description && (typeof feature.description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("mt-2", getTextColor(background, "muted")), children: feature.description }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("mt-2", getTextColor(background, "muted")), children: feature.description }))
             ] })
           ]
         },
         index
       );
     });
-  }, [featuresSlot, features, cardClassName]);
+  }, [featuresSlot, features, cardClassName, background]);
   return /* @__PURE__ */ jsxRuntime.jsxs(
     Section,
     {

package/dist/feature-icon-grid-accent.d.cts

@@ -1,9 +1,9 @@
 import * as React from 'react';
-import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-Bz_A5vLU.cjs';
-import { O as OptixFlowConfig } from './blocks-Cohq4eio.cjs';
+import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-CPyEa7IX.cjs';
+import { O as OptixFlowConfig } from './blocks-tmd_MRJv.cjs';
 import 'react/jsx-runtime';
 import 'class-variance-authority';
-import './button-variants-lRElsmTc.cjs';
+import './button-variants-8mtEHxev.cjs';
 import 'class-variance-authority/types';
 
 interface FeatureIconGridAccentItem {

package/dist/feature-icon-grid-accent.d.ts

@@ -1,9 +1,9 @@
 import * as React from 'react';
-import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-Bi_ClKrO.js';
-import { O as OptixFlowConfig } from './blocks-k17uluAz.js';
+import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-hxnFe3w6.js';
+import { O as OptixFlowConfig } from './blocks-DRE-f6cS.js';
 import 'react/jsx-runtime';
 import 'class-variance-authority';
-import './button-variants-lRElsmTc.js';
+import './button-variants-8mtEHxev.js';
 import 'class-variance-authority/types';
 
 interface FeatureIconGridAccentItem {

package/dist/feature-icon-grid-accent.js

@@ -9,6 +9,32 @@ import { jsx, jsxs } from 'react/jsx-runtime';
 function cn(...inputs) {
   return twMerge(clsx(inputs));
 }
+function getTextColor(parentBg, variant = "default", options) {
+  const isDark = parentBg === "dark" || parentBg === "secondary" || parentBg === "primary";
+  if (isDark) {
+    switch (variant) {
+      case "default":
+        return "text-foreground";
+      case "muted":
+        return "text-foreground/80";
+      case "subtle":
+        return "text-foreground/60";
+      case "accent":
+        return "text-accent-foreground";
+    }
+  } else {
+    switch (variant) {
+      case "default":
+        return "text-foreground";
+      case "muted":
+        return "text-muted-foreground";
+      case "subtle":
+        return "text-muted-foreground/70";
+      case "accent":
+        return "text-primary";
+    }
+  }
+}
 var svgCache = /* @__PURE__ */ new Map();
 function DynamicIcon({
   name,
@@ -535,14 +561,14 @@ function FeatureIconGridAccent({
             ),
             /* @__PURE__ */ jsxs("div", { children: [
               feature.title && (typeof feature.title === "string" ? /* @__PURE__ */ jsx("h3", { className: "text-lg font-medium md:text-2xl", children: feature.title }) : /* @__PURE__ */ jsx("div", { className: "text-lg font-medium md:text-2xl", children: feature.title })),
-              feature.description && (typeof feature.description === "string" ? /* @__PURE__ */ jsx("p", { className: "mt-2 text-muted-foreground", children: feature.description }) : /* @__PURE__ */ jsx("div", { className: "mt-2 text-muted-foreground", children: feature.description }))
+              feature.description && (typeof feature.description === "string" ? /* @__PURE__ */ jsx("p", { className: cn("mt-2", getTextColor(background, "muted")), children: feature.description }) : /* @__PURE__ */ jsx("div", { className: cn("mt-2", getTextColor(background, "muted")), children: feature.description }))
             ] })
           ]
         },
         index
       );
     });
-  }, [featuresSlot, features, cardClassName]);
+  }, [featuresSlot, features, cardClassName, background]);
   return /* @__PURE__ */ jsxs(
     Section,
     {

package/dist/feature-icon-grid-bordered.cjs

@@ -30,6 +30,10 @@ var React__namespace = /*#__PURE__*/_interopNamespace(React);
 function cn(...inputs) {
   return tailwindMerge.twMerge(clsx.clsx(inputs));
 }
+function getAccentColor(parentBg, options) {
+  const isDark = parentBg === "dark" || parentBg === "secondary" || parentBg === "primary";
+  return isDark ? "text-accent-foreground" : "text-primary";
+}
 var svgCache = /* @__PURE__ */ new Map();
 function DynamicIcon({
   name,
@@ -550,7 +554,8 @@ function FeatureIconGridBordered({
             "span",
             {
               className: cn(
-                "mb-8 flex size-10 shrink-0 items-center justify-center rounded-full bg-primary text-primary-foreground md:size-12",
+                "mb-8 flex size-10 shrink-0 items-center justify-center rounded-full text-primary-foreground md:size-12",
+                getAccentColor(background),
                 feature.iconClassName
               ),
               children: renderIcon(feature)
@@ -566,7 +571,7 @@ function FeatureIconGridBordered({
                 ),
                 children: [
                   feature.title,
-                  /* @__PURE__ */ jsxRuntime.jsx("span", { className: "absolute -left-px hidden h-6 w-px bg-primary md:inline-block" })
+                  /* @__PURE__ */ jsxRuntime.jsx("span", { className: cn("absolute -left-px hidden h-6 w-px md:inline-block", getAccentColor(background)) })
                 ]
               }
             ) : /* @__PURE__ */ jsxRuntime.jsxs(
@@ -578,7 +583,7 @@ function FeatureIconGridBordered({
                 ),
                 children: [
                   feature.title,
-                  /* @__PURE__ */ jsxRuntime.jsx("span", { className: "absolute -left-px hidden h-6 w-px bg-primary md:inline-block" })
+                  /* @__PURE__ */ jsxRuntime.jsx("span", { className: cn("absolute -left-px hidden h-6 w-px md:inline-block", getAccentColor(background)) })
                 ]
               }
             )),
@@ -606,7 +611,7 @@ function FeatureIconGridBordered({
       },
       index
     ));
-  }, [featuresSlot, features, cardClassName, renderIcon]);
+  }, [featuresSlot, features, cardClassName, renderIcon, background]);
   return /* @__PURE__ */ jsxRuntime.jsxs(
     Section,
     {

package/dist/feature-icon-grid-bordered.d.cts

@@ -1,9 +1,9 @@
 import * as React from 'react';
-import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-Bz_A5vLU.cjs';
+import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-CPyEa7IX.cjs';
 import 'react/jsx-runtime';
-import './blocks-Cohq4eio.cjs';
+import './blocks-tmd_MRJv.cjs';
 import 'class-variance-authority';
-import './button-variants-lRElsmTc.cjs';
+import './button-variants-8mtEHxev.cjs';
 import 'class-variance-authority/types';
 
 interface FeatureIconGridBorderedItem {

package/dist/feature-icon-grid-bordered.d.ts

@@ -1,9 +1,9 @@
 import * as React from 'react';
-import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-Bi_ClKrO.js';
+import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-hxnFe3w6.js';
 import 'react/jsx-runtime';
-import './blocks-k17uluAz.js';
+import './blocks-DRE-f6cS.js';
 import 'class-variance-authority';
-import './button-variants-lRElsmTc.js';
+import './button-variants-8mtEHxev.js';
 import 'class-variance-authority/types';
 
 interface FeatureIconGridBorderedItem {

package/dist/feature-icon-grid-bordered.js

@@ -9,6 +9,10 @@ import { jsx, jsxs } from 'react/jsx-runtime';
 function cn(...inputs) {
   return twMerge(clsx(inputs));
 }
+function getAccentColor(parentBg, options) {
+  const isDark = parentBg === "dark" || parentBg === "secondary" || parentBg === "primary";
+  return isDark ? "text-accent-foreground" : "text-primary";
+}
 var svgCache = /* @__PURE__ */ new Map();
 function DynamicIcon({
   name,
@@ -529,7 +533,8 @@ function FeatureIconGridBordered({
             "span",
             {
               className: cn(
-                "mb-8 flex size-10 shrink-0 items-center justify-center rounded-full bg-primary text-primary-foreground md:size-12",
+                "mb-8 flex size-10 shrink-0 items-center justify-center rounded-full text-primary-foreground md:size-12",
+                getAccentColor(background),
                 feature.iconClassName
               ),
               children: renderIcon(feature)
@@ -545,7 +550,7 @@ function FeatureIconGridBordered({
                 ),
                 children: [
                   feature.title,
-                  /* @__PURE__ */ jsx("span", { className: "absolute -left-px hidden h-6 w-px bg-primary md:inline-block" })
+                  /* @__PURE__ */ jsx("span", { className: cn("absolute -left-px hidden h-6 w-px md:inline-block", getAccentColor(background)) })
                 ]
               }
             ) : /* @__PURE__ */ jsxs(
@@ -557,7 +562,7 @@ function FeatureIconGridBordered({
                 ),
                 children: [
                   feature.title,
-                  /* @__PURE__ */ jsx("span", { className: "absolute -left-px hidden h-6 w-px bg-primary md:inline-block" })
+                  /* @__PURE__ */ jsx("span", { className: cn("absolute -left-px hidden h-6 w-px md:inline-block", getAccentColor(background)) })
                 ]
               }
             )),
@@ -585,7 +590,7 @@ function FeatureIconGridBordered({
       },
       index
     ));
-  }, [featuresSlot, features, cardClassName, renderIcon]);
+  }, [featuresSlot, features, cardClassName, renderIcon, background]);
   return /* @__PURE__ */ jsxs(
     Section,
     {

package/dist/feature-icon-grid-muted.cjs

@@ -30,6 +30,32 @@ var React__namespace = /*#__PURE__*/_interopNamespace(React);
 function cn(...inputs) {
   return tailwindMerge.twMerge(clsx.clsx(inputs));
 }
+function getTextColor(parentBg, variant = "default", options) {
+  const isDark = parentBg === "dark" || parentBg === "secondary" || parentBg === "primary";
+  if (isDark) {
+    switch (variant) {
+      case "default":
+        return "text-foreground";
+      case "muted":
+        return "text-foreground/80";
+      case "subtle":
+        return "text-foreground/60";
+      case "accent":
+        return "text-accent-foreground";
+    }
+  } else {
+    switch (variant) {
+      case "default":
+        return "text-foreground";
+      case "muted":
+        return "text-muted-foreground";
+      case "subtle":
+        return "text-muted-foreground/70";
+      case "accent":
+        return "text-primary";
+    }
+  }
+}
 var svgCache = /* @__PURE__ */ new Map();
 function DynamicIcon({
   name,
@@ -543,7 +569,7 @@ function FeatureIconGridMuted({
         children: [
           (feature.icon || feature.iconName) && renderFeatureIcon(feature),
           feature.title && (typeof feature.title === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h3", { className: cn("font-semibold", feature.titleClassName), children: feature.title }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("font-semibold", feature.titleClassName), children: feature.title })),
-          feature.description && (typeof feature.description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("text-sm text-muted-foreground", feature.descriptionClassName), children: feature.description }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("text-sm text-muted-foreground", feature.descriptionClassName), children: feature.description }))
+          feature.description && (typeof feature.description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("text-sm", getTextColor(background, "muted"), feature.descriptionClassName), children: feature.description }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("text-sm", getTextColor(background, "muted"), feature.descriptionClassName), children: feature.description }))
         ]
       },
       index
@@ -562,7 +588,7 @@ function FeatureIconGridMuted({
       children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-10", children: [
         (title || description) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("mx-auto flex max-w-xl flex-col gap-2.5 text-center", headerClassName), children: [
           title && (typeof title === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h1", { className: cn("text-4xl font-semibold md:text-5xl", titleClassName), children: title }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("text-4xl font-semibold md:text-5xl", titleClassName), children: title })),
-          description && (typeof description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("text-muted-foreground", descriptionClassName), children: description }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("text-muted-foreground", descriptionClassName), children: description }))
+          description && (typeof description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn(getTextColor(background, "muted"), descriptionClassName), children: description }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn(getTextColor(background, "muted"), descriptionClassName), children: description }))
         ] }),
         (featuresSlot || features && features.length > 0) && /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("mx-auto grid max-w-7xl gap-7 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-5", gridClassName), children: featuresContent })
       ] })

package/dist/feature-icon-grid-muted.d.cts

@@ -1,9 +1,9 @@
 import * as React from 'react';
-import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-Bz_A5vLU.cjs';
+import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-CPyEa7IX.cjs';
 import 'react/jsx-runtime';
-import './blocks-Cohq4eio.cjs';
+import './blocks-tmd_MRJv.cjs';
 import 'class-variance-authority';
-import './button-variants-lRElsmTc.cjs';
+import './button-variants-8mtEHxev.cjs';
 import 'class-variance-authority/types';
 
 interface FeatureIconGridMutedItem {

package/dist/feature-icon-grid-muted.d.ts

@@ -1,9 +1,9 @@
 import * as React from 'react';
-import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-Bi_ClKrO.js';
+import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-hxnFe3w6.js';
 import 'react/jsx-runtime';
-import './blocks-k17uluAz.js';
+import './blocks-DRE-f6cS.js';
 import 'class-variance-authority';
-import './button-variants-lRElsmTc.js';
+import './button-variants-8mtEHxev.js';
 import 'class-variance-authority/types';
 
 interface FeatureIconGridMutedItem {

package/dist/feature-icon-grid-muted.js

@@ -9,6 +9,32 @@ import { jsx, jsxs } from 'react/jsx-runtime';
 function cn(...inputs) {
   return twMerge(clsx(inputs));
 }
+function getTextColor(parentBg, variant = "default", options) {
+  const isDark = parentBg === "dark" || parentBg === "secondary" || parentBg === "primary";
+  if (isDark) {
+    switch (variant) {
+      case "default":
+        return "text-foreground";
+      case "muted":
+        return "text-foreground/80";
+      case "subtle":
+        return "text-foreground/60";
+      case "accent":
+        return "text-accent-foreground";
+    }
+  } else {
+    switch (variant) {
+      case "default":
+        return "text-foreground";
+      case "muted":
+        return "text-muted-foreground";
+      case "subtle":
+        return "text-muted-foreground/70";
+      case "accent":
+        return "text-primary";
+    }
+  }
+}
 var svgCache = /* @__PURE__ */ new Map();
 function DynamicIcon({
   name,
@@ -522,7 +548,7 @@ function FeatureIconGridMuted({
         children: [
           (feature.icon || feature.iconName) && renderFeatureIcon(feature),
           feature.title && (typeof feature.title === "string" ? /* @__PURE__ */ jsx("h3", { className: cn("font-semibold", feature.titleClassName), children: feature.title }) : /* @__PURE__ */ jsx("div", { className: cn("font-semibold", feature.titleClassName), children: feature.title })),
-          feature.description && (typeof feature.description === "string" ? /* @__PURE__ */ jsx("p", { className: cn("text-sm text-muted-foreground", feature.descriptionClassName), children: feature.description }) : /* @__PURE__ */ jsx("div", { className: cn("text-sm text-muted-foreground", feature.descriptionClassName), children: feature.description }))
+          feature.description && (typeof feature.description === "string" ? /* @__PURE__ */ jsx("p", { className: cn("text-sm", getTextColor(background, "muted"), feature.descriptionClassName), children: feature.description }) : /* @__PURE__ */ jsx("div", { className: cn("text-sm", getTextColor(background, "muted"), feature.descriptionClassName), children: feature.description }))
         ]
       },
       index
@@ -541,7 +567,7 @@ function FeatureIconGridMuted({
       children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-10", children: [
         (title || description) && /* @__PURE__ */ jsxs("div", { className: cn("mx-auto flex max-w-xl flex-col gap-2.5 text-center", headerClassName), children: [
           title && (typeof title === "string" ? /* @__PURE__ */ jsx("h1", { className: cn("text-4xl font-semibold md:text-5xl", titleClassName), children: title }) : /* @__PURE__ */ jsx("div", { className: cn("text-4xl font-semibold md:text-5xl", titleClassName), children: title })),
-          description && (typeof description === "string" ? /* @__PURE__ */ jsx("p", { className: cn("text-muted-foreground", descriptionClassName), children: description }) : /* @__PURE__ */ jsx("div", { className: cn("text-muted-foreground", descriptionClassName), children: description }))
+          description && (typeof description === "string" ? /* @__PURE__ */ jsx("p", { className: cn(getTextColor(background, "muted"), descriptionClassName), children: description }) : /* @__PURE__ */ jsx("div", { className: cn(getTextColor(background, "muted"), descriptionClassName), children: description }))
         ] }),
         (featuresSlot || features && features.length > 0) && /* @__PURE__ */ jsx("div", { className: cn("mx-auto grid max-w-7xl gap-7 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-5", gridClassName), children: featuresContent })
       ] })