@deframe-sdk/components 0.1.21 → 0.1.22

package/dist/index.js

@@ -7449,7 +7449,7 @@ var variantStyles = {
 var Label = ({ children, variant = "primary", className }) => {
   return /* @__PURE__ */ jsxRuntime.jsx("div", { className: tailwindMerge.twMerge(variantStyles[variant], className), children });
 };
-var HistoryItemSkeleton = () => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "w-full bg-bg-subtle dark:bg-bg-subtle-dark rounded-xs min-h-[72px] flex items-center justify-between px-md py-sm", children: [
+var HistoryItemSkeleton = () => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "w-full bg-[var(--deframe-widget-color-bg-subtle)] rounded-xs min-h-[72px] flex items-center justify-between px-md py-sm", children: [
   /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-sm flex-1 min-w-0", children: [
     /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-10 h-10 rounded-xl bg-bg-muted dark:bg-bg-muted-dark animate-pulse flex-shrink-0" }),
     /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-xs flex-1 min-w-0", children: [
@@ -7504,8 +7504,7 @@ var StrategyGridCard = ({
     "data-test-id": "strategy-grid-card",
     className: tailwindMerge.twMerge(
       "flex flex-col gap-[var(--deframe-widget-size-gap-md)] p-[var(--deframe-widget-size-padding-x-md)] rounded-[var(--deframe-widget-size-radius-sm)] h-[136px] min-h-[136px] flex-shrink-0",
-      "bg-[var(--deframe-widget-color-bg-primary)]",
-      "hover:bg-[var(--deframe-widget-color-bg-tertiary)]",
+      "bg-[var(--deframe-widget-color-bg-raised)]",
       "transition-colors cursor-pointer text-left w-full",
       className
     ),
@@ -7575,7 +7574,7 @@ var EarnInvestmentSummaryView = ({
   processingBadgeTitle,
   className
 }) => {
-  return /* @__PURE__ */ jsxRuntime.jsxs("section", { className: tailwindMerge.twMerge("flex flex-col gap-md p-lg bg-bg-subtle dark:bg-bg-subtle-dark rounded", className), children: [
+  return /* @__PURE__ */ jsxRuntime.jsxs("section", { className: tailwindMerge.twMerge("flex flex-col gap-md p-lg bg-[var(--deframe-widget-color-bg-subtle)] rounded", className), children: [
     /* @__PURE__ */ jsxRuntime.jsx(TextBody, { variant: "text-small", className: "text-text-secondary dark:text-text-secondary-dark", children: overviewDescription }),
     /* @__PURE__ */ jsxRuntime.jsx(
       WalletBalances,
@@ -7614,7 +7613,7 @@ var EarnInvestedSectionView = ({
     {
       className: tailwindMerge.twMerge(
         "flex flex-col gap-[var(--deframe-widget-size-gap-md)] p-[var(--deframe-widget-size-padding-x-lg)]",
-        "bg-[var(--deframe-widget-color-bg-secondary)] rounded-[var(--deframe-widget-size-radius-sm)]",
+        "bg-[var(--deframe-widget-color-bg-subtle)] rounded-[var(--deframe-widget-size-radius-sm)]",
         className
       ),
       children: [
@@ -7627,8 +7626,7 @@ var EarnInvestedSectionView = ({
               type: "button",
               onClick: () => onItemClick == null ? void 0 : onItemClick(item.strategyId),
               className: tailwindMerge.twMerge(
-                "flex items-center gap-[var(--deframe-widget-size-gap-md)] p-[var(--deframe-widget-size-padding-x-md)] bg-[var(--deframe-widget-color-bg-primary)] rounded-[var(--deframe-widget-size-radius-sm)]",
-                "hover:bg-[var(--deframe-widget-color-bg-tertiary)]",
+                "flex items-center gap-[var(--deframe-widget-size-gap-md)] p-[var(--deframe-widget-size-padding-x-md)] bg-[var(--deframe-widget-color-bg-raised)] rounded-[var(--deframe-widget-size-radius-sm)]",
                 "transition-colors cursor-pointer text-left w-full",
                 !isLast && "border-b border-[var(--deframe-widget-color-border-secondary)]"
               ),
@@ -7680,7 +7678,7 @@ var EarnExploreGridView = ({
       {
         className: tailwindMerge.twMerge(
           "flex flex-col gap-[var(--deframe-widget-size-gap-md)] p-[var(--deframe-widget-size-padding-x-lg)]",
-          "bg-[var(--deframe-widget-color-bg-secondary)] rounded-[var(--deframe-widget-size-radius-sm)]",
+          "bg-[var(--deframe-widget-color-bg-subtle)] rounded-[var(--deframe-widget-size-radius-sm)]",
           className
         ),
         children: [
@@ -7699,7 +7697,7 @@ var EarnExploreGridView = ({
       {
         className: tailwindMerge.twMerge(
           "flex flex-col gap-[var(--deframe-widget-size-gap-md)] p-[var(--deframe-widget-size-padding-x-lg)]",
-          "bg-[var(--deframe-widget-color-bg-secondary)] rounded-[var(--deframe-widget-size-radius-sm)]",
+          "bg-[var(--deframe-widget-color-bg-subtle)] rounded-[var(--deframe-widget-size-radius-sm)]",
           className
         ),
         children: [
@@ -7714,7 +7712,7 @@ var EarnExploreGridView = ({
     {
       className: tailwindMerge.twMerge(
         "flex flex-col gap-[var(--deframe-widget-size-gap-md)] p-[var(--deframe-widget-size-padding-x-lg)]",
-        "bg-[var(--deframe-widget-color-bg-secondary)] rounded-[var(--deframe-widget-size-radius-sm)]",
+        "bg-[var(--deframe-widget-color-bg-subtle)] rounded-[var(--deframe-widget-size-radius-sm)]",
         className
       ),
       children: [
@@ -7763,7 +7761,7 @@ var EarnRecentTransactionsView = ({
     {
       className: tailwindMerge.twMerge(
         "flex flex-col gap-md p-lg",
-        "bg-bg-subtle dark:bg-bg-subtle-dark rounded",
+        "bg-[var(--deframe-widget-color-bg-subtle)] rounded",
         className
       ),
       children: [