@deframe-sdk/components 0.1.26 → 0.1.27

package/dist/index.mjs

@@ -1541,7 +1541,7 @@ var Skeleton = (_a) => {
     width = "100%",
     height = "1rem",
     variant = "text",
-    shimmer = true,
+    shimmer: shimmer2 = true,
     className,
     style
   } = _b, props = __objRest(_b, [
@@ -1567,7 +1567,7 @@ var Skeleton = (_a) => {
         background: defaultGradient
       }, style)
     }, props), {
-      children: shimmer && /* @__PURE__ */ jsx("div", { className: "absolute inset-0 animate-shimmer bg-gradient-to-r from-transparent via-[color-mix(in srgb, var(--deframe-widget-color-bg-tertiary) 92%, transparent)] to-transparent" })
+      children: shimmer2 && /* @__PURE__ */ jsx("div", { className: "absolute inset-0 animate-shimmer bg-gradient-to-r from-transparent via-[color-mix(in srgb, var(--deframe-widget-color-bg-tertiary) 92%, transparent)] to-transparent" })
     })
   );
 };
@@ -8443,6 +8443,35 @@ var EarnPositionCardView = ({
     /* @__PURE__ */ jsx(TextBody, { as: "span", variant: "text-small", className: "text-[color:var(--deframe-widget-color-text-tertiary)]", children: balanceToken })
   ] })
 ] }) }) }) });
