@opensite/ui 3.7.9 → 3.8.1

package/dist/stats-bar-comparison.cjs

@@ -32,36 +32,6 @@ var React3__namespace = /*#__PURE__*/_interopNamespace(React3);
 function cn(...inputs) {
   return tailwindMerge.twMerge(clsx.clsx(inputs));
 }
-function getNestedCardBg(parentBg, variant = "muted", options) {
-  const isDark = parentBg === "dark" || parentBg === "secondary" || parentBg === "primary";
-  if (isDark) {
-    switch (variant) {
-      case "muted":
-        return "bg-background";
-      case "card":
-        return "bg-card";
-      case "accent":
-        return "bg-accent";
-      case "subtle":
-        return "bg-background/50";
-    }
-  } else {
-    switch (variant) {
-      case "muted":
-        return "bg-muted";
-      case "card":
-        return "bg-card";
-      case "accent":
-        return "bg-accent";
-      case "subtle":
-        return "bg-muted/50";
-    }
-  }
-}
-function getNestedCardTextColor(parentBg, options) {
-  const isDark = parentBg === "dark" || parentBg === "secondary" || parentBg === "primary";
-  return isDark ? "text-foreground" : "";
-}
 var badgeVariants = classVarianceAuthority.cva(
   "inline-flex items-center justify-center rounded-full border px-2 py-0.5 text-xs font-medium w-fit whitespace-nowrap shrink-0 [&>svg]:size-3 gap-1 [&>svg]:pointer-events-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive transition-[color,box-shadow] overflow-hidden",
   {
@@ -518,7 +488,7 @@ function StatsBarComparison({
   const badgeContent = React3.useMemo(() => {
     if (badgeSlot) return badgeSlot;
     if (!badge) return null;
-    return /* @__PURE__ */ jsxRuntime.jsx(Badge, { variant: "outline", className: cn("mb-4", badgeClassName), children: badge });
+    return /* @__PURE__ */ jsxRuntime.jsx(Badge, { className: cn("mb-4", badgeClassName), children: badge });
   }, [badgeSlot, badge, badgeClassName]);
   const comparisonsContent = React3.useMemo(() => {
     if (comparisonsSlot) return comparisonsSlot;
@@ -527,9 +497,7 @@ function StatsBarComparison({
       "div",
       {
         className: cn(
-          "rounded-xl border p-6",
-          getNestedCardBg(background, "card"),
-          getNestedCardTextColor(background),
+          "rounded-xl border p-6 bg-card text-card-foreground",
           group.className,
           groupCardClassName
         ),
@@ -540,7 +508,7 @@ function StatsBarComparison({
               className: cn("mb-6 text-lg font-semibold", groupTitleClassName),
               children: group.title
             }
-          ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("mb-6", groupTitleClassName), children: group.title })),
+          ) : group.title),
           /* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-4", children: group.bars.map((bar, barIndex) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: bar.className, children: [
             /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mb-2 flex items-center justify-between", children: [
               /* @__PURE__ */ jsxRuntime.jsx("span", { className: cn("text-sm font-medium", barLabelClassName), children: bar.label }),
@@ -551,7 +519,6 @@ function StatsBarComparison({
               {
                 className: cn(
                   "h-3 w-full overflow-hidden rounded-full",
-                  getNestedCardBg(background, "muted"),
                   barTrackClassName
                 ),
                 children: /* @__PURE__ */ jsxRuntime.jsx(
@@ -609,17 +576,17 @@ function StatsBarComparison({
               ),
               children: heading
             }
-          ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("mb-4", headingClassName), children: heading })),
+          ) : heading),
           description && (typeof description === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
             "p",
             {
               className: cn(
-                "mx-auto max-w-2xl text-muted-foreground",
+                "mx-auto max-w-full md:max-w-md text-balance opacity-70",
                 descriptionClassName
               ),
               children: description
             }
-          ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("mx-auto max-w-2xl", descriptionClassName), children: description }))
+          ) : description)
         ] }),
         (comparisonsSlot || comparisons && comparisons.length > 0) && /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("space-y-10", comparisonsClassName), children: comparisonsContent })
       ] })

package/dist/stats-bar-comparison.js

@@ -11,36 +11,6 @@ import { jsx, jsxs } from 'react/jsx-runtime';
 function cn(...inputs) {
   return twMerge(clsx(inputs));
 }
