@opensite/ui 0.8.9 → 0.9.1

package/dist/cta-documentation-links.js

@@ -10,6 +10,32 @@ import { cva } from 'class-variance-authority';
 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 Card({ className, ...props }) {
   return /* @__PURE__ */ jsx(
     "div",
@@ -1006,7 +1032,7 @@ function CtaDocumentationLinks({
             )),
             /* @__PURE__ */ jsxs("div", { children: [
               link.title && /* @__PURE__ */ jsx("h5", { className: "mb-2 leading-4 font-medium", children: link.title }),
-              link.description && /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: link.description })
+              link.description && /* @__PURE__ */ jsx("p", { className: cn("text-sm", getTextColor(background, "muted")), children: link.description })
             ] })
           ] }),
           /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/chevron-right", size: 24 })
@@ -1041,7 +1067,7 @@ function CtaDocumentationLinks({
                   children: heading
                 }
               ) : /* @__PURE__ */ jsx("div", { className: cn("mb-2", headingClassName), children: heading })),
-              description && (typeof description === "string" ? /* @__PURE__ */ jsx("p", { className: cn("text-muted-foreground", descriptionClassName), children: description }) : /* @__PURE__ */ jsx("div", { className: descriptionClassName, children: description })),
+              description && (typeof description === "string" ? /* @__PURE__ */ jsx("p", { className: cn(getTextColor(background, "muted"), descriptionClassName), children: description }) : /* @__PURE__ */ jsx("div", { className: descriptionClassName, children: description })),
               actionsContent
             ] }),
             linksContent

package/dist/cta-feature-cards-grid.cjs

@@ -31,6 +31,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";
+}
 function normalizePhoneNumber(input) {
   const trimmed = input.trim();
   if (trimmed.toLowerCase().startsWith("tel:")) {
@@ -1013,11 +1043,11 @@ function CtaFeatureCardsGrid({
                 {
                   name: feature.iconName || "",
                   size: 24,
-                  className: "text-primary"
+                  className: getAccentColor(background)
                 }
               ) }),
               feature.title && /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "mb-2 font-semibold", children: feature.title }),
-              feature.description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground", children: feature.description })
+              feature.description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("text-sm", getTextColor(background, "muted")), children: feature.description })
             ]
           },
           index
@@ -1049,7 +1079,8 @@ function CtaFeatureCardsGrid({
             "p",
             {
               className: cn(
-                "mx-auto mb-8 max-w-2xl text-lg text-muted-foreground",
+                "mx-auto mb-8 max-w-2xl text-lg",
+                getTextColor(background, "muted"),
                 descriptionClassName
               ),
               children: description

package/dist/cta-feature-cards-grid.js

@@ -10,6 +10,36 @@ 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";
+    }
+  }
+}
+function getAccentColor(parentBg, options) {
+  const isDark = parentBg === "dark" || parentBg === "secondary" || parentBg === "primary";
+  return isDark ? "text-accent-foreground" : "text-primary";
+}
 function normalizePhoneNumber(input) {
   const trimmed = input.trim();
   if (trimmed.toLowerCase().startsWith("tel:")) {
@@ -992,11 +1022,11 @@ function CtaFeatureCardsGrid({
                 {
                   name: feature.iconName || "",
                   size: 24,
-                  className: "text-primary"
+                  className: getAccentColor(background)
                 }
               ) }),
               feature.title && /* @__PURE__ */ jsx("h3", { className: "mb-2 font-semibold", children: feature.title }),
-              feature.description && /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: feature.description })
+              feature.description && /* @__PURE__ */ jsx("p", { className: cn("text-sm", getTextColor(background, "muted")), children: feature.description })
             ]
           },
           index
