@deframe-sdk/components 0.1.63 → 0.1.64

package/dist/index.mjs

@@ -11888,6 +11888,185 @@ var EarnFlowSkeletonSimple = () => {
     ] })
   ] });
 };
+var EarnHistoryView = ({
+  items,
+  isLoading,
+  onClose,
+  onItemClick,
+  labels,
+  className
+}) => {
+  const [query, setQuery] = useState("");
+  const filtered = useMemo(() => {
+    const q = query.trim().toLowerCase();
+    if (!q) return items;
+    return items.filter(
+      (item) => historyResolveSearchableText(item, labels.historyItem, labels.locale).includes(q)
+    );
+  }, [items, query, labels.historyItem, labels.locale]);
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      "data-test-id": "earn-history-view",
+      className: twMerge(
+        "bg-[var(--deframe-widget-color-bg-secondary)]",
+        "rounded-[var(--deframe-widget-size-radius-md)]",
+        "border border-[color:var(--deframe-widget-color-border-secondary)]",
+        "px-[var(--deframe-widget-size-padding-x-md)] py-[var(--deframe-widget-size-padding-y-md)]",
+        "flex flex-col gap-[var(--deframe-widget-size-gap-md)] h-[calc(100vh-48px)]",
+        "font-[var(--deframe-widget-font-family)]",
+        "w-full max-w-[900px] mx-auto shrink-0 box-border",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsxs(
+          "div",
+          {
+            "data-test-id": "earn-history-view-header",
+            className: "flex items-start justify-between gap-[var(--deframe-widget-size-gap-sm)]",
+            children: [
+              /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-[4px]", children: [
+                /* @__PURE__ */ jsx(
+                  "h2",
+                  {
+                    "data-test-id": "earn-history-view-title",
+                    className: twMerge(
+                      "m-0 text-[20px] leading-[1.25]",
+                      "[font-weight:var(--deframe-widget-font-weight-bold)]",
+                      "text-[color:var(--deframe-widget-color-text-primary)]"
+                    ),
+                    children: labels.title
+                  }
+                ),
+                /* @__PURE__ */ jsx(
+                  "p",
+                  {
+                    "data-test-id": "earn-history-view-subtitle",
+                    className: "m-0 text-[13px] text-[color:var(--deframe-widget-color-text-secondary)] leading-[1.4]",
+                    children: labels.subtitle
+                  }
+                )
+              ] }),
+              /* @__PURE__ */ jsx(
+                CloseButton_default,
+                {
+                  onClick: onClose,
+                  ariaLabel: labels.closeAriaLabel,
+                  className: "flex-shrink-0 mt-[-4px]"
+                }
+              )
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx("div", { className: "h-px bg-[var(--deframe-widget-color-border-secondary)]" }),
+        /* @__PURE__ */ jsxs(
+          "div",
+          {
+            "data-test-id": "earn-history-view-search",
+            className: "relative",
+            children: [
+              /* @__PURE__ */ jsx(
+                "input",
+                {
+                  "data-test-id": "earn-history-view-search-input",
+                  type: "text",
+                  value: query,
+                  onChange: (e) => setQuery(e.target.value),
+                  placeholder: labels.searchPlaceholder,
+                  "aria-label": labels.searchAriaLabel,
+                  className: [
+                    "w-full box-border h-10",
+                    "bg-[var(--deframe-widget-color-bg-tertiary)]",
+                    "border border-[color:var(--deframe-widget-color-border-secondary)]",
+                    "rounded-[var(--deframe-widget-size-radius-sm)]",
+                    "py-0 pr-[var(--deframe-widget-size-padding-x-xl)] pl-[14px]",
+                    "text-[14px] text-[color:var(--deframe-widget-color-text-primary)]",
+                    "outline-none focus:outline-none",
+                    "focus:border-[color:var(--deframe-widget-color-brand-primary)]",
+                    "transition-colors duration-150",
+                    "font-[var(--deframe-widget-font-family)]",
+                    "placeholder:text-[color:var(--deframe-widget-color-text-tertiary)]"
+                  ].join(" ")
+                }
+              ),
+              /* @__PURE__ */ jsx("div", { className: "absolute right-3 top-1/2 -translate-y-1/2 pointer-events-none text-[color:var(--deframe-widget-color-text-tertiary)]", children: /* @__PURE__ */ jsxs(
+                "svg",
+                {
+                  width: "15",
+                  height: "15",
+                  viewBox: "0 0 24 24",
+                  fill: "none",
+                  stroke: "currentColor",
+                  strokeWidth: "2",
+                  strokeLinecap: "round",
+                  "aria-hidden": "true",
+                  children: [
+                    /* @__PURE__ */ jsx("circle", { cx: "11", cy: "11", r: "8" }),
+                    /* @__PURE__ */ jsx("line", { x1: "21", y1: "21", x2: "16.65", y2: "16.65" })
+                  ]
+                }
+              ) })
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "div",
+          {
+            "data-test-id": "earn-history-view-list",
+            className: "flex flex-col gap-[var(--deframe-widget-size-gap-sm)] flex-1 min-h-0 overflow-y-auto [&::-webkit-scrollbar]:w-[6px] [&::-webkit-scrollbar-track]:bg-transparent [&::-webkit-scrollbar-thumb]:bg-[color:var(--deframe-widget-color-border-secondary)] [&::-webkit-scrollbar-thumb]:rounded-full",
+            children: isLoading ? [1, 2, 3].map((i) => /* @__PURE__ */ jsxs(
+              "div",
+              {
+                className: twMerge(
+                  "flex flex-col gap-[6px]",
+                  "px-[var(--deframe-widget-size-padding-x-md)] py-[14px]",
+                  "rounded-[var(--deframe-widget-size-radius-sm)]",
+                  "border border-[color:var(--deframe-widget-color-border-secondary)]"
+                ),
+                children: [
+                  /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
+                    /* @__PURE__ */ jsx(Skeleton, { width: "100px", height: "12px", shimmer: true }),
+                    /* @__PURE__ */ jsx(Skeleton, { width: "80px", height: "20px", shimmer: true, className: "rounded-full" })
+                  ] }),
+                  /* @__PURE__ */ jsxs("div", { className: "flex items-start justify-between", children: [
+                    /* @__PURE__ */ jsx(Skeleton, { width: "160px", height: "18px", shimmer: true }),
+                    /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-end gap-[4px]", children: [
+                      /* @__PURE__ */ jsx(Skeleton, { width: "96px", height: "14px", shimmer: true }),
+                      /* @__PURE__ */ jsx(Skeleton, { width: "72px", height: "12px", shimmer: true })
+                    ] })
+                  ] })
+                ]
+              },
+              i
+            )) : items.length === 0 ? /* @__PURE__ */ jsx(DashboardTransactionsPlaceholder, { title: labels.emptyTitle, description: labels.emptyDescription }) : filtered.length === 0 ? /* @__PURE__ */ jsx(
+              "div",
+              {
+                "data-test-id": "earn-history-view-no-results",
+                className: "py-[var(--deframe-widget-size-padding-y-xl)] text-center text-[13px] text-[color:var(--deframe-widget-color-text-tertiary)]",
+                children: labels.emptyTitle
+              }
+            ) : filtered.map((item) => /* @__PURE__ */ jsx(
+              "div",
+              {
+                onClick: onItemClick ? () => onItemClick(item.id) : void 0,
+                className: onItemClick ? "cursor-pointer" : void 0,
+                children: /* @__PURE__ */ jsx(
+                  HistoryListItemSimple,
+                  {
+                    item,
+                    labels: labels.historyItem,
+                    locale: labels.locale
+                  }
+                )
+              },
+              item.id
+            ))
+          }
+        )
+      ]
+    }
+  );
+};
 var EarnDepositFormView = ({
   // Header / Layout
   headerTitle,
@@ -19210,6 +19389,6 @@ var DashboardViewSimple = ({
   );
 };
 
-export { ActionButton, ActionSheet, AddressDisplay, ApyRange, BackButton, BackgroundContainer, BannerNotification, Chip, ChipGroup, ChoiceCard, 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, DepositSuccessIcon, DetailsHeader, EARN_CATEGORY_DEFINITIONS, EarnAmountInputView, EarnBalanceCard, EarnBytecodeErrorView, EarnDepositFailedSimpleView, EarnDepositFailedView, EarnDepositFormView, EarnDepositFormViewSimple, EarnDepositProcessingSimpleView, EarnDepositProcessingView, EarnDepositSuccessSimpleView, EarnDepositSuccessView, EarnDepositWarningSimpleView, EarnDepositWarningView, EarnDesktopView, EarnDesktopViewSimple, 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, HistoryListItem, HistoryListItemSimple, HistoryListSkeleton, HistoryListView, HistorySwapDetailsView, HistoryTabEmpty, HistoryWithdrawDetailsView, InfoLabel, InfoRow, InfoRowIconLabel, InfoRowIconValue, InfoRowWithIcon, InfoValue, Input2 as Input, InputField, InputLabel, Input as InputRoot, InvestmentCrossChainProcessingSimpleView, InvestmentCrossChainProcessingView, KYCActionRow, KYCAddressPage, KYCBasicDataPage, KYCChecklistCard, KYCChecklistItem, KYCDataCard, KYCDocumentPage, KYCEditPage, KYCFieldMessage, KYCFormPage, KYCInfoRow, KYCIntroPage, KYCLoadingPage, KYCMessageBanner, KYCPageHeader, KYCPageSection, KYCPageShell, KYCReviewPage, KYCReviewPageSkeleton, KYCStatusItemCard, KYCStatusPage, KYCStatusPanel, KYCStepIndicator, KycLoadingView, KycRequiredView, Label, Link, ListItem, ListItemContent, ListItemLeftSide, ListItemRightSide, LoadingDots, LowRiskBadge, MediumRiskBadge, Navbar, OffchainMethodSelectionView, OfframpFailedSimpleView, OfframpInputFormSimpleView, OfframpInputFormView, OfframpProcessingSimpleView, OfframpProcessingView, OfframpSuccessSimpleView, OfframpSuccessView, OnchainDepositFormSimpleView, OnchainDepositFormView, OnchainDepositSuccessSimpleView, OnchainDepositSuccessView, OnchainWithdrawChainSelectorView, OnchainWithdrawFailedSimpleView, OnchainWithdrawFailedView, OnchainWithdrawFormSimpleView, OnchainWithdrawFormView, OnchainWithdrawProcessingSimpleView, OnchainWithdrawSignatureWarningSimpleView, OnchainWithdrawSignatureWarningView, OnchainWithdrawSuccessSimpleView, OnchainWithdrawSuccessView, OnrampFormSimpleView, OnrampFormView, OnrampPixcodeView, OnrampSuccessSimpleView, OnrampSuccessView, PercentageButton, PrimaryButton, ProcessingBadge, ProgressIndicator, ScrollableContent, SearchEmptyState, SearchInput, SecondaryButton, SectionCard, Select, SelectContent, SelectItem, SelectTrigger, Skeleton, StepDisplay, StepStatusIcon, StepStatusText, StrategyDetailsView, StrategyGridCard, SummaryDetails, SummaryDetailsCryptoControlV2, SwapAdvancedSettingsView, SwapAmountInputView, SwapCrossChainProcessingView, SwapCrossChainProcessingViewSimple, SwapFormView, SwapFormViewSimple, SwapFromCardView, SwapFromCardViewSimple, SwapHistoryView, SwapHistoryViewSimple, 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, WithdrawFailedIcon, WithdrawSuccessIcon, isDustValue, truncateAddress };
+export { ActionButton, ActionSheet, AddressDisplay, ApyRange, BackButton, BackgroundContainer, BannerNotification, Chip, ChipGroup, ChoiceCard, 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, DepositSuccessIcon, DetailsHeader, EARN_CATEGORY_DEFINITIONS, EarnAmountInputView, EarnBalanceCard, EarnBytecodeErrorView, EarnDepositFailedSimpleView, EarnDepositFailedView, EarnDepositFormView, EarnDepositFormViewSimple, EarnDepositProcessingSimpleView, EarnDepositProcessingView, EarnDepositSuccessSimpleView, EarnDepositSuccessView, EarnDepositWarningSimpleView, EarnDepositWarningView, EarnDesktopView, EarnDesktopViewSimple, EarnExploreGridView, EarnFlowSkeletonSimple, EarnHistoryView, 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, HistoryListItem, HistoryListItemSimple, HistoryListSkeleton, HistoryListView, HistorySwapDetailsView, HistoryTabEmpty, HistoryWithdrawDetailsView, InfoLabel, InfoRow, InfoRowIconLabel, InfoRowIconValue, InfoRowWithIcon, InfoValue, Input2 as Input, InputField, InputLabel, Input as InputRoot, InvestmentCrossChainProcessingSimpleView, InvestmentCrossChainProcessingView, KYCActionRow, KYCAddressPage, KYCBasicDataPage, KYCChecklistCard, KYCChecklistItem, KYCDataCard, KYCDocumentPage, KYCEditPage, KYCFieldMessage, KYCFormPage, KYCInfoRow, KYCIntroPage, KYCLoadingPage, KYCMessageBanner, KYCPageHeader, KYCPageSection, KYCPageShell, KYCReviewPage, KYCReviewPageSkeleton, KYCStatusItemCard, KYCStatusPage, KYCStatusPanel, KYCStepIndicator, KycLoadingView, KycRequiredView, Label, Link, ListItem, ListItemContent, ListItemLeftSide, ListItemRightSide, LoadingDots, LowRiskBadge, MediumRiskBadge, Navbar, OffchainMethodSelectionView, OfframpFailedSimpleView, OfframpInputFormSimpleView, OfframpInputFormView, OfframpProcessingSimpleView, OfframpProcessingView, OfframpSuccessSimpleView, OfframpSuccessView, OnchainDepositFormSimpleView, OnchainDepositFormView, OnchainDepositSuccessSimpleView, OnchainDepositSuccessView, OnchainWithdrawChainSelectorView, OnchainWithdrawFailedSimpleView, OnchainWithdrawFailedView, OnchainWithdrawFormSimpleView, OnchainWithdrawFormView, OnchainWithdrawProcessingSimpleView, OnchainWithdrawSignatureWarningSimpleView, OnchainWithdrawSignatureWarningView, OnchainWithdrawSuccessSimpleView, OnchainWithdrawSuccessView, OnrampFormSimpleView, OnrampFormView, OnrampPixcodeView, OnrampSuccessSimpleView, OnrampSuccessView, PercentageButton, PrimaryButton, ProcessingBadge, ProgressIndicator, ScrollableContent, SearchEmptyState, SearchInput, SecondaryButton, SectionCard, Select, SelectContent, SelectItem, SelectTrigger, Skeleton, StepDisplay, StepStatusIcon, StepStatusText, StrategyDetailsView, StrategyGridCard, SummaryDetails, SummaryDetailsCryptoControlV2, SwapAdvancedSettingsView, SwapAmountInputView, SwapCrossChainProcessingView, SwapCrossChainProcessingViewSimple, SwapFormView, SwapFormViewSimple, SwapFromCardView, SwapFromCardViewSimple, SwapHistoryView, SwapHistoryViewSimple, 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, WithdrawFailedIcon, WithdrawSuccessIcon, isDustValue, truncateAddress };
 //# sourceMappingURL=index.mjs.map
 //# sourceMappingURL=index.mjs.map