@opensite/ui 0.8.8 → 0.9.0

package/dist/faq-categorized-sections.cjs

@@ -32,6 +32,32 @@ var AccordionPrimitive__namespace = /*#__PURE__*/_interopNamespace(AccordionPrim
 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,
@@ -635,7 +661,7 @@ function FaqCategorizedSections({
                   AccordionContent,
                   {
                     className: cn("sm:mb-1 lg:mb-2", accordionContentClassName),
-                    children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-muted-foreground lg:text-lg", children: item.answer })
+                    children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn(getTextColor(background, "muted"), "lg:text-lg"), children: item.answer })
                   }
                 )
               ]
@@ -653,7 +679,8 @@ function FaqCategorizedSections({
     accordionClassName,
     accordionItemClassName,
     accordionTriggerClassName,
-    accordionContentClassName
+    accordionContentClassName,
+    background
   ]);
   return /* @__PURE__ */ jsxRuntime.jsx(
     Section,
@@ -687,7 +714,8 @@ function FaqCategorizedSections({
                 "p",
                 {
                   className: cn(
-                    "text-muted-foreground lg:text-lg",
+                    getTextColor(background, "muted"),
+                    "lg:text-lg",
                     descriptionClassName
                   ),
                   children: description

package/dist/faq-categorized-sections.d.cts

@@ -1,10 +1,9 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React from 'react';
-import { f as SectionBackground, g as SectionSpacing } from './community-initiatives-Sm_ZSgyv.cjs';
-import { P as PatternName } from './pattern-background-a7gKHzHy.cjs';
-import './blocks-Cohq4eio.cjs';
+import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-CPyEa7IX.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 FaqItem {

package/dist/faq-categorized-sections.d.ts

@@ -1,10 +1,9 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React from 'react';
-import { f as SectionBackground, g as SectionSpacing } from './community-initiatives-BeWIIjA4.js';
-import { P as PatternName } from './pattern-background-a7gKHzHy.js';
-import './blocks-k17uluAz.js';
+import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-hxnFe3w6.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 FaqItem {

package/dist/faq-categorized-sections.js

@@ -10,6 +10,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,
@@ -613,7 +639,7 @@ function FaqCategorizedSections({
                   AccordionContent,
                   {
                     className: cn("sm:mb-1 lg:mb-2", accordionContentClassName),
-                    children: /* @__PURE__ */ jsx("div", { className: "text-muted-foreground lg:text-lg", children: item.answer })
+                    children: /* @__PURE__ */ jsx("div", { className: cn(getTextColor(background, "muted"), "lg:text-lg"), children: item.answer })
                   }
                 )
               ]
@@ -631,7 +657,8 @@ function FaqCategorizedSections({
     accordionClassName,
     accordionItemClassName,
     accordionTriggerClassName,
-    accordionContentClassName
+    accordionContentClassName,
+    background
   ]);
   return /* @__PURE__ */ jsx(
     Section,
@@ -665,7 +692,8 @@ function FaqCategorizedSections({
                 "p",
                 {
                   className: cn(
-                    "text-muted-foreground lg:text-lg",
+                    getTextColor(background, "muted"),
+                    "lg:text-lg",
                     descriptionClassName
                   ),
                   children: description

package/dist/faq-centered-accordion.cjs

@@ -32,6 +32,32 @@ var AccordionPrimitive__namespace = /*#__PURE__*/_interopNamespace(AccordionPrim
 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,
@@ -621,7 +647,7 @@ function FaqCenteredAccordion({
                 AccordionContent,
                 {
                   className: cn("sm:mb-1 lg:mb-2", accordionContentClassName),
-                  children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-muted-foreground lg:text-lg", children: item.answer })
+                  children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn(getTextColor(background, "muted"), "lg:text-lg"), children: item.answer })
                 }
               )
             ]
@@ -636,7 +662,8 @@ function FaqCenteredAccordion({
     accordionClassName,
     accordionItemClassName,
     accordionTriggerClassName,
-    accordionContentClassName
+    accordionContentClassName,
+    background
   ]);
   return /* @__PURE__ */ jsxRuntime.jsx(
     Section,
@@ -670,7 +697,8 @@ function FaqCenteredAccordion({
                 "p",
                 {
                   className: cn(
-                    "text-muted-foreground lg:text-lg",
+                    getTextColor(background, "muted"),
+                    "lg:text-lg",
                     descriptionClassName
                   ),
                   children: description

package/dist/faq-centered-accordion.d.cts

@@ -1,10 +1,9 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React from 'react';
-import { f as SectionBackground, g as SectionSpacing } from './community-initiatives-Sm_ZSgyv.cjs';
-import { P as PatternName } from './pattern-background-a7gKHzHy.cjs';
-import './blocks-Cohq4eio.cjs';
+import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-CPyEa7IX.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 FaqItem {

package/dist/faq-centered-accordion.d.ts

@@ -1,10 +1,9 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React from 'react';
-import { f as SectionBackground, g as SectionSpacing } from './community-initiatives-BeWIIjA4.js';
-import { P as PatternName } from './pattern-background-a7gKHzHy.js';
-import './blocks-k17uluAz.js';
+import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-hxnFe3w6.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 FaqItem {

package/dist/faq-centered-accordion.js

@@ -10,6 +10,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,
@@ -599,7 +625,7 @@ function FaqCenteredAccordion({
                 AccordionContent,
                 {
                   className: cn("sm:mb-1 lg:mb-2", accordionContentClassName),
-                  children: /* @__PURE__ */ jsx("div", { className: "text-muted-foreground lg:text-lg", children: item.answer })
+                  children: /* @__PURE__ */ jsx("div", { className: cn(getTextColor(background, "muted"), "lg:text-lg"), children: item.answer })
                 }
               )
             ]
@@ -614,7 +640,8 @@ function FaqCenteredAccordion({
     accordionClassName,
     accordionItemClassName,
     accordionTriggerClassName,
-    accordionContentClassName
+    accordionContentClassName,
+    background
   ]);
   return /* @__PURE__ */ jsx(
     Section,
@@ -648,7 +675,8 @@ function FaqCenteredAccordion({
                 "p",
                 {
                   className: cn(
-                    "text-muted-foreground lg:text-lg",
+                    getTextColor(background, "muted"),
+                    "lg:text-lg",
                     descriptionClassName
                   ),
                   children: description

package/dist/faq-gradient-categories.cjs

@@ -32,6 +32,32 @@ var AccordionPrimitive__namespace = /*#__PURE__*/_interopNamespace(AccordionPrim
 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,
@@ -636,7 +662,7 @@ function FaqGradientCategories({
                   AccordionContent,
                   {
                     className: cn("sm:mb-1 lg:mb-2", accordionContentClassName),
-                    children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-muted-foreground lg:text-lg", children: item.answer })
+                    children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn(getTextColor(background, "muted"), "lg:text-lg"), children: item.answer })
                   }
                 )
               ]
@@ -654,7 +680,8 @@ function FaqGradientCategories({
     accordionClassName,
     accordionItemClassName,
     accordionTriggerClassName,
-    accordionContentClassName
+    accordionContentClassName,
+    background
   ]);
   return /* @__PURE__ */ jsxRuntime.jsx(
     Section,
@@ -695,7 +722,8 @@ function FaqGradientCategories({
                     "p",
                     {
                       className: cn(
-                        "text-muted-foreground lg:text-lg",
+                        getTextColor(background, "muted"),
+                        "lg:text-lg",
                         descriptionClassName
                       ),
                       children: description

package/dist/faq-gradient-categories.d.cts

@@ -1,10 +1,9 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React from 'react';
-import { f as SectionBackground, g as SectionSpacing } from './community-initiatives-Sm_ZSgyv.cjs';
-import { P as PatternName } from './pattern-background-a7gKHzHy.cjs';
-import './blocks-Cohq4eio.cjs';
+import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-CPyEa7IX.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 FaqItem {

package/dist/faq-gradient-categories.d.ts

@@ -1,10 +1,9 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React from 'react';
-import { f as SectionBackground, g as SectionSpacing } from './community-initiatives-BeWIIjA4.js';
-import { P as PatternName } from './pattern-background-a7gKHzHy.js';
-import './blocks-k17uluAz.js';
+import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-hxnFe3w6.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 FaqItem {

package/dist/faq-gradient-categories.js

@@ -10,6 +10,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,
@@ -614,7 +640,7 @@ function FaqGradientCategories({
                   AccordionContent,
                   {
                     className: cn("sm:mb-1 lg:mb-2", accordionContentClassName),
-                    children: /* @__PURE__ */ jsx("div", { className: "text-muted-foreground lg:text-lg", children: item.answer })
+                    children: /* @__PURE__ */ jsx("div", { className: cn(getTextColor(background, "muted"), "lg:text-lg"), children: item.answer })
                   }
                 )
               ]
@@ -632,7 +658,8 @@ function FaqGradientCategories({
     accordionClassName,
     accordionItemClassName,
     accordionTriggerClassName,
-    accordionContentClassName
+    accordionContentClassName,
+    background
   ]);
   return /* @__PURE__ */ jsx(
     Section,
@@ -673,7 +700,8 @@ function FaqGradientCategories({
                     "p",
                     {
                       className: cn(
-                        "text-muted-foreground lg:text-lg",
+                        getTextColor(background, "muted"),
+                        "lg:text-lg",
                         descriptionClassName
                       ),
                       children: description

package/dist/faq-icon-benefits.cjs

@@ -30,6 +30,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,
@@ -554,14 +584,16 @@ function FaqIconBenefits({
                 "div",
                 {
                   className: cn(
-                    "flex size-12 items-center justify-center rounded-full bg-primary/10",
+                    "flex size-12 items-center justify-center rounded-full",
+                    getAccentColor(background),
+                    "opacity-10",
                     iconWrapperClassName
                   ),
                   children: /* @__PURE__ */ jsxRuntime.jsx(
                     DynamicIcon,
                     {
                       name: benefit.icon,
-                      className: cn("size-6 text-primary", iconClassName)
+                      className: cn("size-6", getAccentColor(background), iconClassName)
                     }
                   )
                 }
@@ -571,7 +603,8 @@ function FaqIconBenefits({
                 "p",
                 {
                   className: cn(
-                    "text-muted-foreground text-sm",
+                    getTextColor(background, "muted"),
+                    "text-sm",
                     benefitDescriptionClassName
                   ),
                   children: benefit.description
@@ -591,7 +624,8 @@ function FaqIconBenefits({
     iconWrapperClassName,
     iconClassName,
     titleClassName,
-    benefitDescriptionClassName
+    benefitDescriptionClassName,
+    background
   ]);
   return /* @__PURE__ */ jsxRuntime.jsx(
     Section,
@@ -625,7 +659,8 @@ function FaqIconBenefits({
                 "p",
                 {
                   className: cn(
-                    "text-muted-foreground lg:text-lg",
+                    getTextColor(background, "muted"),
+                    "lg:text-lg",
                     descriptionClassName
                   ),
                   children: description

package/dist/faq-icon-benefits.d.cts

@@ -1,10 +1,9 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React from 'react';
-import { f as SectionBackground, g as SectionSpacing } from './community-initiatives-Sm_ZSgyv.cjs';
-import { P as PatternName } from './pattern-background-a7gKHzHy.cjs';
-import './blocks-Cohq4eio.cjs';
+import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-CPyEa7IX.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 FaqBenefit {

package/dist/faq-icon-benefits.d.ts

@@ -1,10 +1,9 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React from 'react';
-import { f as SectionBackground, g as SectionSpacing } from './community-initiatives-BeWIIjA4.js';
-import { P as PatternName } from './pattern-background-a7gKHzHy.js';
-import './blocks-k17uluAz.js';
+import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-hxnFe3w6.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 FaqBenefit {

package/dist/faq-icon-benefits.js

@@ -9,6 +9,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";
+}
 var svgCache = /* @__PURE__ */ new Map();
 function DynamicIcon({
   name,
@@ -533,14 +563,16 @@ function FaqIconBenefits({
                 "div",
                 {
                   className: cn(
-                    "flex size-12 items-center justify-center rounded-full bg-primary/10",
+                    "flex size-12 items-center justify-center rounded-full",
+                    getAccentColor(background),
+                    "opacity-10",
                     iconWrapperClassName
                   ),
                   children: /* @__PURE__ */ jsx(
                     DynamicIcon,
                     {
                       name: benefit.icon,
-                      className: cn("size-6 text-primary", iconClassName)
+                      className: cn("size-6", getAccentColor(background), iconClassName)
                     }
                   )
                 }
@@ -550,7 +582,8 @@ function FaqIconBenefits({
                 "p",
                 {
                   className: cn(
-                    "text-muted-foreground text-sm",
+                    getTextColor(background, "muted"),
+                    "text-sm",
                     benefitDescriptionClassName
                   ),
                   children: benefit.description
@@ -570,7 +603,8 @@ function FaqIconBenefits({
     iconWrapperClassName,
     iconClassName,
     titleClassName,
-    benefitDescriptionClassName
+    benefitDescriptionClassName,
+    background
   ]);
   return /* @__PURE__ */ jsx(
     Section,
@@ -604,7 +638,8 @@ function FaqIconBenefits({
                 "p",
                 {
                   className: cn(
-                    "text-muted-foreground lg:text-lg",
+                    getTextColor(background, "muted"),
+                    "lg:text-lg",
                     descriptionClassName
                   ),
                   children: description