@@ -1028,7 +1058,8 @@ function CtaFeatureCardsGrid({
             "p",
             {
               className: cn(
-                "mx-auto mb-8 max-w-2xl text-lg text-muted-foreground",
+                "mx-auto mb-8 max-w-2xl text-lg",
+                getTextColor(background, "muted"),
                 descriptionClassName
               ),
               children: description

package/dist/cta-feature-checklist.cjs

@@ -61,6 +61,32 @@ function getNestedCardTextColor(parentBg, options) {
   const isDark = parentBg === "dark" || parentBg === "secondary" || parentBg === "primary";
   return isDark ? "text-foreground" : "";
 }
+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:")) {
@@ -1078,7 +1104,7 @@ function CtaFeatureChecklist({
               description && (typeof description === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
                 "p",
                 {
-                  className: cn("text-muted-foreground", descriptionClassName),
+                  className: cn(getTextColor(background, "muted"), descriptionClassName),
                   children: description
                 }
               ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: descriptionClassName, children: description })),

package/dist/cta-feature-checklist.js

@@ -40,6 +40,32 @@ function getNestedCardTextColor(parentBg, options) {
   const isDark = parentBg === "dark" || parentBg === "secondary" || parentBg === "primary";
   return isDark ? "text-foreground" : "";
 }
+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:")) {
@@ -1057,7 +1083,7 @@ function CtaFeatureChecklist({
               description && (typeof description === "string" ? /* @__PURE__ */ jsx(
                 "p",
                 {
-                  className: cn("text-muted-foreground", descriptionClassName),
+                  className: cn(getTextColor(background, "muted"), descriptionClassName),
                   children: description
                 }
               ) : /* @__PURE__ */ jsx("div", { className: descriptionClassName, children: description })),

package/dist/cta-feature-list.cjs

@@ -62,6 +62,36 @@ function getNestedCardTextColor(parentBg, options) {
   const isDark = parentBg === "dark" || parentBg === "secondary" || parentBg === "primary";
   return isDark ? "text-foreground" : "";
 }
+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";
+}
 function normalizePhoneNumber(input) {
   const trimmed = input.trim();
   if (trimmed.toLowerCase().startsWith("tel:")) {
@@ -1023,7 +1053,7 @@ function CtaFeatureList({
             {
               name: feature.iconName,
               size: 20,
-              className: "text-primary"
+              className: getAccentColor(background)
             }
           )),
           /* @__PURE__ */ jsxRuntime.jsx("span", { children: feature.text })
@@ -1077,7 +1107,8 @@ function CtaFeatureList({
                 "p",
                 {
                   className: cn(
-                    "mb-6 text-muted-foreground lg:text-lg",
+                    "mb-6 lg:text-lg",
+                    getTextColor(background, "muted"),
                     descriptionClassName
                   ),
                   children: description

package/dist/cta-feature-list.js

@@ -41,6 +41,36 @@ function getNestedCardTextColor(parentBg, options) {
   const isDark = parentBg === "dark" || parentBg === "secondary" || parentBg === "primary";
   return isDark ? "text-foreground" : "";
 }
+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";
+}
 function normalizePhoneNumber(input) {
   const trimmed = input.trim();
   if (trimmed.toLowerCase().startsWith("tel:")) {
@@ -1002,7 +1032,7 @@ function CtaFeatureList({
             {
               name: feature.iconName,
               size: 20,
-              className: "text-primary"
+              className: getAccentColor(background)
             }
           )),
           /* @__PURE__ */ jsx("span", { children: feature.text })
@@ -1056,7 +1086,8 @@ function CtaFeatureList({
                 "p",
                 {
                   className: cn(
-                    "mb-6 text-muted-foreground lg:text-lg",
+                    "mb-6 lg:text-lg",
+                    getTextColor(background, "muted"),
                     descriptionClassName
                   ),
                   children: description

package/dist/cta-gradient-logos-floating.cjs

@@ -32,6 +32,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";
+    }
+  }
+}
 function normalizePhoneNumber(input) {
   const trimmed = input.trim();
   if (trimmed.toLowerCase().startsWith("tel:")) {
@@ -1103,7 +1129,8 @@ function CtaGradientLogosFloating({
                 "p",
                 {
                   className: cn(
-                    "mb-8 text-lg text-muted-foreground",
+                    "mb-8 text-lg",
+                    getTextColor(background, "muted"),
                     descriptionClassName
                   ),
                   children: description

package/dist/cta-gradient-logos-floating.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:")) {
@@ -1082,7 +1108,8 @@ function CtaGradientLogosFloating({
                 "p",
                 {
                   className: cn(
-                    "mb-8 text-lg text-muted-foreground",
+                    "mb-8 text-lg",
+                    getTextColor(background, "muted"),
                     descriptionClassName
                   ),
                   children: description

package/dist/cta-minimal-separator.cjs

@@ -33,6 +33,32 @@ var SeparatorPrimitive__namespace = /*#__PURE__*/_interopNamespace(SeparatorPrim
 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 normalizePhoneNumber(input) {
   const trimmed = input.trim();
   if (trimmed.toLowerCase().startsWith("tel:")) {
@@ -901,7 +927,7 @@ function CtaMinimalSeparator({
               contentClassName
             ),
             children: [
-              text && (typeof text === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("text-lg text-muted-foreground", textClassName), children: text }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: textClassName, children: text })),
+              text && (typeof text === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("text-lg", getTextColor(background, "muted"), textClassName), children: text }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: textClassName, children: text })),
               actionsContent && /* @__PURE__ */ jsxRuntime.jsx("div", { className: actionsClassName, children: actionsContent })
             ]
           }

package/dist/cta-minimal-separator.js

@@ -11,6 +11,32 @@ import * as SeparatorPrimitive from '@radix-ui/react-separator';
 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:")) {
@@ -879,7 +905,7 @@ function CtaMinimalSeparator({
               contentClassName
             ),
             children: [
-              text && (typeof text === "string" ? /* @__PURE__ */ jsx("p", { className: cn("text-lg text-muted-foreground", textClassName), children: text }) : /* @__PURE__ */ jsx("div", { className: textClassName, children: text })),
+              text && (typeof text === "string" ? /* @__PURE__ */ jsx("p", { className: cn("text-lg", getTextColor(background, "muted"), textClassName), children: text }) : /* @__PURE__ */ jsx("div", { className: textClassName, children: text })),
               actionsContent && /* @__PURE__ */ jsx("div", { className: actionsClassName, children: actionsContent })
             ]
           }

package/dist/cta-platform-demo.cjs

@@ -62,6 +62,32 @@ function getNestedCardTextColor(parentBg, options) {
   const isDark = parentBg === "dark" || parentBg === "secondary" || parentBg === "primary";
   return isDark ? "text-foreground" : "";
 }
+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:")) {
@@ -1050,7 +1076,8 @@ function CtaPlatformDemo({
                     "p",
                     {
                       className: cn(
-                        "mt-4 text-muted-foreground md:text-lg",
+                        "mt-4 md:text-lg",
+                        getTextColor(background, "muted"),
                         descriptionClassName
                       ),
                       children: description

package/dist/cta-platform-demo.js

@@ -41,6 +41,32 @@ function getNestedCardTextColor(parentBg, options) {
   const isDark = parentBg === "dark" || parentBg === "secondary" || parentBg === "primary";
   return isDark ? "text-foreground" : "";
 }
+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:")) {
@@ -1029,7 +1055,8 @@ function CtaPlatformDemo({
                     "p",
                     {
                       className: cn(
-                        "mt-4 text-muted-foreground md:text-lg",
+                        "mt-4 md:text-lg",
+                        getTextColor(background, "muted"),
                         descriptionClassName
                       ),
                       children: description

package/dist/cta-simple-centered.cjs

@@ -31,6 +31,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";
+    }
+  }
+}
 function normalizePhoneNumber(input) {
   const trimmed = input.trim();
   if (trimmed.toLowerCase().startsWith("tel:")) {
@@ -1007,7 +1033,8 @@ function CtaSimpleCentered({
           "p",
           {
             className: cn(
-              "mb-8 text-lg text-muted-foreground",
+              "mb-8 text-lg",
+              getTextColor(background, "muted"),
               descriptionClassName
             ),
             children: description