-function getNestedCardBg(parentBg, variant = "muted", options) {
-  const isDark = parentBg === "dark" || parentBg === "secondary" || parentBg === "primary";
-  if (isDark) {
-    switch (variant) {
-      case "muted":
-        return "bg-background";
-      case "card":
-        return "bg-card";
-      case "accent":
-        return "bg-accent";
-      case "subtle":
-        return "bg-background/50";
-    }
-  } else {
-    switch (variant) {
-      case "muted":
-        return "bg-muted";
-      case "card":
-        return "bg-card";
-      case "accent":
-        return "bg-accent";
-      case "subtle":
-        return "bg-muted/50";
-    }
-  }
-}
-function getNestedCardTextColor(parentBg, options) {
-  const isDark = parentBg === "dark" || parentBg === "secondary" || parentBg === "primary";
-  return isDark ? "text-foreground" : "";
-}
 var badgeVariants = cva(
   "inline-flex items-center justify-center rounded-full border px-2 py-0.5 text-xs font-medium w-fit whitespace-nowrap shrink-0 [&>svg]:size-3 gap-1 [&>svg]:pointer-events-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive transition-[color,box-shadow] overflow-hidden",
   {
@@ -497,7 +467,7 @@ function StatsBarComparison({
   const badgeContent = useMemo(() => {
     if (badgeSlot) return badgeSlot;
     if (!badge) return null;
-    return /* @__PURE__ */ jsx(Badge, { variant: "outline", className: cn("mb-4", badgeClassName), children: badge });
+    return /* @__PURE__ */ jsx(Badge, { className: cn("mb-4", badgeClassName), children: badge });
   }, [badgeSlot, badge, badgeClassName]);
   const comparisonsContent = useMemo(() => {
     if (comparisonsSlot) return comparisonsSlot;
@@ -506,9 +476,7 @@ function StatsBarComparison({
       "div",
       {
         className: cn(
-          "rounded-xl border p-6",
-          getNestedCardBg(background, "card"),
-          getNestedCardTextColor(background),
+          "rounded-xl border p-6 bg-card text-card-foreground",
           group.className,
           groupCardClassName
         ),
@@ -519,7 +487,7 @@ function StatsBarComparison({
               className: cn("mb-6 text-lg font-semibold", groupTitleClassName),
               children: group.title
             }
-          ) : /* @__PURE__ */ jsx("div", { className: cn("mb-6", groupTitleClassName), children: group.title })),
+          ) : group.title),
           /* @__PURE__ */ jsx("div", { className: "space-y-4", children: group.bars.map((bar, barIndex) => /* @__PURE__ */ jsxs("div", { className: bar.className, children: [
             /* @__PURE__ */ jsxs("div", { className: "mb-2 flex items-center justify-between", children: [
               /* @__PURE__ */ jsx("span", { className: cn("text-sm font-medium", barLabelClassName), children: bar.label }),
@@ -530,7 +498,6 @@ function StatsBarComparison({
               {
                 className: cn(
                   "h-3 w-full overflow-hidden rounded-full",
-                  getNestedCardBg(background, "muted"),
                   barTrackClassName
                 ),
                 children: /* @__PURE__ */ jsx(
@@ -588,17 +555,17 @@ function StatsBarComparison({
               ),
               children: heading
             }
-          ) : /* @__PURE__ */ jsx("div", { className: cn("mb-4", headingClassName), children: heading })),
+          ) : heading),
           description && (typeof description === "string" ? /* @__PURE__ */ jsx(
             "p",
             {
               className: cn(
-                "mx-auto max-w-2xl text-muted-foreground",
+                "mx-auto max-w-full md:max-w-md text-balance opacity-70",
                 descriptionClassName
               ),
               children: description
             }
-          ) : /* @__PURE__ */ jsx("div", { className: cn("mx-auto max-w-2xl", descriptionClassName), children: description }))
+          ) : description)
         ] }),
         (comparisonsSlot || comparisons && comparisons.length > 0) && /* @__PURE__ */ jsx("div", { className: cn("space-y-10", comparisonsClassName), children: comparisonsContent })
       ] })

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@opensite/ui",
-  "version": "3.7.9",
+  "version": "3.8.1",
   "description": "Foundational UI component library for OpenSite Semantic Site Builder with tree-shakable exports and abstract styling",
   "keywords": [
     "react",