+var shimmer = "animate-pulse rounded-[var(--deframe-widget-size-radius-sm)]";
+var bg = "bg-[var(--deframe-widget-color-bg-tertiary)]";
+var EarnFlowSkeletonSimple = () => {
+  const panelClasses = [
+    "relative flex flex-col overflow-hidden w-[420px]",
+    "rounded-[var(--deframe-widget-size-radius-md)]",
+    "border border-[color:var(--deframe-widget-color-border-secondary)]",
+    "font-[var(--deframe-widget-font-family)]"
+  ].join(" ");
+  return /* @__PURE__ */ jsxs("div", { "data-test-id": "earn-flow-skeleton-simple", className: panelClasses, children: [
+    /* @__PURE__ */ jsx("div", { className: "flex items-center px-[var(--deframe-widget-size-padding-x-md)] py-[var(--deframe-widget-size-padding-y-md)]", children: /* @__PURE__ */ jsx("div", { className: `w-24 h-5 ${shimmer} ${bg}` }) }),
+    /* @__PURE__ */ jsx("div", { className: "h-px bg-[var(--deframe-widget-color-border-secondary)]" }),
+    /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-[var(--deframe-widget-size-gap-md)] px-[var(--deframe-widget-size-padding-x-md)] py-[var(--deframe-widget-size-padding-y-md)]", children: /* @__PURE__ */ jsxs("div", { className: "rounded-[var(--deframe-widget-size-radius-sm)] border border-[color:var(--deframe-widget-color-border-secondary)] bg-[var(--deframe-widget-color-bg-secondary)] px-[var(--deframe-widget-size-padding-x-md)] py-[var(--deframe-widget-size-padding-y-md)]", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-[var(--deframe-widget-size-gap-sm)]", children: [
+        /* @__PURE__ */ jsx("div", { className: `w-[120px] h-[42px] ${shimmer} ${bg} flex-shrink-0` }),
+        /* @__PURE__ */ jsx("div", { className: "w-px h-10 bg-[var(--deframe-widget-color-border-secondary)] flex-shrink-0" }),
+        /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-end flex-1 min-w-0 gap-1", children: [
+          /* @__PURE__ */ jsx("div", { className: `w-20 h-9 ${shimmer} ${bg}` }),
+          /* @__PURE__ */ jsx("div", { className: `w-12 h-4 ${shimmer} ${bg}` })
+        ] })
+      ] }),
+      /* @__PURE__ */ jsx("div", { className: "mt-[var(--deframe-widget-size-gap-sm)]", children: /* @__PURE__ */ jsx("div", { className: `w-32 h-4 ${shimmer} ${bg}` }) })
+    ] }) }),
+    /* @__PURE__ */ jsxs("div", { className: "flex gap-[var(--deframe-widget-size-gap-sm)] px-[var(--deframe-widget-size-padding-x-md)] pb-[var(--deframe-widget-size-padding-y-md)]", children: [
+      /* @__PURE__ */ jsx("div", { className: `flex-1 h-12 ${shimmer} ${bg}` }),
+      /* @__PURE__ */ jsx("div", { className: `flex-1 h-12 ${shimmer} ${bg}` })
+    ] })
+  ] });
+};
 var EarnDepositFormView = ({
   // Header / Layout
   headerTitle,
@@ -8595,7 +8624,7 @@ var EarnTokenSelectorSimpleView = ({
   const isInteractive = !!onTokenClick;
   const baseClasses = [
     "inline-flex items-center gap-[10px]",
-    "py-[var(--deframe-widget-size-padding-y-sm)] px-[10px]",
+    "h-[54px] px-[10px]",
     "rounded-[var(--deframe-widget-size-radius-sm)]",
     "bg-[var(--deframe-widget-color-bg-tertiary)]",
     "border-none outline-none",
@@ -8603,7 +8632,7 @@ var EarnTokenSelectorSimpleView = ({
     "flex-shrink-0"
   ].join(" ");
   const stateClasses = {
-    interactive: "cursor-pointer hover:bg-[color:color-mix(in_srgb,var(--deframe-widget-color-bg-tertiary)_80%,var(--deframe-widget-color-border-secondary))]",
+    interactive: "cursor-pointer hover:bg-[color:color-mix(in_srgb,var(--deframe-widget-color-bg-tertiary)_72%,transparent)]",
     static: "cursor-default"
   };
   const selectorClasses = twMerge(
@@ -8712,7 +8741,7 @@ var EarnTokenSelectorSimpleView = ({
           "span",
           {
             "data-test-id": "earn-token-selector-simple-view-placeholder",
-            className: "text-[12px] tracking-[0.08em] uppercase [font-weight:var(--deframe-widget-font-weight-semibold)] text-[color:var(--deframe-widget-color-text-tertiary)] font-[var(--deframe-widget-font-family)] leading-[1] whitespace-nowrap",
+            className: "text-[11px] uppercase [font-weight:var(--deframe-widget-font-weight-regular)] text-[color:var(--deframe-widget-color-text-secondary)] font-[var(--deframe-widget-font-family)] whitespace-nowrap",
             children: selectTokenLabel
           }
         ),
@@ -8741,6 +8770,7 @@ var EarnAmountInputSimpleView = ({
     "w-full",
     "px-[var(--deframe-widget-size-padding-x-none)] py-[var(--deframe-widget-size-padding-y-none)]",
     "font-[var(--deframe-widget-font-family)]",
+    "placeholder:text-[color:var(--deframe-widget-color-text-tertiary)]",
     "[appearance:textfield]",
     "[&::-webkit-outer-spin-button]:appearance-none",
     "[&::-webkit-inner-spin-button]:appearance-none"
@@ -8990,7 +9020,6 @@ var EarnDepositFormViewSimple = ({
   const panelBaseClasses = [
     "relative flex flex-col overflow-hidden w-[420px]",
     "rounded-[var(--deframe-widget-size-radius-md)]",
-    "bg-[var(--deframe-widget-color-bg-primary)]",
     "border border-[color:var(--deframe-widget-color-border-secondary)]",
     "font-[var(--deframe-widget-font-family)]"
   ].join(" ");
@@ -9209,9 +9238,11 @@ var EarnDepositFormViewSimple = ({
                     type: "submit",
                     className: [
                       "flex-1 h-12 rounded-[var(--deframe-widget-size-radius-sm)]",
-                      "text-[15px] text-[color:var(--deframe-widget-color-text-primary-dark)]",
+                      "border-none",
+                      "text-[15px]",
+                      isSubmitDisabled ? "text-[color:var(--deframe-widget-color-text-primary-disabled)]" : "text-[color:var(--deframe-widget-color-text-primary-dark)]",
                       "outline-none",
-                      "transition-[background,color,opacity] duration-150"
+                      "transition-[background,color] duration-200"
                     ].join(" "),
                     disabled: isSubmitDisabled,
                     "aria-disabled": isSubmitDisabled,
@@ -9443,7 +9474,6 @@ var EarnWithdrawFormViewSimple = ({
   const panelBaseClasses = [
     "relative flex flex-col overflow-hidden w-[420px]",
     "rounded-[var(--deframe-widget-size-radius-md)]",
-    "bg-[var(--deframe-widget-color-bg-primary)]",
     "border border-[color:var(--deframe-widget-color-border-secondary)]",
     "font-[var(--deframe-widget-font-family)]"
   ].join(" ");
@@ -9651,9 +9681,11 @@ var EarnWithdrawFormViewSimple = ({
                     type: "submit",
                     className: [
                       "flex-1 h-12 rounded-[var(--deframe-widget-size-radius-sm)]",
-                      "text-[15px] text-[color:var(--deframe-widget-color-text-primary-dark)]",
+                      "border-none",
+                      "text-[15px]",
+                      isSubmitDisabled ? "text-[color:var(--deframe-widget-color-text-primary-disabled)]" : "text-[color:var(--deframe-widget-color-text-primary-dark)]",
                       "outline-none",
-                      "transition-[background,color,opacity] duration-150"
+                      "transition-[background,color] duration-200"
                     ].join(" "),
                     disabled: isSubmitDisabled,
                     "aria-disabled": isSubmitDisabled,
@@ -9873,7 +9905,6 @@ function EarnFeedbackOverlaySimpleView({
   const wrapperClasses = twMerge(
     "relative flex flex-col overflow-hidden w-[420px]",
     "rounded-[var(--deframe-widget-size-radius-md)]",
-    "bg-[var(--deframe-widget-color-bg-primary)]",
     "border border-[color:var(--deframe-widget-color-border-secondary)]",
     "font-[var(--deframe-widget-font-family)]"
   );
@@ -12062,6 +12093,6 @@ var DashboardViewSimple = ({
   );
 };
 
-export { ActionButton, ActionSheet, AddressDisplay, ApyRange, BackButton, BackgroundContainer, BannerNotification, Chip, ChipGroup, ChooseANetworkView, ChooseAStrategyActionsheetView, ChooseAnAssetSwapView, ChooseNetworkAndAssetViewSimple, CloseButton_default as CloseButton, CollapsibleInfoRow, CollapsibleSection, ConfirmSwapButtonView, ConfirmSwapButtonViewSimple, ConnectWalletList, Currency, DashboardBalancesBreakdown, DashboardCard, DashboardInvestmentOpportunitiesView, DashboardPortfolioView, DashboardPortfolioViewSimple, DashboardRecentTransactionsView, DashboardRecentTransactionsViewSimple, DashboardStrategiesListView, DashboardTokenListView, DashboardTokensView, DashboardTokensViewSimple, DashboardTransactionsPlaceholder, DashboardView, DashboardViewSimple, DeframeComponentsProvider, DetailsHeader, EarnAmountInputView, EarnBalanceCard, EarnBytecodeErrorView, EarnDepositFailedSimpleView, EarnDepositFailedView, EarnDepositFormView, EarnDepositFormViewSimple, EarnDepositProcessingSimpleView, EarnDepositProcessingView, EarnDepositSuccessSimpleView, EarnDepositSuccessView, EarnDepositWarningSimpleView, EarnDepositWarningView, EarnDesktopView, EarnExploreGridView, EarnInvestedSectionView, EarnInvestmentDetailsView, EarnInvestmentSummaryView, EarnNoBalanceNotificationView, EarnOverviewView, EarnPercentageButtonsView, EarnPositionCardView, EarnRecentTransactionsView, EarnTokenSelectorView, EarnTxStatusCardView, EarnWithdrawFailedSimpleView, EarnWithdrawFailedView, EarnWithdrawFormView, EarnWithdrawFormViewSimple, EarnWithdrawProcessingSimpleView, EarnWithdrawProcessingView, EarnWithdrawSuccessSimpleView, EarnWithdrawSuccessView, EarnWithdrawTokenSelectorView, EarnWithdrawWarningSimpleView, EarnWithdrawWarningView, Currency as Fiat, FlexCol, FlexRow, GroupedStrategyListView, HighRiskBadge, HistoryDepositDetailsView, HistoryListSkeleton, HistoryListView, HistorySwapDetailsView, HistoryTabEmpty, HistoryWithdrawDetailsView, InfoLabel, InfoRow, InfoRowIconLabel, InfoRowIconValue, InfoRowWithIcon, InfoValue, Input2 as Input, InvestmentCrossChainProcessingView, Label, Link, ListItem, ListItemContent, ListItemLeftSide, ListItemRightSide, LoadingDots, LowRiskBadge, MediumRiskBadge, Navbar, PercentageButton, PrimaryButton, ProcessingBadge, ProgressIndicator, ScrollableContent, SearchEmptyState, SearchInput, SecondaryButton, SectionCard, Select, SelectContent, SelectItem, SelectTrigger, Skeleton, StepDisplay, StepStatusIcon, StepStatusText, StrategyDetailsView, StrategyGridCard, SummaryDetails, SummaryDetailsCryptoControlV2, SwapAdvancedSettingsView, SwapAmountInputView, SwapCrossChainProcessingView, SwapFormView, SwapFormViewSimple, SwapFromCardView, SwapFromCardViewSimple, SwapHistoryView, SwapProcessingView, SwapProcessingViewSimple, SwapQuoteDetailsView, SwapSignatureWarningView, SwapSignatureWarningViewSimple, SwapSuccessView, SwapSuccessViewSimple, SwapToCardView, SwapToCardViewSimple, SwapTransactionFailedView, SwapTransactionFailedViewSimple, SwapWidgetFallbackView, Tabs, TabsContent, TabsList, TabsTrigger, TertiaryButton, Text_default as Text, TextAccent, TextBody, TextHeading, Title, TokenWithChainBadge, TransactionProcessingDetails, TransactionScreen, TransactionScreenIcon, TransactionScreenInvestmentCard, WalletBalances, WalletConnectPanel, WalletItem, ConnectWalletList as WalletList, WalletListContainer, isDustValue };
+export { ActionButton, ActionSheet, AddressDisplay, ApyRange, BackButton, BackgroundContainer, BannerNotification, Chip, ChipGroup, ChooseANetworkView, ChooseAStrategyActionsheetView, ChooseAnAssetSwapView, ChooseNetworkAndAssetViewSimple, CloseButton_default as CloseButton, CollapsibleInfoRow, CollapsibleSection, ConfirmSwapButtonView, ConfirmSwapButtonViewSimple, ConnectWalletList, Currency, DashboardBalancesBreakdown, DashboardCard, DashboardInvestmentOpportunitiesView, DashboardPortfolioView, DashboardPortfolioViewSimple, DashboardRecentTransactionsView, DashboardRecentTransactionsViewSimple, DashboardStrategiesListView, DashboardTokenListView, DashboardTokensView, DashboardTokensViewSimple, DashboardTransactionsPlaceholder, DashboardView, DashboardViewSimple, DeframeComponentsProvider, DetailsHeader, EarnAmountInputView, EarnBalanceCard, EarnBytecodeErrorView, EarnDepositFailedSimpleView, EarnDepositFailedView, EarnDepositFormView, EarnDepositFormViewSimple, EarnDepositProcessingSimpleView, EarnDepositProcessingView, EarnDepositSuccessSimpleView, EarnDepositSuccessView, EarnDepositWarningSimpleView, EarnDepositWarningView, EarnDesktopView, EarnExploreGridView, EarnFlowSkeletonSimple, EarnInvestedSectionView, EarnInvestmentDetailsView, EarnInvestmentSummaryView, EarnNoBalanceNotificationView, EarnOverviewView, EarnPercentageButtonsView, EarnPositionCardView, EarnRecentTransactionsView, EarnTokenSelectorView, EarnTxStatusCardView, EarnWithdrawFailedSimpleView, EarnWithdrawFailedView, EarnWithdrawFormView, EarnWithdrawFormViewSimple, EarnWithdrawProcessingSimpleView, EarnWithdrawProcessingView, EarnWithdrawSuccessSimpleView, EarnWithdrawSuccessView, EarnWithdrawTokenSelectorView, EarnWithdrawWarningSimpleView, EarnWithdrawWarningView, Currency as Fiat, FlexCol, FlexRow, GroupedStrategyListView, HighRiskBadge, HistoryDepositDetailsView, HistoryListSkeleton, HistoryListView, HistorySwapDetailsView, HistoryTabEmpty, HistoryWithdrawDetailsView, InfoLabel, InfoRow, InfoRowIconLabel, InfoRowIconValue, InfoRowWithIcon, InfoValue, Input2 as Input, InvestmentCrossChainProcessingView, Label, Link, ListItem, ListItemContent, ListItemLeftSide, ListItemRightSide, LoadingDots, LowRiskBadge, MediumRiskBadge, Navbar, PercentageButton, PrimaryButton, ProcessingBadge, ProgressIndicator, ScrollableContent, SearchEmptyState, SearchInput, SecondaryButton, SectionCard, Select, SelectContent, SelectItem, SelectTrigger, Skeleton, StepDisplay, StepStatusIcon, StepStatusText, StrategyDetailsView, StrategyGridCard, SummaryDetails, SummaryDetailsCryptoControlV2, SwapAdvancedSettingsView, SwapAmountInputView, SwapCrossChainProcessingView, SwapFormView, SwapFormViewSimple, SwapFromCardView, SwapFromCardViewSimple, SwapHistoryView, SwapProcessingView, SwapProcessingViewSimple, SwapQuoteDetailsView, SwapSignatureWarningView, SwapSignatureWarningViewSimple, SwapSuccessView, SwapSuccessViewSimple, SwapToCardView, SwapToCardViewSimple, SwapTransactionFailedView, SwapTransactionFailedViewSimple, SwapWidgetFallbackView, Tabs, TabsContent, TabsList, TabsTrigger, TertiaryButton, Text_default as Text, TextAccent, TextBody, TextHeading, Title, TokenWithChainBadge, TransactionProcessingDetails, TransactionScreen, TransactionScreenIcon, TransactionScreenInvestmentCard, WalletBalances, WalletConnectPanel, WalletItem, ConnectWalletList as WalletList, WalletListContainer, isDustValue };
 //# sourceMappingURL=index.mjs.map
 //# sourceMappingURL=index.mjs.map