@deframe-sdk/components 0.1.23 → 0.1.24

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.js CHANGED
@@ -7443,6 +7443,45 @@ var SwapWidgetFallbackView = ({
7443
7443
  }
7444
7444
  );
7445
7445
  };
7446
+ var Chip = ({
7447
+ label,
7448
+ selected = false,
7449
+ onClick,
7450
+ className
7451
+ }) => {
7452
+ const baseStyles = [
7453
+ "h-8 px-4 rounded-sm",
7454
+ "flex items-center justify-center gap-2",
7455
+ "text-xs font-normal font-poppins leading-5",
7456
+ "transition-colors duration-200 cursor-pointer"
7457
+ ].join(" ");
7458
+ const selectedStyles = selected ? "bg-[var(--deframe-widget-color-brand-secondary)] text-[var(--deframe-widget-color-text-inverse)]" : "bg-transparent border border-[var(--deframe-widget-color-border-default)] text-[var(--deframe-widget-color-text-secondary)] hover:bg-[var(--deframe-widget-color-bg-subtle)]";
7459
+ return /* @__PURE__ */ jsxRuntime.jsx(
7460
+ "button",
7461
+ {
7462
+ type: "button",
7463
+ onClick,
7464
+ className: tailwindMerge.twMerge(baseStyles, selectedStyles, className),
7465
+ children: label
7466
+ }
7467
+ );
7468
+ };
7469
+ var ChipGroup = ({
7470
+ options,
7471
+ selected,
7472
+ onSelect,
7473
+ className
7474
+ }) => {
7475
+ return /* @__PURE__ */ jsxRuntime.jsx("div", { className: tailwindMerge.twMerge("flex flex-row flex-wrap gap-2", className), children: options.map((option) => /* @__PURE__ */ jsxRuntime.jsx(
7476
+ Chip,
7477
+ {
7478
+ label: option.label,
7479
+ selected: selected === option.value,
7480
+ onClick: () => onSelect(option.value)
7481
+ },
7482
+ option.value
7483
+ )) });
7484
+ };
7446
7485
  var ApyRange = ({ children }) => {
7447
7486
  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-right justify-center text-text-highlight text-xs font-normal leading-4", children });
7448
7487
  };
@@ -7568,80 +7607,403 @@ var EarnBalanceCard = ({
7568
7607
  ] })
7569
7608
  ] });
7570
7609
  };
7571
- var EarnInvestmentSummaryView = ({
7572
- overviewDescription,
7573
- totalInvestedLabel,
7574
- totalInvestedValue,
7575
- totalReturnLabel,
7576
- totalReturnValue,
7577
- processingBadgeLabel,
7578
- processingBadgeTitle,
7579
- className
7610
+ var GroupLabel = ({ children }) => /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-text-secondary dark:text-text-secondary-dark text-sm font-medium font-poppins py-3", children });
7611
+ var GroupedStrategyListView = ({
7612
+ isLoading,
7613
+ loadingLabel,
7614
+ error,
7615
+ errorLabel,
7616
+ investedLabel,
7617
+ investedItems,
7618
+ bestPerformanceLabel,
7619
+ bestPerformanceItems,
7620
+ allStrategiesLabel,
7621
+ allStrategiesItems
7580
7622
  }) => {
7581
- 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: [
7582
- /* @__PURE__ */ jsxRuntime.jsx(TextBody, { variant: "text-small", className: "text-text-secondary dark:text-text-secondary-dark", children: overviewDescription }),
7583
- /* @__PURE__ */ jsxRuntime.jsx(
7584
- WalletBalances,
7585
- {
7586
- cards: [
7587
- {
7588
- label: totalInvestedLabel,
7589
- value: totalInvestedValue,
7590
- badge: processingBadgeLabel ? /* @__PURE__ */ jsxRuntime.jsx(
7591
- ProcessingBadge,
7623
+ const hasInvested = investedItems.length > 0;
7624
+ const hasBestPerformance = bestPerformanceItems.length > 0;
7625
+ const hasAllStrategies = allStrategiesItems.length > 0;
7626
+ if (isLoading) {
7627
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center py-md", children: [
7628
+ loadingLabel,
7629
+ " ",
7630
+ /* @__PURE__ */ jsxRuntime.jsx(LoadingDots, {})
7631
+ ] });
7632
+ }
7633
+ if (error) {
7634
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "p-4 text-center text-red-500", children: [
7635
+ errorLabel,
7636
+ ": ",
7637
+ error.message
7638
+ ] });
7639
+ }
7640
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "w-full flex flex-col gap-sm flex-1 min-h-0 overflow-y-auto", children: [
7641
+ hasInvested && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
7642
+ /* @__PURE__ */ jsxRuntime.jsx(GroupLabel, { children: investedLabel }),
7643
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-sm", children: investedItems.map((item) => /* @__PURE__ */ jsxRuntime.jsxs(
7644
+ ListItem,
7645
+ {
7646
+ onClick: () => item.onClick(),
7647
+ children: [
7648
+ /* @__PURE__ */ jsxRuntime.jsx(ListItemLeftSide, { children: /* @__PURE__ */ jsxRuntime.jsx(
7649
+ "img",
7592
7650
  {
7593
- label: processingBadgeLabel,
7594
- title: processingBadgeTitle
7651
+ src: item.logoUrl,
7652
+ alt: item.subtitle,
7653
+ className: "w-10 h-10 rounded-full"
7595
7654
  }
7596
- ) : void 0
7597
- },
7598
- { label: totalReturnLabel, value: totalReturnValue }
7599
- ],
7600
- variant: "raised",
7601
- className: "grid grid-cols-2 gap-md !mt-0"
7655
+ ) }),
7656
+ /* @__PURE__ */ jsxRuntime.jsxs(ListItemContent, { children: [
7657
+ /* @__PURE__ */ jsxRuntime.jsx(TextBody, { children: item.title }),
7658
+ /* @__PURE__ */ jsxRuntime.jsx(TextBody, { variant: "text-small", children: item.subtitle })
7659
+ ] }),
7660
+ /* @__PURE__ */ jsxRuntime.jsx(ListItemRightSide, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-row justify-between items-center", children: [
7661
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-end", children: [
7662
+ /* @__PURE__ */ jsxRuntime.jsx(TextBody, { children: item.balanceFormatted }),
7663
+ /* @__PURE__ */ jsxRuntime.jsx(TextBody, { variant: "text-small", children: item.profitFormatted })
7664
+ ] }),
7665
+ /* @__PURE__ */ jsxRuntime.jsx(md.MdArrowRight, { className: "w-6 h-6" })
7666
+ ] }) })
7667
+ ]
7668
+ },
7669
+ `invested-${item.id}`
7670
+ )) })
7671
+ ] }),
7672
+ hasBestPerformance && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
7673
+ /* @__PURE__ */ jsxRuntime.jsx(GroupLabel, { children: bestPerformanceLabel }),
7674
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-sm", children: bestPerformanceItems.map((item) => /* @__PURE__ */ jsxRuntime.jsxs(
7675
+ ListItem,
7676
+ {
7677
+ onClick: () => item.onClick(),
7678
+ children: [
7679
+ /* @__PURE__ */ jsxRuntime.jsx(ListItemLeftSide, { children: /* @__PURE__ */ jsxRuntime.jsx(
7680
+ "img",
7681
+ {
7682
+ src: item.logoUrl,
7683
+ alt: item.subtitle,
7684
+ className: "w-10 h-10 rounded-full"
7685
+ }
7686
+ ) }),
7687
+ /* @__PURE__ */ jsxRuntime.jsxs(ListItemContent, { children: [
7688
+ /* @__PURE__ */ jsxRuntime.jsx(TextBody, { children: item.title }),
7689
+ /* @__PURE__ */ jsxRuntime.jsx(TextBody, { variant: "text-small", children: item.subtitle })
7690
+ ] }),
7691
+ /* @__PURE__ */ jsxRuntime.jsx(ListItemRightSide, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-row justify-between items-center", children: [
7692
+ /* @__PURE__ */ jsxRuntime.jsx(ApyRange, { children: item.apyFormatted }),
7693
+ /* @__PURE__ */ jsxRuntime.jsx(md.MdArrowRight, { className: "w-6 h-6" })
7694
+ ] }) })
7695
+ ]
7696
+ },
7697
+ `best-${item.id}`
7698
+ )) })
7699
+ ] }),
7700
+ hasAllStrategies && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
7701
+ /* @__PURE__ */ jsxRuntime.jsx(GroupLabel, { children: allStrategiesLabel }),
7702
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-sm", children: allStrategiesItems.map((item) => /* @__PURE__ */ jsxRuntime.jsxs(
7703
+ ListItem,
7704
+ {
7705
+ onClick: () => item.onClick(),
7706
+ children: [
7707
+ /* @__PURE__ */ jsxRuntime.jsx(ListItemLeftSide, { children: /* @__PURE__ */ jsxRuntime.jsx(
7708
+ "img",
7709
+ {
7710
+ src: item.logoUrl,
7711
+ alt: item.subtitle,
7712
+ className: "w-10 h-10 rounded-full"
7713
+ }
7714
+ ) }),
7715
+ /* @__PURE__ */ jsxRuntime.jsxs(ListItemContent, { children: [
7716
+ /* @__PURE__ */ jsxRuntime.jsx(TextBody, { children: item.title }),
7717
+ /* @__PURE__ */ jsxRuntime.jsx(TextBody, { variant: "text-small", children: item.subtitle })
7718
+ ] }),
7719
+ /* @__PURE__ */ jsxRuntime.jsx(ListItemRightSide, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-row justify-between items-center", children: [
7720
+ /* @__PURE__ */ jsxRuntime.jsx(ApyRange, { children: item.apyFormatted }),
7721
+ /* @__PURE__ */ jsxRuntime.jsx(md.MdArrowRight, { className: "w-6 h-6" })
7722
+ ] }) })
7723
+ ]
7724
+ },
7725
+ `all-${item.id}`
7726
+ )) })
7727
+ ] })
7728
+ ] });
7729
+ };
7730
+ var DateLabel = ({ children }) => {
7731
+ return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-text-sm-mobile font-poppins text-text-secondary dark:text-text-secondary-dark", children });
7732
+ };
7733
+ var ArrowBadge = ({ isDeposit }) => {
7734
+ return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute bottom-[-2px] right-[-2px] w-[15px] h-[15px] rounded-full bg-bg-subtle dark:bg-bg-subtle-dark flex items-center justify-center border border-bg-subtle dark:border-bg-subtle-dark", children: isDeposit ? /* @__PURE__ */ jsxRuntime.jsx(md.MdArrowDownward, { className: "w-3 h-3 text-text-primary dark:text-text-primary-dark" }) : /* @__PURE__ */ jsxRuntime.jsx(md.MdArrowUpward, { className: "w-3 h-3 text-text-primary dark:text-text-primary-dark" }) });
7735
+ };
7736
+ var TokenIconWithBadge2 = ({ src, alt, isDeposit }) => {
7737
+ const fallbackText = encodeURIComponent((alt || "TOK").slice(0, 3).toUpperCase());
7738
+ const fallbackSrc = `https://placehold.co/40x40?text=${fallbackText}`;
7739
+ const resolvedSrc = src || fallbackSrc;
7740
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative flex-shrink-0", children: [
7741
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-10 h-10 rounded-xl bg-bg-muted dark:bg-bg-muted-dark flex items-center justify-center overflow-hidden", children: /* @__PURE__ */ jsxRuntime.jsx(
7742
+ "img",
7743
+ {
7744
+ src: resolvedSrc,
7745
+ alt,
7746
+ className: "w-full h-full object-cover",
7747
+ onError: (e) => {
7748
+ e.target.src = fallbackSrc;
7749
+ }
7602
7750
  }
7603
- )
7751
+ ) }),
7752
+ /* @__PURE__ */ jsxRuntime.jsx(ArrowBadge, { isDeposit })
7604
7753
  ] });
7605
7754
  };
7606
- var EarnInvestedSectionView = ({
7607
- sectionTitle,
7608
- items,
7609
- onItemClick,
7610
- className
7755
+ var SwapIconWithBadge = ({ src, alt }) => {
7756
+ const fallbackText = encodeURIComponent((alt || "TOK").slice(0, 3).toUpperCase());
7757
+ const fallbackSrc = `https://placehold.co/40x40?text=${fallbackText}`;
7758
+ const resolvedSrc = src || fallbackSrc;
7759
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative flex-shrink-0", children: [
7760
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-10 h-10 rounded-xl bg-bg-muted dark:bg-bg-muted-dark flex items-center justify-center overflow-hidden", children: /* @__PURE__ */ jsxRuntime.jsx(
7761
+ "img",
7762
+ {
7763
+ src: resolvedSrc,
7764
+ alt,
7765
+ className: "w-full h-full object-cover",
7766
+ onError: (e) => {
7767
+ e.target.src = fallbackSrc;
7768
+ }
7769
+ }
7770
+ ) }),
7771
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute bottom-[-2px] right-[-2px] w-[15px] h-[15px] rounded-full bg-bg-subtle dark:bg-bg-subtle-dark flex items-center justify-center border border-bg-subtle dark:border-bg-subtle-dark", children: /* @__PURE__ */ jsxRuntime.jsx(md.MdArrowUpward, { className: "w-3 h-3 text-text-primary dark:text-text-primary-dark" }) })
7772
+ ] });
7773
+ };
7774
+ var AmountDisplay = ({ amount, usdAmount }) => {
7775
+ return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
7776
+ /* @__PURE__ */ jsxRuntime.jsx(Label, { className: "text-accent-sm-mobile whitespace-nowrap", children: amount }),
7777
+ usdAmount ? /* @__PURE__ */ jsxRuntime.jsx(Label, { variant: "secondary", className: "whitespace-nowrap", children: usdAmount }) : null
7778
+ ] });
7779
+ };
7780
+ var HistoryListView = ({
7781
+ groups,
7782
+ showLoadMore,
7783
+ onLoadMore,
7784
+ loadMoreLabel,
7785
+ itemClassName
7611
7786
  }) => {
7612
- if (items.length === 0) {
7787
+ if (groups.length === 0) {
7613
7788
  return null;
7614
7789
  }
7615
- return /* @__PURE__ */ jsxRuntime.jsxs(
7616
- "section",
7617
- {
7618
- className: tailwindMerge.twMerge(
7619
- "flex flex-col gap-[var(--deframe-widget-size-gap-md)] p-[var(--deframe-widget-size-padding-x-lg)]",
7620
- "bg-[var(--deframe-widget-color-bg-subtle)] rounded-[var(--deframe-widget-size-radius-sm)]",
7621
- className
7622
- ),
7623
- children: [
7624
- /* @__PURE__ */ jsxRuntime.jsx(TextBody, { variant: "text-small", className: "text-[color:var(--deframe-widget-color-text-secondary)]", children: sectionTitle }),
7625
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-[var(--deframe-widget-size-gap-md)]", children: items.map((item, index) => {
7626
- const isLast = index === items.length - 1;
7627
- return /* @__PURE__ */ jsxRuntime.jsxs(
7628
- "button",
7629
- {
7630
- type: "button",
7631
- onClick: () => onItemClick == null ? void 0 : onItemClick(item.strategyId),
7632
- className: tailwindMerge.twMerge(
7633
- "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)]",
7634
- "transition-colors cursor-pointer text-left w-full",
7635
- !isLast && "border-b border-[var(--deframe-widget-color-border-secondary)]"
7636
- ),
7637
- children: [
7638
- /* @__PURE__ */ jsxRuntime.jsx(
7639
- "img",
7640
- {
7641
- src: item.logoUrl,
7642
- alt: item.assetName,
7643
- className: "w-10 h-10 rounded-[var(--deframe-widget-size-radius-full)] flex-shrink-0"
7644
- }
7790
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "self-stretch flex flex-col gap-[16px]", children: [
7791
+ groups.map((group) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "self-stretch flex flex-col gap-sm", children: [
7792
+ /* @__PURE__ */ jsxRuntime.jsx(DateLabel, { children: group.dateLabel }),
7793
+ group.items.map((item) => /* @__PURE__ */ jsxRuntime.jsxs(
7794
+ ListItem,
7795
+ {
7796
+ onClick: () => item.onClick(),
7797
+ containerClassName: tailwindMerge.twMerge("!rounded-xs !border-0 !min-h-[72px]", itemClassName),
7798
+ children: [
7799
+ /* @__PURE__ */ jsxRuntime.jsx(ListItemLeftSide, { children: item.isSwap ? /* @__PURE__ */ jsxRuntime.jsx(SwapIconWithBadge, { src: item.iconUrl, alt: item.iconAlt }) : /* @__PURE__ */ jsxRuntime.jsx(
7800
+ TokenIconWithBadge2,
7801
+ {
7802
+ src: item.iconUrl,
7803
+ alt: item.iconAlt,
7804
+ isDeposit: item.isDeposit
7805
+ }
7806
+ ) }),
7807
+ /* @__PURE__ */ jsxRuntime.jsxs(ListItemContent, { children: [
7808
+ /* @__PURE__ */ jsxRuntime.jsx(Label, { className: "text-text-lg-mobile", children: item.title }),
7809
+ /* @__PURE__ */ jsxRuntime.jsx(Label, { variant: "secondary", className: "text-text-tertiary dark:text-text-tertiary-dark", children: item.subtitle }),
7810
+ item.status === "PENDING" && item.statusLabel ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-[6px]", children: /* @__PURE__ */ jsxRuntime.jsx(
7811
+ ProcessingBadge,
7812
+ {
7813
+ label: item.statusLabel,
7814
+ title: item.statusTitle,
7815
+ size: "compact"
7816
+ }
7817
+ ) }) : null
7818
+ ] }),
7819
+ /* @__PURE__ */ jsxRuntime.jsx(ListItemRightSide, { children: /* @__PURE__ */ jsxRuntime.jsx(AmountDisplay, { amount: item.amountFormatted, usdAmount: item.amountUsd }) })
7820
+ ]
7821
+ },
7822
+ item.id
7823
+ ))
7824
+ ] }, group.dateLabel)),
7825
+ showLoadMore && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex justify-center pt-sm", children: /* @__PURE__ */ jsxRuntime.jsx(TertiaryButton, { onClick: onLoadMore, children: loadMoreLabel }) })
7826
+ ] });
7827
+ };
7828
+ var OverviewEarnWidgetTabSkeleton = () => {
7829
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "w-full flex flex-col gap-md", children: [
7830
+ /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { width: "100%", height: "40px", variant: "rect" }),
7831
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-sm", children: [
7832
+ /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { width: "100%", height: "144px", variant: "rect" }),
7833
+ /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { width: "100%", height: "144px", variant: "rect" })
7834
+ ] }),
7835
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "w-full", children: [
7836
+ /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { width: "128px", height: "20px", variant: "text", className: "mb-sm" }),
7837
+ /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { width: "100%", height: "80px", variant: "rect" })
7838
+ ] }),
7839
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "w-full", children: [
7840
+ /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { width: "96px", height: "20px", variant: "text", className: "mb-sm" }),
7841
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-sm", children: [
7842
+ /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { width: "100%", height: "64px", variant: "rect" }),
7843
+ /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { width: "100%", height: "64px", variant: "rect" }),
7844
+ /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { width: "100%", height: "64px", variant: "rect" }),
7845
+ /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { width: "100%", height: "64px", variant: "rect" })
7846
+ ] })
7847
+ ] })
7848
+ ] });
7849
+ };
7850
+ var EarnOverviewView = ({
7851
+ selectedTab,
7852
+ onTabChange,
7853
+ labels,
7854
+ overview,
7855
+ explore,
7856
+ history
7857
+ }) => {
7858
+ return /* @__PURE__ */ jsxRuntime.jsx(BackgroundContainer, { className: "flex flex-col flex-1 min-h-0 px-0", children: /* @__PURE__ */ jsxRuntime.jsxs(Tabs, { value: selectedTab, onValueChange: onTabChange, variant: "default", className: "flex flex-col flex-1 min-h-0", children: [
7859
+ /* @__PURE__ */ jsxRuntime.jsxs(TabsList, { className: "justify-between w-full", children: [
7860
+ /* @__PURE__ */ jsxRuntime.jsx(TabsTrigger, { value: "overview", className: "flex-1", children: labels.tabs.overview }),
7861
+ /* @__PURE__ */ jsxRuntime.jsx(TabsTrigger, { value: "explore", className: "flex-1", children: labels.tabs.explore }),
7862
+ /* @__PURE__ */ jsxRuntime.jsx(TabsTrigger, { value: "history", className: "flex-1", children: labels.tabs.history })
7863
+ ] }),
7864
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col flex-1 w-full min-h-0 px-md pt-md", children: [
7865
+ /* @__PURE__ */ jsxRuntime.jsx(TabsContent, { value: "overview", className: "flex flex-col flex-1 min-h-0", children: overview.isLoading ? /* @__PURE__ */ jsxRuntime.jsx(OverviewEarnWidgetTabSkeleton, {}) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
7866
+ /* @__PURE__ */ jsxRuntime.jsx(WalletBalances, { cards: overview.walletBalances }),
7867
+ /* @__PURE__ */ jsxRuntime.jsx(GroupedStrategyListView, __spreadValues({}, overview.groupedStrategies))
7868
+ ] }) }),
7869
+ /* @__PURE__ */ jsxRuntime.jsxs(TabsContent, { value: "explore", children: [
7870
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-shrink-0 w-full mb-4 h-12", children: /* @__PURE__ */ jsxRuntime.jsx(
7871
+ SearchInput,
7872
+ {
7873
+ value: explore.searchValue,
7874
+ onChange: (value) => explore.onSearchChange(value),
7875
+ placeholder: explore.searchPlaceholder
7876
+ }
7877
+ ) }),
7878
+ explore.isLoading ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center", children: [
7879
+ explore.loadingLabel,
7880
+ /* @__PURE__ */ jsxRuntime.jsx(LoadingDots, {})
7881
+ ] }) : explore.error ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "p-4 text-center text-red-500", children: [
7882
+ explore.errorLabel,
7883
+ ": ",
7884
+ explore.error.message
7885
+ ] }) : explore.hasFilters && explore.strategies.length === 0 ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "w-full py-md bg-bg-default dark:bg-bg-default-dark rounded-lg flex flex-col gap-sm flex-shrink-0", children: [
7886
+ /* @__PURE__ */ jsxRuntime.jsx(
7887
+ ChipGroup,
7888
+ {
7889
+ options: explore.chipOptions,
7890
+ selected: explore.selectedCategory,
7891
+ onSelect: (value) => explore.onCategorySelect(value)
7892
+ }
7893
+ ),
7894
+ /* @__PURE__ */ jsxRuntime.jsx(SearchEmptyState, { title: explore.emptySearchTitle, description: explore.emptySearchDescription })
7895
+ ] }) : /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "w-full py-md bg-bg-default dark:bg-bg-default-dark rounded-lg flex flex-col gap-sm flex-shrink-0", children: [
7896
+ /* @__PURE__ */ jsxRuntime.jsx(
7897
+ ChipGroup,
7898
+ {
7899
+ options: explore.chipOptions,
7900
+ selected: explore.selectedCategory,
7901
+ onSelect: (value) => explore.onCategorySelect(value)
7902
+ }
7903
+ ),
7904
+ /* @__PURE__ */ jsxRuntime.jsx(TextHeading, { variant: "h5", children: explore.bestPerformanceLabel }),
7905
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-sm", children: explore.strategies.map((s) => /* @__PURE__ */ jsxRuntime.jsxs(ListItem, { onClick: () => s.onClick(), children: [
7906
+ /* @__PURE__ */ jsxRuntime.jsx(ListItemLeftSide, { children: /* @__PURE__ */ jsxRuntime.jsx("img", { src: s.logoUrl, alt: s.subtitle, className: "w-10 h-10 rounded-full" }) }),
7907
+ /* @__PURE__ */ jsxRuntime.jsxs(ListItemContent, { children: [
7908
+ /* @__PURE__ */ jsxRuntime.jsx(TextBody, { children: s.title }),
7909
+ /* @__PURE__ */ jsxRuntime.jsx(TextBody, { variant: "text-small", children: s.subtitle })
7910
+ ] }),
7911
+ /* @__PURE__ */ jsxRuntime.jsx(ListItemRightSide, { children: /* @__PURE__ */ jsxRuntime.jsx(TextBody, { children: s.apyFormatted }) })
7912
+ ] }, s.id)) })
7913
+ ] })
7914
+ ] }),
7915
+ /* @__PURE__ */ jsxRuntime.jsx(TabsContent, { value: "history", children: history.isLoading ? /* @__PURE__ */ jsxRuntime.jsx(HistoryListSkeleton, {}) : history.isEmpty ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-full h-[90vh] py-md bg-bg-default dark:bg-bg-default-dark rounded-lg flex flex-col justify-center items-center gap-sm overflow-hidden", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "w-full flex flex-col justify-center items-center gap-md", children: [
7916
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col justify-center items-center gap-md text-center", children: [
7917
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-20 h-20 bg-bg-muted dark:bg-bg-muted-dark rounded-full flex justify-center items-center", children: /* @__PURE__ */ jsxRuntime.jsx(pi.PiClockCountdownBold, { className: "w-10 h-10 text-text-tertiary dark:text-text-tertiary-dark" }) }),
7918
+ /* @__PURE__ */ jsxRuntime.jsx(TextHeading, { variant: "h3", children: history.emptyTitle })
7919
+ ] }),
7920
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "self-stretch text-center", children: /* @__PURE__ */ jsxRuntime.jsx(TextBody, { variant: "text-small", children: history.emptyDescription }) })
7921
+ ] }) }) : /* @__PURE__ */ jsxRuntime.jsx(
7922
+ HistoryListView,
7923
+ {
7924
+ groups: history.groups,
7925
+ showLoadMore: history.showLoadMore,
7926
+ onLoadMore: () => history.onLoadMore(),
7927
+ loadMoreLabel: history.loadMoreLabel
7928
+ }
7929
+ ) })
7930
+ ] })
7931
+ ] }) });
7932
+ };
7933
+ var EarnInvestmentSummaryView = ({
7934
+ overviewDescription,
7935
+ totalInvestedLabel,
7936
+ totalInvestedValue,
7937
+ totalReturnLabel,
7938
+ totalReturnValue,
7939
+ processingBadgeLabel,
7940
+ processingBadgeTitle,
7941
+ className
7942
+ }) => {
7943
+ 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: [
7944
+ /* @__PURE__ */ jsxRuntime.jsx(TextBody, { variant: "text-small", className: "text-text-secondary dark:text-text-secondary-dark", children: overviewDescription }),
7945
+ /* @__PURE__ */ jsxRuntime.jsx(
7946
+ WalletBalances,
7947
+ {
7948
+ cards: [
7949
+ {
7950
+ label: totalInvestedLabel,
7951
+ value: totalInvestedValue,
7952
+ badge: processingBadgeLabel ? /* @__PURE__ */ jsxRuntime.jsx(
7953
+ ProcessingBadge,
7954
+ {
7955
+ label: processingBadgeLabel,
7956
+ title: processingBadgeTitle
7957
+ }
7958
+ ) : void 0
7959
+ },
7960
+ { label: totalReturnLabel, value: totalReturnValue }
7961
+ ],
7962
+ variant: "raised",
7963
+ className: "grid grid-cols-2 gap-md !mt-0"
7964
+ }
7965
+ )
7966
+ ] });
7967
+ };
7968
+ var EarnInvestedSectionView = ({
7969
+ sectionTitle,
7970
+ items,
7971
+ onItemClick,
7972
+ className
7973
+ }) => {
7974
+ if (items.length === 0) {
7975
+ return null;
7976
+ }
7977
+ return /* @__PURE__ */ jsxRuntime.jsxs(
7978
+ "section",
7979
+ {
7980
+ className: tailwindMerge.twMerge(
7981
+ "flex flex-col gap-[var(--deframe-widget-size-gap-md)] p-[var(--deframe-widget-size-padding-x-lg)]",
7982
+ "bg-[var(--deframe-widget-color-bg-subtle)] rounded-[var(--deframe-widget-size-radius-sm)]",
7983
+ className
7984
+ ),
7985
+ children: [
7986
+ /* @__PURE__ */ jsxRuntime.jsx(TextBody, { variant: "text-small", className: "text-[color:var(--deframe-widget-color-text-secondary)]", children: sectionTitle }),
7987
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-[var(--deframe-widget-size-gap-md)]", children: items.map((item, index) => {
7988
+ const isLast = index === items.length - 1;
7989
+ return /* @__PURE__ */ jsxRuntime.jsxs(
7990
+ "button",
7991
+ {
7992
+ type: "button",
7993
+ onClick: () => onItemClick == null ? void 0 : onItemClick(item.strategyId),
7994
+ className: tailwindMerge.twMerge(
7995
+ "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)]",
7996
+ "transition-colors cursor-pointer text-left w-full",
7997
+ !isLast && "border-b border-[var(--deframe-widget-color-border-secondary)]"
7998
+ ),
7999
+ children: [
8000
+ /* @__PURE__ */ jsxRuntime.jsx(
8001
+ "img",
8002
+ {
8003
+ src: item.logoUrl,
8004
+ alt: item.assetName,
8005
+ className: "w-10 h-10 rounded-[var(--deframe-widget-size-radius-full)] flex-shrink-0"
8006
+ }
7645
8007
  ),
7646
8008
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col flex-1 min-w-0", children: [
7647
8009
  /* @__PURE__ */ jsxRuntime.jsx(TextBody, { className: "font-medium truncate", children: item.assetName }),
@@ -7894,289 +8256,71 @@ var EarnInvestmentDetailsView = (props) => {
7894
8256
  ] }) })
7895
8257
  ] });
7896
8258
  };
7897
- var GroupLabel = ({ children }) => /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-text-secondary dark:text-text-secondary-dark text-sm font-medium font-poppins py-3", children });
7898
- var GroupedStrategyListView = ({
8259
+ var EarnTokenSelectorView = ({
8260
+ selectedToken,
8261
+ onTokenClick,
8262
+ onNetworkClick,
7899
8263
  isLoading,
7900
- loadingLabel,
7901
- error,
7902
- errorLabel,
7903
- investedLabel,
7904
- investedItems,
7905
- bestPerformanceLabel,
7906
- bestPerformanceItems,
7907
- allStrategiesLabel,
7908
- allStrategiesItems
8264
+ selectTokenLabel,
8265
+ chainLabel,
8266
+ chainImage,
8267
+ chainDirectionLabel,
8268
+ chainDisabledTitle,
8269
+ isNetworkDisabled = false,
8270
+ currentNetworkSelected
8271
+ }) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-[10px]", children: [
8272
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex gap-[10px] w-full", children: /* @__PURE__ */ jsxRuntime.jsx(
8273
+ "button",
8274
+ {
8275
+ type: "button",
8276
+ onClick: onTokenClick,
8277
+ className: "flex-1 h-[56px] border border-[var(--deframe-widget-color-border-primary)] rounded overflow-hidden hover:border-[var(--deframe-widget-color-border-primary)] transition-colors",
8278
+ children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex h-full items-center justify-between px-[var(--deframe-widget-size-padding-x-sm)] py-[6px]", children: [
8279
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex gap-[var(--deframe-widget-size-gap-sm)] items-center", children: (selectedToken == null ? void 0 : selectedToken.logoURI) ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
8280
+ /* @__PURE__ */ jsxRuntime.jsx(
8281
+ "img",
8282
+ {
8283
+ src: selectedToken.logoURI,
8284
+ alt: selectedToken.symbol,
8285
+ className: "w-6 h-6 rounded-full"
8286
+ }
8287
+ ),
8288
+ /* @__PURE__ */ jsxRuntime.jsx(TextBody, { as: "span", className: "text-[color:var(--deframe-widget-color-text-primary)]", children: selectedToken.symbol })
8289
+ ] }) : isLoading ? /* @__PURE__ */ jsxRuntime.jsx(LoadingDots, {}) : /* @__PURE__ */ jsxRuntime.jsx(TextBody, { as: "span", className: "text-[color:var(--deframe-widget-color-text-secondary)]", children: selectTokenLabel }) }),
8290
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-[18px] h-[18px] flex items-center justify-center", children: /* @__PURE__ */ jsxRuntime.jsx(hi2.HiChevronDown, { className: "w-3 h-3 text-[color:var(--deframe-widget-color-text-tertiary)]" }) })
8291
+ ] })
8292
+ }
8293
+ ) }),
8294
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-[var(--deframe-widget-size-gap-sm)] items-center", children: [
8295
+ /* @__PURE__ */ jsxRuntime.jsx(TextBody, { as: "span", variant: "text-small", className: "text-[color:var(--deframe-widget-color-text-tertiary)]", children: chainDirectionLabel }),
8296
+ /* @__PURE__ */ jsxRuntime.jsxs(
8297
+ "button",
8298
+ {
8299
+ type: "button",
8300
+ onClick: () => onNetworkClick == null ? void 0 : onNetworkClick(currentNetworkSelected),
8301
+ disabled: isNetworkDisabled,
8302
+ title: chainDisabledTitle,
8303
+ className: `bg-[var(--deframe-widget-color-bg-tertiary)] border border-[var(--deframe-widget-color-border-secondary)] rounded-lg flex gap-[var(--deframe-widget-size-gap-xs)] items-center px-[var(--deframe-widget-size-padding-x-sm)] py-[var(--deframe-widget-size-padding-y-xs)] transition-colors ${isNetworkDisabled ? "opacity-60 cursor-not-allowed" : "cursor-pointer hover:border-[var(--deframe-widget-color-border-primary)]"}`,
8304
+ children: [
8305
+ chainImage && /* @__PURE__ */ jsxRuntime.jsx("img", { src: chainImage, alt: "", className: "w-3 h-3 rounded-full" }),
8306
+ /* @__PURE__ */ jsxRuntime.jsx(TextBody, { as: "span", variant: "text-small", className: "text-[color:var(--deframe-widget-color-text-secondary)]", children: chainLabel }),
8307
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: `w-[18px] h-[18px] flex items-center justify-center ${isNetworkDisabled ? "opacity-50" : ""}`, children: /* @__PURE__ */ jsxRuntime.jsx(hi2.HiChevronDown, { className: "w-3 h-3 text-[color:var(--deframe-widget-color-text-tertiary)]" }) })
8308
+ ]
8309
+ }
8310
+ )
8311
+ ] })
8312
+ ] });
8313
+ var EarnAmountInputView = ({
8314
+ value,
8315
+ onChange,
8316
+ ariaLabel,
8317
+ dollarAmountFormatted,
8318
+ availableBalanceFormatted
7909
8319
  }) => {
7910
- const hasInvested = investedItems.length > 0;
7911
- const hasBestPerformance = bestPerformanceItems.length > 0;
7912
- const hasAllStrategies = allStrategiesItems.length > 0;
7913
- if (isLoading) {
7914
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center py-md", children: [
7915
- loadingLabel,
7916
- " ",
7917
- /* @__PURE__ */ jsxRuntime.jsx(LoadingDots, {})
7918
- ] });
7919
- }
7920
- if (error) {
7921
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "p-4 text-center text-red-500", children: [
7922
- errorLabel,
7923
- ": ",
7924
- error.message
7925
- ] });
7926
- }
7927
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "w-full flex flex-col gap-sm flex-1 min-h-0 overflow-y-auto", children: [
7928
- hasInvested && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
7929
- /* @__PURE__ */ jsxRuntime.jsx(GroupLabel, { children: investedLabel }),
7930
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-sm", children: investedItems.map((item) => /* @__PURE__ */ jsxRuntime.jsxs(
7931
- ListItem,
7932
- {
7933
- onClick: () => item.onClick(),
7934
- children: [
7935
- /* @__PURE__ */ jsxRuntime.jsx(ListItemLeftSide, { children: /* @__PURE__ */ jsxRuntime.jsx(
7936
- "img",
7937
- {
7938
- src: item.logoUrl,
7939
- alt: item.subtitle,
7940
- className: "w-10 h-10 rounded-full"
7941
- }
7942
- ) }),
7943
- /* @__PURE__ */ jsxRuntime.jsxs(ListItemContent, { children: [
7944
- /* @__PURE__ */ jsxRuntime.jsx(TextBody, { children: item.title }),
7945
- /* @__PURE__ */ jsxRuntime.jsx(TextBody, { variant: "text-small", children: item.subtitle })
7946
- ] }),
7947
- /* @__PURE__ */ jsxRuntime.jsx(ListItemRightSide, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-row justify-between items-center", children: [
7948
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-end", children: [
7949
- /* @__PURE__ */ jsxRuntime.jsx(TextBody, { children: item.balanceFormatted }),
7950
- /* @__PURE__ */ jsxRuntime.jsx(TextBody, { variant: "text-small", children: item.profitFormatted })
7951
- ] }),
7952
- /* @__PURE__ */ jsxRuntime.jsx(md.MdArrowRight, { className: "w-6 h-6" })
7953
- ] }) })
7954
- ]
7955
- },
7956
- `invested-${item.id}`
7957
- )) })
7958
- ] }),
7959
- hasBestPerformance && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
7960
- /* @__PURE__ */ jsxRuntime.jsx(GroupLabel, { children: bestPerformanceLabel }),
7961
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-sm", children: bestPerformanceItems.map((item) => /* @__PURE__ */ jsxRuntime.jsxs(
7962
- ListItem,
7963
- {
7964
- onClick: () => item.onClick(),
7965
- children: [
7966
- /* @__PURE__ */ jsxRuntime.jsx(ListItemLeftSide, { children: /* @__PURE__ */ jsxRuntime.jsx(
7967
- "img",
7968
- {
7969
- src: item.logoUrl,
7970
- alt: item.subtitle,
7971
- className: "w-10 h-10 rounded-full"
7972
- }
7973
- ) }),
7974
- /* @__PURE__ */ jsxRuntime.jsxs(ListItemContent, { children: [
7975
- /* @__PURE__ */ jsxRuntime.jsx(TextBody, { children: item.title }),
7976
- /* @__PURE__ */ jsxRuntime.jsx(TextBody, { variant: "text-small", children: item.subtitle })
7977
- ] }),
7978
- /* @__PURE__ */ jsxRuntime.jsx(ListItemRightSide, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-row justify-between items-center", children: [
7979
- /* @__PURE__ */ jsxRuntime.jsx(ApyRange, { children: item.apyFormatted }),
7980
- /* @__PURE__ */ jsxRuntime.jsx(md.MdArrowRight, { className: "w-6 h-6" })
7981
- ] }) })
7982
- ]
7983
- },
7984
- `best-${item.id}`
7985
- )) })
7986
- ] }),
7987
- hasAllStrategies && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
7988
- /* @__PURE__ */ jsxRuntime.jsx(GroupLabel, { children: allStrategiesLabel }),
7989
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-sm", children: allStrategiesItems.map((item) => /* @__PURE__ */ jsxRuntime.jsxs(
7990
- ListItem,
7991
- {
7992
- onClick: () => item.onClick(),
7993
- children: [
7994
- /* @__PURE__ */ jsxRuntime.jsx(ListItemLeftSide, { children: /* @__PURE__ */ jsxRuntime.jsx(
7995
- "img",
7996
- {
7997
- src: item.logoUrl,
7998
- alt: item.subtitle,
7999
- className: "w-10 h-10 rounded-full"
8000
- }
8001
- ) }),
8002
- /* @__PURE__ */ jsxRuntime.jsxs(ListItemContent, { children: [
8003
- /* @__PURE__ */ jsxRuntime.jsx(TextBody, { children: item.title }),
8004
- /* @__PURE__ */ jsxRuntime.jsx(TextBody, { variant: "text-small", children: item.subtitle })
8005
- ] }),
8006
- /* @__PURE__ */ jsxRuntime.jsx(ListItemRightSide, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-row justify-between items-center", children: [
8007
- /* @__PURE__ */ jsxRuntime.jsx(ApyRange, { children: item.apyFormatted }),
8008
- /* @__PURE__ */ jsxRuntime.jsx(md.MdArrowRight, { className: "w-6 h-6" })
8009
- ] }) })
8010
- ]
8011
- },
8012
- `all-${item.id}`
8013
- )) })
8014
- ] })
8015
- ] });
8016
- };
8017
- var DateLabel = ({ children }) => {
8018
- return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-text-sm-mobile font-poppins text-text-secondary dark:text-text-secondary-dark", children });
8019
- };
8020
- var ArrowBadge = ({ isDeposit }) => {
8021
- return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute bottom-[-2px] right-[-2px] w-[15px] h-[15px] rounded-full bg-bg-subtle dark:bg-bg-subtle-dark flex items-center justify-center border border-bg-subtle dark:border-bg-subtle-dark", children: isDeposit ? /* @__PURE__ */ jsxRuntime.jsx(md.MdArrowDownward, { className: "w-3 h-3 text-text-primary dark:text-text-primary-dark" }) : /* @__PURE__ */ jsxRuntime.jsx(md.MdArrowUpward, { className: "w-3 h-3 text-text-primary dark:text-text-primary-dark" }) });
8022
- };
8023
- var TokenIconWithBadge2 = ({ src, alt, isDeposit }) => {
8024
- const fallbackText = encodeURIComponent((alt || "TOK").slice(0, 3).toUpperCase());
8025
- const fallbackSrc = `https://placehold.co/40x40?text=${fallbackText}`;
8026
- const resolvedSrc = src || fallbackSrc;
8027
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative flex-shrink-0", children: [
8028
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-10 h-10 rounded-xl bg-bg-muted dark:bg-bg-muted-dark flex items-center justify-center overflow-hidden", children: /* @__PURE__ */ jsxRuntime.jsx(
8029
- "img",
8030
- {
8031
- src: resolvedSrc,
8032
- alt,
8033
- className: "w-full h-full object-cover",
8034
- onError: (e) => {
8035
- e.target.src = fallbackSrc;
8036
- }
8037
- }
8038
- ) }),
8039
- /* @__PURE__ */ jsxRuntime.jsx(ArrowBadge, { isDeposit })
8040
- ] });
8041
- };
8042
- var SwapIconWithBadge = ({ src, alt }) => {
8043
- const fallbackText = encodeURIComponent((alt || "TOK").slice(0, 3).toUpperCase());
8044
- const fallbackSrc = `https://placehold.co/40x40?text=${fallbackText}`;
8045
- const resolvedSrc = src || fallbackSrc;
8046
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative flex-shrink-0", children: [
8047
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-10 h-10 rounded-xl bg-bg-muted dark:bg-bg-muted-dark flex items-center justify-center overflow-hidden", children: /* @__PURE__ */ jsxRuntime.jsx(
8048
- "img",
8049
- {
8050
- src: resolvedSrc,
8051
- alt,
8052
- className: "w-full h-full object-cover",
8053
- onError: (e) => {
8054
- e.target.src = fallbackSrc;
8055
- }
8056
- }
8057
- ) }),
8058
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute bottom-[-2px] right-[-2px] w-[15px] h-[15px] rounded-full bg-bg-subtle dark:bg-bg-subtle-dark flex items-center justify-center border border-bg-subtle dark:border-bg-subtle-dark", children: /* @__PURE__ */ jsxRuntime.jsx(md.MdArrowUpward, { className: "w-3 h-3 text-text-primary dark:text-text-primary-dark" }) })
8059
- ] });
8060
- };
8061
- var AmountDisplay = ({ amount, usdAmount }) => {
8062
- return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
8063
- /* @__PURE__ */ jsxRuntime.jsx(Label, { className: "text-accent-sm-mobile whitespace-nowrap", children: amount }),
8064
- usdAmount ? /* @__PURE__ */ jsxRuntime.jsx(Label, { variant: "secondary", className: "whitespace-nowrap", children: usdAmount }) : null
8065
- ] });
8066
- };
8067
- var HistoryListView = ({
8068
- groups,
8069
- showLoadMore,
8070
- onLoadMore,
8071
- loadMoreLabel,
8072
- itemClassName
8073
- }) => {
8074
- if (groups.length === 0) {
8075
- return null;
8076
- }
8077
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "self-stretch flex flex-col gap-[16px]", children: [
8078
- groups.map((group) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "self-stretch flex flex-col gap-sm", children: [
8079
- /* @__PURE__ */ jsxRuntime.jsx(DateLabel, { children: group.dateLabel }),
8080
- group.items.map((item) => /* @__PURE__ */ jsxRuntime.jsxs(
8081
- ListItem,
8082
- {
8083
- onClick: () => item.onClick(),
8084
- containerClassName: tailwindMerge.twMerge("!rounded-xs !border-0 !min-h-[72px]", itemClassName),
8085
- children: [
8086
- /* @__PURE__ */ jsxRuntime.jsx(ListItemLeftSide, { children: item.isSwap ? /* @__PURE__ */ jsxRuntime.jsx(SwapIconWithBadge, { src: item.iconUrl, alt: item.iconAlt }) : /* @__PURE__ */ jsxRuntime.jsx(
8087
- TokenIconWithBadge2,
8088
- {
8089
- src: item.iconUrl,
8090
- alt: item.iconAlt,
8091
- isDeposit: item.isDeposit
8092
- }
8093
- ) }),
8094
- /* @__PURE__ */ jsxRuntime.jsxs(ListItemContent, { children: [
8095
- /* @__PURE__ */ jsxRuntime.jsx(Label, { className: "text-text-lg-mobile", children: item.title }),
8096
- /* @__PURE__ */ jsxRuntime.jsx(Label, { variant: "secondary", className: "text-text-tertiary dark:text-text-tertiary-dark", children: item.subtitle }),
8097
- item.status === "PENDING" && item.statusLabel ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-[6px]", children: /* @__PURE__ */ jsxRuntime.jsx(
8098
- ProcessingBadge,
8099
- {
8100
- label: item.statusLabel,
8101
- title: item.statusTitle,
8102
- size: "compact"
8103
- }
8104
- ) }) : null
8105
- ] }),
8106
- /* @__PURE__ */ jsxRuntime.jsx(ListItemRightSide, { children: /* @__PURE__ */ jsxRuntime.jsx(AmountDisplay, { amount: item.amountFormatted, usdAmount: item.amountUsd }) })
8107
- ]
8108
- },
8109
- item.id
8110
- ))
8111
- ] }, group.dateLabel)),
8112
- showLoadMore && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex justify-center pt-sm", children: /* @__PURE__ */ jsxRuntime.jsx(TertiaryButton, { onClick: onLoadMore, children: loadMoreLabel }) })
8113
- ] });
8114
- };
8115
- var EarnTokenSelectorView = ({
8116
- selectedToken,
8117
- onTokenClick,
8118
- onNetworkClick,
8119
- isLoading,
8120
- selectTokenLabel,
8121
- chainLabel,
8122
- chainImage,
8123
- chainDirectionLabel,
8124
- chainDisabledTitle,
8125
- isNetworkDisabled = false,
8126
- currentNetworkSelected
8127
- }) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-[10px]", children: [
8128
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex gap-[10px] w-full", children: /* @__PURE__ */ jsxRuntime.jsx(
8129
- "button",
8130
- {
8131
- type: "button",
8132
- onClick: onTokenClick,
8133
- className: "flex-1 h-[56px] border border-[var(--deframe-widget-color-border-primary)] rounded overflow-hidden hover:border-[var(--deframe-widget-color-border-primary)] transition-colors",
8134
- children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex h-full items-center justify-between px-[var(--deframe-widget-size-padding-x-sm)] py-[6px]", children: [
8135
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex gap-[var(--deframe-widget-size-gap-sm)] items-center", children: (selectedToken == null ? void 0 : selectedToken.logoURI) ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
8136
- /* @__PURE__ */ jsxRuntime.jsx(
8137
- "img",
8138
- {
8139
- src: selectedToken.logoURI,
8140
- alt: selectedToken.symbol,
8141
- className: "w-6 h-6 rounded-full"
8142
- }
8143
- ),
8144
- /* @__PURE__ */ jsxRuntime.jsx(TextBody, { as: "span", className: "text-[color:var(--deframe-widget-color-text-primary)]", children: selectedToken.symbol })
8145
- ] }) : isLoading ? /* @__PURE__ */ jsxRuntime.jsx(LoadingDots, {}) : /* @__PURE__ */ jsxRuntime.jsx(TextBody, { as: "span", className: "text-[color:var(--deframe-widget-color-text-secondary)]", children: selectTokenLabel }) }),
8146
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-[18px] h-[18px] flex items-center justify-center", children: /* @__PURE__ */ jsxRuntime.jsx(hi2.HiChevronDown, { className: "w-3 h-3 text-[color:var(--deframe-widget-color-text-tertiary)]" }) })
8147
- ] })
8148
- }
8149
- ) }),
8150
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-[var(--deframe-widget-size-gap-sm)] items-center", children: [
8151
- /* @__PURE__ */ jsxRuntime.jsx(TextBody, { as: "span", variant: "text-small", className: "text-[color:var(--deframe-widget-color-text-tertiary)]", children: chainDirectionLabel }),
8152
- /* @__PURE__ */ jsxRuntime.jsxs(
8153
- "button",
8154
- {
8155
- type: "button",
8156
- onClick: () => onNetworkClick == null ? void 0 : onNetworkClick(currentNetworkSelected),
8157
- disabled: isNetworkDisabled,
8158
- title: chainDisabledTitle,
8159
- className: `bg-[var(--deframe-widget-color-bg-tertiary)] border border-[var(--deframe-widget-color-border-secondary)] rounded-lg flex gap-[var(--deframe-widget-size-gap-xs)] items-center px-[var(--deframe-widget-size-padding-x-sm)] py-[var(--deframe-widget-size-padding-y-xs)] transition-colors ${isNetworkDisabled ? "opacity-60 cursor-not-allowed" : "cursor-pointer hover:border-[var(--deframe-widget-color-border-primary)]"}`,
8160
- children: [
8161
- chainImage && /* @__PURE__ */ jsxRuntime.jsx("img", { src: chainImage, alt: "", className: "w-3 h-3 rounded-full" }),
8162
- /* @__PURE__ */ jsxRuntime.jsx(TextBody, { as: "span", variant: "text-small", className: "text-[color:var(--deframe-widget-color-text-secondary)]", children: chainLabel }),
8163
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: `w-[18px] h-[18px] flex items-center justify-center ${isNetworkDisabled ? "opacity-50" : ""}`, children: /* @__PURE__ */ jsxRuntime.jsx(hi2.HiChevronDown, { className: "w-3 h-3 text-[color:var(--deframe-widget-color-text-tertiary)]" }) })
8164
- ]
8165
- }
8166
- )
8167
- ] })
8168
- ] });
8169
- var EarnAmountInputView = ({
8170
- value,
8171
- onChange,
8172
- ariaLabel,
8173
- dollarAmountFormatted,
8174
- availableBalanceFormatted
8175
- }) => {
8176
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-1 flex flex-col items-end justify-between min-h-[86px] text-right", children: [
8177
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-end text-[color:var(--deframe-widget-color-text-secondary)]", children: [
8178
- /* @__PURE__ */ jsxRuntime.jsx(
8179
- "input",
8320
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-1 flex flex-col items-end justify-between min-h-[86px] text-right", children: [
8321
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-end text-[color:var(--deframe-widget-color-text-secondary)]", children: [
8322
+ /* @__PURE__ */ jsxRuntime.jsx(
8323
+ "input",
8180
8324
  {
8181
8325
  placeholder: "0.00",
8182
8326
  type: "text",
@@ -9133,7 +9277,7 @@ var DashboardBalancesBreakdown = ({
9133
9277
  }) => {
9134
9278
  if (layout === "horizontal") {
9135
9279
  return /* @__PURE__ */ jsxRuntime.jsx("div", { "data-test-id": "dashboard-balances-breakdown-horizontal", className: "hidden lg:block w-full mt-8", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex w-full gap-4 items-stretch", children: [
9136
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-1 basis-0 min-w-0 bg-[var(--deframe-widget-color-bg-secondary)] rounded p-4 flex flex-col", children: [
9280
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-1 basis-0 min-w-0 bg-[var(--deframe-widget-color-bg-raised)] rounded p-4 flex flex-col", children: [
9137
9281
  /* @__PURE__ */ jsxRuntime.jsx(Text_default, { children: "Cripto" }),
9138
9282
  /* @__PURE__ */ jsxRuntime.jsx(framerMotion.AnimatePresence, { mode: "wait", children: isLoadingBalances ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-5 bg-[var(--deframe-widget-color-bg-muted)] rounded w-32 animate-pulse mt-2" }, "skeleton-crypto") : /* @__PURE__ */ jsxRuntime.jsx(
9139
9283
  framerMotion.motion.div,
@@ -9148,7 +9292,7 @@ var DashboardBalancesBreakdown = ({
9148
9292
  "crypto-value"
9149
9293
  ) })
9150
9294
  ] }),
9151
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-1 basis-0 min-w-0 bg-[var(--deframe-widget-color-bg-secondary)] rounded p-4 flex flex-col", children: [
9295
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-1 basis-0 min-w-0 bg-[var(--deframe-widget-color-bg-raised)] rounded p-4 flex flex-col", children: [
9152
9296
  /* @__PURE__ */ jsxRuntime.jsx(Text_default, { children: "Investimentos" }),
9153
9297
  /* @__PURE__ */ jsxRuntime.jsx(framerMotion.AnimatePresence, { mode: "wait", children: isLoadingBalances ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-5 bg-[var(--deframe-widget-color-bg-muted)] rounded w-32 animate-pulse mt-2" }, "skeleton-earn") : /* @__PURE__ */ jsxRuntime.jsx(
9154
9298
  framerMotion.motion.div,
@@ -9357,7 +9501,7 @@ var DashboardStrategiesListView = ({
9357
9501
  children: /* @__PURE__ */ jsxRuntime.jsxs(
9358
9502
  ListItem,
9359
9503
  {
9360
- containerClassName: `${index > 0 ? "mt-4" : ""}`,
9504
+ containerClassName: `bg-[var(--deframe-widget-color-bg-raised)] ${index > 0 ? "mt-4" : ""}`,
9361
9505
  onClick: () => onStrategyClick(strategy.id),
9362
9506
  children: [
9363
9507
  /* @__PURE__ */ jsxRuntime.jsx(ListItemLeftSide, { children: /* @__PURE__ */ jsxRuntime.jsx(
@@ -9446,17 +9590,112 @@ var DashboardPortfolioView = ({
9446
9590
  ) })
9447
9591
  ] }) });
9448
9592
  };
9449
- var DashboardTokensView = ({
9450
- sortedRegularTokens,
9451
- regularTokens,
9452
- isLoadingBalances,
9453
- activeTab,
9454
- onTabChange,
9455
- strategiesContent
9593
+ var cardClasses = tailwindMerge.twMerge(
9594
+ "w-full self-start flex flex-col gap-[var(--deframe-widget-size-gap-sm)]",
9595
+ "bg-[var(--deframe-widget-color-bg-secondary)] border border-[color:var(--deframe-widget-color-border-secondary)]",
9596
+ "rounded-[var(--deframe-widget-size-radius-md)]",
9597
+ "px-[var(--deframe-widget-size-padding-x-md)] py-[var(--deframe-widget-size-padding-y-md)]"
9598
+ );
9599
+ var labelClasses = tailwindMerge.twMerge(
9600
+ "text-[color:var(--deframe-widget-color-text-tertiary)]",
9601
+ "text-[11px] [font-weight:var(--deframe-widget-font-weight-medium)] uppercase tracking-[0.08em]",
9602
+ "[line-height:1.4]"
9603
+ );
9604
+ var valueLgClasses = tailwindMerge.twMerge(
9605
+ "text-[38px] [font-weight:var(--deframe-widget-font-weight-bold)] [line-height:1.15]",
9606
+ "text-[color:var(--deframe-widget-color-text-primary)]"
9607
+ );
9608
+ var descriptionClasses = "text-[color:var(--deframe-widget-color-text-secondary)] text-[13px] [line-height:1.45]";
9609
+ function StatCardSkeletonBlock({ showDescription, className }) {
9610
+ return /* @__PURE__ */ jsxRuntime.jsxs(
9611
+ "article",
9612
+ {
9613
+ "data-test-id": "stat-card-skeleton",
9614
+ "aria-busy": "true",
9615
+ className: tailwindMerge.twMerge(cardClasses, "self-stretch", className),
9616
+ children: [
9617
+ /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { variant: "rect", width: 140, height: 11 }),
9618
+ /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { variant: "rect", width: "60%", height: 44 }),
9619
+ showDescription && /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { variant: "rect", width: "80%", height: 13 })
9620
+ ]
9621
+ }
9622
+ );
9623
+ }
9624
+ var DashboardPortfolioViewSimple = ({
9625
+ formattedTotalValue,
9626
+ isLoading,
9627
+ assetCount
9456
9628
  }) => {
9457
- return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
9458
- /* @__PURE__ */ jsxRuntime.jsx(DashboardTokenListView, { tokens: sortedRegularTokens, isLoading: isLoadingBalances, className: "hidden lg:block" }),
9459
- /* @__PURE__ */ jsxRuntime.jsx(DashboardCard, { className: "lg:hidden p-6 bg-[var(--deframe-widget-color-bg-subtle)]", children: /* @__PURE__ */ jsxRuntime.jsxs(
9629
+ if (isLoading) {
9630
+ return /* @__PURE__ */ jsxRuntime.jsxs(
9631
+ "div",
9632
+ {
9633
+ "data-test-id": "dashboard-portfolio-simple",
9634
+ className: "grid grid-cols-[1fr_auto] gap-[var(--deframe-widget-size-gap-sm)]",
9635
+ children: [
9636
+ /* @__PURE__ */ jsxRuntime.jsx(StatCardSkeletonBlock, { showDescription: true }),
9637
+ /* @__PURE__ */ jsxRuntime.jsx(StatCardSkeletonBlock, { className: "min-w-[160px]" })
9638
+ ]
9639
+ }
9640
+ );
9641
+ }
9642
+ return /* @__PURE__ */ jsxRuntime.jsxs(
9643
+ "div",
9644
+ {
9645
+ "data-test-id": "dashboard-portfolio-simple",
9646
+ className: tailwindMerge.twMerge(
9647
+ "grid gap-[var(--deframe-widget-size-gap-sm)]",
9648
+ assetCount != null ? "grid-cols-[1fr_auto]" : "grid-cols-1"
9649
+ ),
9650
+ children: [
9651
+ /* @__PURE__ */ jsxRuntime.jsxs("article", { className: tailwindMerge.twMerge(cardClasses, "self-stretch"), children: [
9652
+ /* @__PURE__ */ jsxRuntime.jsx("p", { "data-test-id": "stat-card-label", className: labelClasses, children: "Total da Carteira (USD)" }),
9653
+ /* @__PURE__ */ jsxRuntime.jsx(framerMotion.AnimatePresence, { mode: "wait", children: /* @__PURE__ */ jsxRuntime.jsx(
9654
+ framerMotion.motion.p,
9655
+ {
9656
+ "data-test-id": "stat-card-value",
9657
+ initial: { opacity: 0, y: 10 },
9658
+ animate: { opacity: 1, y: 0 },
9659
+ exit: { opacity: 0, y: -10 },
9660
+ transition: { duration: 0.5, ease: "easeOut" },
9661
+ className: valueLgClasses,
9662
+ children: formattedTotalValue
9663
+ },
9664
+ "value"
9665
+ ) }),
9666
+ /* @__PURE__ */ jsxRuntime.jsx("p", { "data-test-id": "stat-card-description", className: descriptionClasses, children: "Soma do saldo por token (em USD)." })
9667
+ ] }),
9668
+ assetCount != null && /* @__PURE__ */ jsxRuntime.jsxs("article", { className: tailwindMerge.twMerge(cardClasses, "self-stretch min-w-[160px]"), children: [
9669
+ /* @__PURE__ */ jsxRuntime.jsx("p", { "data-test-id": "stat-card-label", className: labelClasses, children: "Ativos" }),
9670
+ /* @__PURE__ */ jsxRuntime.jsx(framerMotion.AnimatePresence, { mode: "wait", children: /* @__PURE__ */ jsxRuntime.jsx(
9671
+ framerMotion.motion.p,
9672
+ {
9673
+ "data-test-id": "stat-card-value",
9674
+ initial: { opacity: 0, y: 10 },
9675
+ animate: { opacity: 1, y: 0 },
9676
+ exit: { opacity: 0, y: -10 },
9677
+ transition: { duration: 0.5, ease: "easeOut" },
9678
+ className: valueLgClasses,
9679
+ children: assetCount
9680
+ },
9681
+ "count-value"
9682
+ ) })
9683
+ ] })
9684
+ ]
9685
+ }
9686
+ );
9687
+ };
9688
+ var DashboardTokensView = ({
9689
+ sortedRegularTokens,
9690
+ regularTokens,
9691
+ isLoadingBalances,
9692
+ activeTab,
9693
+ onTabChange,
9694
+ strategiesContent
9695
+ }) => {
9696
+ return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
9697
+ /* @__PURE__ */ jsxRuntime.jsx(DashboardTokenListView, { tokens: sortedRegularTokens, isLoading: isLoadingBalances, className: "hidden lg:block" }),
9698
+ /* @__PURE__ */ jsxRuntime.jsx(DashboardCard, { className: "lg:hidden p-6 bg-[var(--deframe-widget-color-bg-subtle)]", children: /* @__PURE__ */ jsxRuntime.jsxs(
9460
9699
  Tabs,
9461
9700
  {
9462
9701
  value: activeTab,
@@ -9476,6 +9715,366 @@ var DashboardTokensView = ({
9476
9715
  ) })
9477
9716
  ] });
9478
9717
  };
9718
+
9719
+ // src/utils/isDustValue.ts
9720
+ var DUST_THRESHOLD_USD = 0.01;
9721
+ function isDustValue(amountInUSD) {
9722
+ return isNaN(amountInUSD) || amountInUSD < DUST_THRESHOLD_USD;
9723
+ }
9724
+ function HistoryButton2({ onClick }) {
9725
+ return /* @__PURE__ */ jsxRuntime.jsx(
9726
+ "button",
9727
+ {
9728
+ type: "button",
9729
+ "aria-label": "Hist\xF3rico de transa\xE7\xF5es",
9730
+ "data-test-id": "dashboard-home-history-button",
9731
+ onClick,
9732
+ className: tailwindMerge.twMerge(
9733
+ "inline-flex items-center justify-center",
9734
+ "w-9 h-9",
9735
+ "rounded-[var(--deframe-widget-size-radius-sm)]",
9736
+ "border-none bg-transparent",
9737
+ "cursor-pointer outline-none flex-shrink-0",
9738
+ "text-[color:var(--deframe-widget-color-text-secondary)]",
9739
+ "hover:bg-[color:color-mix(in_srgb,var(--deframe-widget-color-bg-tertiary)_92%,transparent)]",
9740
+ "transition-[background] duration-150"
9741
+ ),
9742
+ children: /* @__PURE__ */ jsxRuntime.jsxs(
9743
+ "svg",
9744
+ {
9745
+ viewBox: "0 0 24 24",
9746
+ width: "20",
9747
+ height: "20",
9748
+ fill: "none",
9749
+ stroke: "currentColor",
9750
+ strokeWidth: "2",
9751
+ strokeLinecap: "round",
9752
+ strokeLinejoin: "round",
9753
+ "aria-hidden": "true",
9754
+ children: [
9755
+ /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "12", cy: "12", r: "10" }),
9756
+ /* @__PURE__ */ jsxRuntime.jsx("polyline", { points: "12 6 12 12 16 14" })
9757
+ ]
9758
+ }
9759
+ )
9760
+ }
9761
+ );
9762
+ }
9763
+ var GRID_COLS = "grid grid-cols-[40px_1fr_auto] sm:grid-cols-[1fr_160px_130px] gap-x-[var(--deframe-widget-size-gap-sm)] sm:gap-x-[var(--deframe-widget-size-gap-md)]";
9764
+ function IconCircle3({ item, size = 36, className }) {
9765
+ const [imgError, setImgError] = React6__namespace.default.useState(false);
9766
+ if (item.iconUrl && !imgError) {
9767
+ return /* @__PURE__ */ jsxRuntime.jsx(
9768
+ "img",
9769
+ {
9770
+ "data-test-id": "icon-circle-img",
9771
+ src: item.iconUrl,
9772
+ alt: item.name,
9773
+ width: size,
9774
+ height: size,
9775
+ className: tailwindMerge.twMerge("rounded-[var(--deframe-widget-size-radius-full)] flex-shrink-0 object-cover", className),
9776
+ onError: () => setImgError(true)
9777
+ }
9778
+ );
9779
+ }
9780
+ return /* @__PURE__ */ jsxRuntime.jsx(
9781
+ "div",
9782
+ {
9783
+ "data-test-id": "icon-circle-fallback",
9784
+ className: tailwindMerge.twMerge(
9785
+ "rounded-[var(--deframe-widget-size-radius-full)] flex-shrink-0 flex items-center justify-center",
9786
+ "[font-weight:var(--deframe-widget-font-weight-bold)] text-[color:var(--deframe-widget-color-text-primary-dark)]",
9787
+ className
9788
+ ),
9789
+ style: {
9790
+ width: size,
9791
+ height: size,
9792
+ background: item.color,
9793
+ fontSize: size * 0.33,
9794
+ letterSpacing: "-0.01em"
9795
+ },
9796
+ children: item.name.slice(0, 2).toUpperCase()
9797
+ }
9798
+ );
9799
+ }
9800
+ function TokenIcon3({ token, size = 36, badge, badgeSize = 14, className }) {
9801
+ return /* @__PURE__ */ jsxRuntime.jsxs(
9802
+ "div",
9803
+ {
9804
+ "data-test-id": "token-icon",
9805
+ className: tailwindMerge.twMerge("relative flex-shrink-0", className),
9806
+ style: { width: size, height: size },
9807
+ children: [
9808
+ /* @__PURE__ */ jsxRuntime.jsx(IconCircle3, { item: token, size }),
9809
+ badge && /* @__PURE__ */ jsxRuntime.jsx(
9810
+ "div",
9811
+ {
9812
+ "data-test-id": "token-icon-badge",
9813
+ className: "absolute -bottom-0.5 -right-0.5 rounded-[var(--deframe-widget-size-radius-full)] shadow-[0_0_0_2px_var(--deframe-widget-color-bg-secondary)]",
9814
+ children: /* @__PURE__ */ jsxRuntime.jsx(IconCircle3, { item: badge, size: badgeSize })
9815
+ }
9816
+ )
9817
+ ]
9818
+ }
9819
+ );
9820
+ }
9821
+ var directionClasses = {
9822
+ up: "bg-[color:color-mix(in_srgb,var(--deframe-widget-color-state-success)_12%,transparent)] border-[color:color-mix(in_srgb,var(--deframe-widget-color-state-success)_32%,transparent)] text-[color:var(--deframe-widget-color-state-success)]",
9823
+ down: "bg-[color:color-mix(in_srgb,var(--deframe-widget-color-state-error)_16%,transparent)] border-[color:color-mix(in_srgb,var(--deframe-widget-color-state-error)_32%,transparent)] text-[color:var(--deframe-widget-color-state-error)]",
9824
+ neutral: "bg-[color:color-mix(in_srgb,var(--deframe-widget-color-bg-tertiary)_84%,transparent)] border-[color:var(--deframe-widget-color-border-secondary)] text-[color:var(--deframe-widget-color-text-tertiary)]"
9825
+ };
9826
+ var arrowIcons = {
9827
+ up: /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "8", height: "8", viewBox: "0 0 10 10", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M5 1.5L9 7H1L5 1.5Z", fill: "currentColor" }) }),
9828
+ down: /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "8", height: "8", viewBox: "0 0 10 10", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M5 8.5L1 3H9L5 8.5Z", fill: "currentColor" }) }),
9829
+ neutral: /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "9", height: "9", viewBox: "0 0 12 12", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M2 6H10", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" }) })
9830
+ };
9831
+ function AssetTrendBadge({ direction, value, className }) {
9832
+ return /* @__PURE__ */ jsxRuntime.jsxs(
9833
+ "span",
9834
+ {
9835
+ "data-test-id": "asset-trend-badge",
9836
+ className: tailwindMerge.twMerge(
9837
+ "inline-flex items-center gap-[var(--deframe-widget-size-gap-xs)]",
9838
+ "px-[var(--deframe-widget-size-padding-x-sm)] py-[var(--deframe-widget-size-padding-y-xs)]",
9839
+ "rounded-[var(--deframe-widget-size-radius-full)] border",
9840
+ "text-[length:var(--deframe-widget-font-size-xs)] [font-weight:var(--deframe-widget-font-weight-medium)] leading-[var(--deframe-widget-font-leading-xs)]",
9841
+ "font-[var(--deframe-widget-font-family)]",
9842
+ "whitespace-nowrap",
9843
+ directionClasses[direction],
9844
+ className
9845
+ ),
9846
+ children: [
9847
+ arrowIcons[direction],
9848
+ value
9849
+ ]
9850
+ }
9851
+ );
9852
+ }
9853
+ var SKELETON_NAME_WIDTHS = [100, 88, 112, 96, 104, 80];
9854
+ var SKELETON_SYMBOL_WIDTHS = [56, 64, 52, 68, 60, 72];
9855
+ var SKELETON_BALANCE_WIDTHS = [72, 64, 80, 68, 76, 60];
9856
+ function AssetListSkeletonRow({ index }) {
9857
+ const w = index % SKELETON_NAME_WIDTHS.length;
9858
+ return /* @__PURE__ */ jsxRuntime.jsxs(
9859
+ "div",
9860
+ {
9861
+ "data-test-id": "asset-list-skeleton-row",
9862
+ className: tailwindMerge.twMerge(
9863
+ GRID_COLS,
9864
+ "items-center",
9865
+ "px-[var(--deframe-widget-size-padding-x-md)] py-[11px]",
9866
+ "border-t border-[color:var(--deframe-widget-color-border-secondary)]"
9867
+ ),
9868
+ children: [
9869
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-[var(--deframe-widget-size-gap-sm)]", children: [
9870
+ /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { variant: "circle", width: 36, height: 36 }),
9871
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "hidden sm:flex flex-col gap-[var(--deframe-widget-size-gap-xs)]", children: [
9872
+ /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { variant: "rect", width: SKELETON_NAME_WIDTHS[w], height: 14 }),
9873
+ /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { variant: "rect", width: SKELETON_SYMBOL_WIDTHS[w], height: 11 })
9874
+ ] })
9875
+ ] }),
9876
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex justify-center", children: /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { variant: "rect", width: 88, height: 24, className: "rounded-[var(--deframe-widget-size-radius-full)]" }) }),
9877
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-end gap-[var(--deframe-widget-size-gap-xs)]", children: [
9878
+ /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { variant: "rect", width: SKELETON_BALANCE_WIDTHS[w], height: 14 }),
9879
+ /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { variant: "rect", width: SKELETON_BALANCE_WIDTHS[w] - 12, height: 11 })
9880
+ ] })
9881
+ ]
9882
+ }
9883
+ );
9884
+ }
9885
+ function AssetListSkeletonContent() {
9886
+ return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
9887
+ /* @__PURE__ */ jsxRuntime.jsxs(
9888
+ "div",
9889
+ {
9890
+ className: tailwindMerge.twMerge(
9891
+ "flex items-center justify-between",
9892
+ "px-[var(--deframe-widget-size-padding-x-md)] pt-[var(--deframe-widget-size-padding-y-md)] pb-[var(--deframe-widget-size-padding-y-sm)]"
9893
+ ),
9894
+ children: [
9895
+ /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { variant: "rect", width: 108, height: 18 }),
9896
+ /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { variant: "rect", width: 36, height: 36, className: "rounded-[var(--deframe-widget-size-radius-sm)]" })
9897
+ ]
9898
+ }
9899
+ ),
9900
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-[var(--deframe-widget-size-gap-sm)] px-[var(--deframe-widget-size-padding-x-md)] pb-[var(--deframe-widget-size-padding-y-sm)]", children: [
9901
+ /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { variant: "rect", width: 60, height: 26, className: "rounded-[var(--deframe-widget-size-radius-full)]" }),
9902
+ /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { variant: "rect", width: 104, height: 26, className: "rounded-[var(--deframe-widget-size-radius-full)]" }),
9903
+ /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { variant: "rect", width: 64, height: 26, className: "rounded-[var(--deframe-widget-size-radius-full)]" })
9904
+ ] }),
9905
+ /* @__PURE__ */ jsxRuntime.jsxs(
9906
+ "div",
9907
+ {
9908
+ className: tailwindMerge.twMerge(
9909
+ GRID_COLS,
9910
+ "px-[var(--deframe-widget-size-padding-x-md)] py-[var(--deframe-widget-size-padding-y-sm)]",
9911
+ "border-t border-[color:var(--deframe-widget-color-border-secondary)]"
9912
+ ),
9913
+ children: [
9914
+ /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { variant: "rect", width: 40, height: 10, className: "hidden sm:block" }),
9915
+ /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { variant: "rect", width: 72, height: 10, className: "hidden sm:block mx-auto" }),
9916
+ /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { variant: "rect", width: 40, height: 10, className: "hidden sm:block ml-auto" })
9917
+ ]
9918
+ }
9919
+ ),
9920
+ Array.from({ length: 6 }, (_, i) => /* @__PURE__ */ jsxRuntime.jsx(AssetListSkeletonRow, { index: i }, i))
9921
+ ] });
9922
+ }
9923
+ var DashboardTokensViewSimple = ({
9924
+ sortedRegularTokens,
9925
+ isLoadingBalances,
9926
+ filters,
9927
+ selectedFilter,
9928
+ onFilterSelect,
9929
+ onHistoryClick
9930
+ }) => {
9931
+ if (isLoadingBalances) {
9932
+ return /* @__PURE__ */ jsxRuntime.jsx(
9933
+ "div",
9934
+ {
9935
+ "data-test-id": "asset-list-skeleton",
9936
+ "aria-busy": "true",
9937
+ "aria-label": "Carregando ativos\u2026",
9938
+ className: tailwindMerge.twMerge(
9939
+ "w-full self-start flex flex-col",
9940
+ "bg-[var(--deframe-widget-color-bg-secondary)] border border-[color:var(--deframe-widget-color-border-secondary)]",
9941
+ "rounded-[var(--deframe-widget-size-radius-md)]",
9942
+ "overflow-hidden"
9943
+ ),
9944
+ children: /* @__PURE__ */ jsxRuntime.jsx(AssetListSkeletonContent, {})
9945
+ }
9946
+ );
9947
+ }
9948
+ return /* @__PURE__ */ jsxRuntime.jsxs(
9949
+ "div",
9950
+ {
9951
+ "data-test-id": "asset-list",
9952
+ className: tailwindMerge.twMerge(
9953
+ "w-full self-start flex flex-col",
9954
+ "bg-[var(--deframe-widget-color-bg-secondary)] border border-[color:var(--deframe-widget-color-border-secondary)]",
9955
+ "rounded-[var(--deframe-widget-size-radius-md)]",
9956
+ "overflow-hidden"
9957
+ ),
9958
+ children: [
9959
+ /* @__PURE__ */ jsxRuntime.jsxs(
9960
+ "div",
9961
+ {
9962
+ "data-test-id": "asset-list-header",
9963
+ className: tailwindMerge.twMerge(
9964
+ "flex items-center justify-between",
9965
+ "px-[var(--deframe-widget-size-padding-x-md)] pt-[var(--deframe-widget-size-padding-y-md)] pb-[var(--deframe-widget-size-padding-y-sm)]"
9966
+ ),
9967
+ children: [
9968
+ /* @__PURE__ */ jsxRuntime.jsx(
9969
+ "h3",
9970
+ {
9971
+ className: "text-[color:var(--deframe-widget-color-text-primary)] text-[length:var(--deframe-widget-font-size-md)] [font-weight:var(--deframe-widget-font-weight-semibold)] font-[var(--deframe-widget-font-family)] leading-[var(--deframe-widget-font-leading-md)]",
9972
+ children: "Seus ativos"
9973
+ }
9974
+ ),
9975
+ onHistoryClick != null && /* @__PURE__ */ jsxRuntime.jsx(HistoryButton2, { onClick: onHistoryClick })
9976
+ ]
9977
+ }
9978
+ ),
9979
+ filters && filters.length > 0 && /* @__PURE__ */ jsxRuntime.jsx(
9980
+ "div",
9981
+ {
9982
+ "data-test-id": "asset-list-filter",
9983
+ className: tailwindMerge.twMerge(
9984
+ "flex items-center gap-[var(--deframe-widget-size-gap-sm)]",
9985
+ "px-[var(--deframe-widget-size-padding-x-md)] pb-[var(--deframe-widget-size-padding-y-sm)]",
9986
+ "overflow-x-auto [scrollbar-width:none]"
9987
+ ),
9988
+ children: filters.map((filter) => {
9989
+ const isSelected = filter.id === selectedFilter;
9990
+ return /* @__PURE__ */ jsxRuntime.jsx(
9991
+ "button",
9992
+ {
9993
+ type: "button",
9994
+ "data-test-id": "asset-list-filter-pill",
9995
+ onClick: () => onFilterSelect == null ? void 0 : onFilterSelect(filter.id),
9996
+ className: tailwindMerge.twMerge(
9997
+ "inline-flex items-center",
9998
+ "px-[var(--deframe-widget-size-padding-x-sm)] py-[5px]",
9999
+ "rounded-[var(--deframe-widget-size-radius-full)] border",
10000
+ "text-[length:var(--deframe-widget-font-size-xs)] [font-weight:var(--deframe-widget-font-weight-medium)] leading-[var(--deframe-widget-font-leading-xs)]",
10001
+ "font-[var(--deframe-widget-font-family)]",
10002
+ "cursor-pointer whitespace-nowrap flex-shrink-0",
10003
+ "outline-none transition-all duration-150",
10004
+ isSelected ? "bg-[color:color-mix(in_srgb,var(--deframe-widget-color-brand-primary)_12%,transparent)] border-[color:color-mix(in_srgb,var(--deframe-widget-color-brand-primary)_32%,transparent)] text-[color:var(--deframe-widget-color-brand-primary)]" : "bg-transparent border-[color:var(--deframe-widget-color-border-secondary)] text-[color:var(--deframe-widget-color-text-secondary)] hover:bg-[color:color-mix(in_srgb,var(--deframe-widget-color-bg-tertiary)_60%,transparent)]"
10005
+ ),
10006
+ children: filter.label
10007
+ },
10008
+ filter.id
10009
+ );
10010
+ })
10011
+ }
10012
+ ),
10013
+ /* @__PURE__ */ jsxRuntime.jsxs(
10014
+ "div",
10015
+ {
10016
+ "data-test-id": "asset-list-columns",
10017
+ className: tailwindMerge.twMerge(
10018
+ GRID_COLS,
10019
+ "px-[var(--deframe-widget-size-padding-x-md)] py-[var(--deframe-widget-size-padding-y-sm)]",
10020
+ "border-t border-[color:var(--deframe-widget-color-border-secondary)]"
10021
+ ),
10022
+ children: [
10023
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[length:var(--deframe-widget-font-size-xs)] [font-weight:var(--deframe-widget-font-weight-medium)] uppercase tracking-[0.08em] text-[color:var(--deframe-widget-color-text-tertiary)] leading-[var(--deframe-widget-font-leading-xs)]", children: "ATIVO" }),
10024
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[length:var(--deframe-widget-font-size-xs)] [font-weight:var(--deframe-widget-font-weight-medium)] uppercase tracking-[0.08em] text-[color:var(--deframe-widget-color-text-tertiary)] leading-[var(--deframe-widget-font-leading-xs)] text-center", children: "TEND\xCANCIA" }),
10025
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[length:var(--deframe-widget-font-size-xs)] [font-weight:var(--deframe-widget-font-weight-medium)] uppercase tracking-[0.08em] text-[color:var(--deframe-widget-color-text-tertiary)] leading-[var(--deframe-widget-font-leading-xs)] text-right", children: "SALDO" })
10026
+ ]
10027
+ }
10028
+ ),
10029
+ sortedRegularTokens.filter((t) => !isDustValue(t.amountInUSD)).map((item) => {
10030
+ var _a, _b;
10031
+ const m = item.metadata;
10032
+ const color = (_a = m == null ? void 0 : m.color) != null ? _a : "#888";
10033
+ const trendDirection = m == null ? void 0 : m.trendDirection;
10034
+ const trendValue = m == null ? void 0 : m.trendValue;
10035
+ const networkColor = (_b = m == null ? void 0 : m.networkColor) != null ? _b : "var(--deframe-widget-color-bg-tertiary)";
10036
+ const networkBadge = item.networkName ? { name: item.networkName, color: networkColor, iconUrl: item.networkLogoUrl } : void 0;
10037
+ const handleItemClick = item.onClick;
10038
+ return /* @__PURE__ */ jsxRuntime.jsxs(
10039
+ "div",
10040
+ {
10041
+ "data-test-id": "asset-list-item",
10042
+ onClick: handleItemClick,
10043
+ className: tailwindMerge.twMerge(
10044
+ GRID_COLS,
10045
+ "items-center",
10046
+ "px-[var(--deframe-widget-size-padding-x-md)] py-[11px]",
10047
+ "border-t border-[color:var(--deframe-widget-color-border-secondary)]",
10048
+ "transition-colors duration-150",
10049
+ "hover:bg-[color:color-mix(in_srgb,var(--deframe-widget-color-bg-tertiary)_60%,transparent)]",
10050
+ handleItemClick && "cursor-pointer"
10051
+ ),
10052
+ children: [
10053
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-[var(--deframe-widget-size-gap-sm)] min-w-0", children: [
10054
+ /* @__PURE__ */ jsxRuntime.jsx(TokenIcon3, { token: { name: item.name, color, iconUrl: item.logoUrl }, size: 36, badge: networkBadge, badgeSize: 14 }),
10055
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col min-w-0", children: [
10056
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[length:var(--deframe-widget-font-size-sm)] [font-weight:var(--deframe-widget-font-weight-semibold)] text-[color:var(--deframe-widget-color-text-primary)] leading-[var(--deframe-widget-font-leading-sm)] font-[var(--deframe-widget-font-family)] truncate", children: item.name }),
10057
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[length:var(--deframe-widget-font-size-xs)] text-[color:var(--deframe-widget-color-text-secondary)] leading-[var(--deframe-widget-font-leading-xs)]", children: item.symbol })
10058
+ ] })
10059
+ ] }),
10060
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex justify-center", children: trendDirection && trendValue ? /* @__PURE__ */ jsxRuntime.jsx(AssetTrendBadge, { direction: trendDirection, value: trendValue }) : null }),
10061
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-end text-right", children: [
10062
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[length:var(--deframe-widget-font-size-sm)] [font-weight:var(--deframe-widget-font-weight-semibold)] text-[color:var(--deframe-widget-color-text-primary)] leading-[var(--deframe-widget-font-leading-sm)] font-[var(--deframe-widget-font-family)]", children: item.formattedFiatValue }),
10063
+ /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-[length:var(--deframe-widget-font-size-xs)] text-[color:var(--deframe-widget-color-text-secondary)] leading-[var(--deframe-widget-font-leading-xs)]", children: [
10064
+ item.formattedAmount,
10065
+ " ",
10066
+ item.symbol
10067
+ ] })
10068
+ ] })
10069
+ ]
10070
+ },
10071
+ item.id
10072
+ );
10073
+ })
10074
+ ]
10075
+ }
10076
+ );
10077
+ };
9479
10078
  var DashboardRecentTransactionsView = ({
9480
10079
  isLoading,
9481
10080
  isEmpty,
@@ -9500,12 +10099,12 @@ var DashboardRecentTransactionsView = ({
9500
10099
  return /* @__PURE__ */ jsxRuntime.jsxs(
9501
10100
  ListItem,
9502
10101
  {
9503
- containerClassName: "p-2 mt-4 bg-[var(--deframe-widget-color-bg-secondary)] cursor-pointer",
10102
+ containerClassName: "p-2 mt-4 bg-[var(--deframe-widget-color-bg-raised)] cursor-pointer",
9504
10103
  onClick: () => item.onClick(),
9505
10104
  children: [
9506
10105
  /* @__PURE__ */ jsxRuntime.jsx(ListItemLeftSide, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
9507
10106
  /* @__PURE__ */ jsxRuntime.jsx("div", { className: `w-10 h-10 rounded-full ${item.iconBgColor} flex items-center justify-center`, children: /* @__PURE__ */ jsxRuntime.jsx(MainIcon, { className: `${item.iconColor}`, size: 20 }) }),
9508
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute -bottom-1 -right-1 w-5 h-5 rounded-full bg-[var(--deframe-widget-color-bg-secondary)] flex items-center justify-center border border-[var(--deframe-widget-color-border-secondary)]", children: /* @__PURE__ */ jsxRuntime.jsx(TypeIcon, { className: `${item.iconColor}`, size: 12 }) })
10107
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute -bottom-1 -right-1 w-5 h-5 rounded-full flex items-center justify-center border border-[var(--deframe-widget-color-border-secondary)]", children: /* @__PURE__ */ jsxRuntime.jsx(TypeIcon, { className: `${item.iconColor}`, size: 12 }) })
9509
10108
  ] }) }),
9510
10109
  /* @__PURE__ */ jsxRuntime.jsxs(ListItemContent, { className: "ml-4", children: [
9511
10110
  /* @__PURE__ */ jsxRuntime.jsx(TextBody, { variant: "text-small", children: item.formattedDate }),
@@ -9522,6 +10121,300 @@ var DashboardRecentTransactionsView = ({
9522
10121
  }) })
9523
10122
  ] }) });
9524
10123
  };
10124
+ var variantConfig = {
10125
+ pending: {
10126
+ wrapper: "bg-[color:color-mix(in_srgb,var(--deframe-widget-color-state-warning)_16%,transparent)] border-[color:color-mix(in_srgb,var(--deframe-widget-color-state-warning)_32%,transparent)]",
10127
+ dotClass: "bg-[var(--deframe-widget-color-state-warning)]",
10128
+ labelClass: "text-[color:var(--deframe-widget-color-state-warning)]",
10129
+ label: "Pendente"
10130
+ },
10131
+ confirmed: {
10132
+ wrapper: "bg-[color:color-mix(in_srgb,var(--deframe-widget-color-brand-primary)_12%,transparent)] border-[color:color-mix(in_srgb,var(--deframe-widget-color-brand-primary)_32%,transparent)]",
10133
+ dotClass: "bg-[var(--deframe-widget-color-brand-primary)]",
10134
+ labelClass: "text-[color:var(--deframe-widget-color-brand-primary)]",
10135
+ label: "Confirmado"
10136
+ },
10137
+ approved: {
10138
+ wrapper: "bg-[color:color-mix(in_srgb,var(--deframe-widget-color-brand-primary)_12%,transparent)] border-[color:color-mix(in_srgb,var(--deframe-widget-color-brand-primary)_32%,transparent)]",
10139
+ dotClass: "bg-[var(--deframe-widget-color-brand-primary)]",
10140
+ labelClass: "text-[color:var(--deframe-widget-color-brand-primary)]",
10141
+ label: "Aprovada"
10142
+ },
10143
+ failed: {
10144
+ wrapper: "bg-[color:color-mix(in_srgb,var(--deframe-widget-color-state-error)_16%,transparent)] border-[color:color-mix(in_srgb,var(--deframe-widget-color-state-error)_32%,transparent)]",
10145
+ dotClass: "bg-[var(--deframe-widget-color-state-error)]",
10146
+ labelClass: "text-[color:var(--deframe-widget-color-state-error)]",
10147
+ label: "Falhou"
10148
+ },
10149
+ processing: {
10150
+ wrapper: "bg-[color:color-mix(in_srgb,var(--deframe-widget-color-brand-secondary)_12%,transparent)] border-[color:color-mix(in_srgb,var(--deframe-widget-color-brand-secondary)_32%,transparent)]",
10151
+ dotClass: "bg-[var(--deframe-widget-color-brand-secondary)]",
10152
+ labelClass: "text-[color:var(--deframe-widget-color-brand-secondary)]",
10153
+ label: "Processando"
10154
+ }
10155
+ };
10156
+ function StatusBadge2({ status, label, className }) {
10157
+ const config = variantConfig[status];
10158
+ return /* @__PURE__ */ jsxRuntime.jsxs(
10159
+ "span",
10160
+ {
10161
+ "data-test-id": "status-badge",
10162
+ className: tailwindMerge.twMerge(
10163
+ "inline-flex items-center gap-[5px]",
10164
+ "py-[3px] pr-[10px] pl-[7px]",
10165
+ "rounded-[var(--deframe-widget-size-radius-full)]",
10166
+ "border",
10167
+ config.wrapper,
10168
+ className
10169
+ ),
10170
+ children: [
10171
+ /* @__PURE__ */ jsxRuntime.jsx(
10172
+ "span",
10173
+ {
10174
+ "data-test-id": "status-badge-dot",
10175
+ className: tailwindMerge.twMerge(
10176
+ "w-[7px] h-[7px] rounded-[var(--deframe-widget-size-radius-full)] flex-shrink-0 inline-block",
10177
+ config.dotClass
10178
+ )
10179
+ }
10180
+ ),
10181
+ /* @__PURE__ */ jsxRuntime.jsx(
10182
+ "span",
10183
+ {
10184
+ "data-test-id": "status-badge-label",
10185
+ className: tailwindMerge.twMerge(
10186
+ "text-[11px] [font-weight:var(--deframe-widget-font-weight-medium)] font-[var(--deframe-widget-font-family)]",
10187
+ config.labelClass
10188
+ ),
10189
+ children: label != null ? label : config.label
10190
+ }
10191
+ )
10192
+ ]
10193
+ }
10194
+ );
10195
+ }
10196
+ var DashboardRecentTransactionsViewSimple = ({
10197
+ isLoading,
10198
+ isEmpty,
10199
+ transactions,
10200
+ onClose
10201
+ }) => {
10202
+ const [query, setQuery] = React6.useState("");
10203
+ const filtered = React6.useMemo(() => {
10204
+ const q = query.trim().toLowerCase();
10205
+ if (!q) return transactions;
10206
+ return transactions.filter(
10207
+ (tx) => tx.label.toLowerCase().includes(q) || tx.formattedDate.toLowerCase().includes(q) || tx.rightPrimary.toLowerCase().includes(q) || tx.rightSecondary.toLowerCase().includes(q)
10208
+ );
10209
+ }, [transactions, query]);
10210
+ return /* @__PURE__ */ jsxRuntime.jsxs(
10211
+ "div",
10212
+ {
10213
+ "data-test-id": "dashboard-recent-transactions-simple",
10214
+ className: tailwindMerge.twMerge(
10215
+ "bg-[var(--deframe-widget-color-bg-secondary)]",
10216
+ "rounded-[var(--deframe-widget-size-radius-md)]",
10217
+ "border border-[color:var(--deframe-widget-color-border-secondary)]",
10218
+ "px-[var(--deframe-widget-size-padding-x-md)] py-[var(--deframe-widget-size-padding-y-md)]",
10219
+ "flex flex-col gap-[var(--deframe-widget-size-gap-md)] w-full",
10220
+ "font-[var(--deframe-widget-font-family)]"
10221
+ ),
10222
+ children: [
10223
+ /* @__PURE__ */ jsxRuntime.jsxs(
10224
+ "div",
10225
+ {
10226
+ "data-test-id": "dashboard-recent-transactions-simple-header",
10227
+ className: "flex items-start justify-between gap-[var(--deframe-widget-size-gap-sm)]",
10228
+ children: [
10229
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-[4px]", children: [
10230
+ /* @__PURE__ */ jsxRuntime.jsx(
10231
+ "h2",
10232
+ {
10233
+ "data-test-id": "dashboard-recent-transactions-simple-title",
10234
+ className: tailwindMerge.twMerge(
10235
+ "m-0 text-[20px] leading-[1.25]",
10236
+ "[font-weight:var(--deframe-widget-font-weight-bold)]",
10237
+ "text-[color:var(--deframe-widget-color-text-primary)]"
10238
+ ),
10239
+ children: "Hist\xF3rico"
10240
+ }
10241
+ ),
10242
+ /* @__PURE__ */ jsxRuntime.jsx(
10243
+ "p",
10244
+ {
10245
+ "data-test-id": "dashboard-recent-transactions-simple-subtitle",
10246
+ className: "m-0 text-[13px] text-[color:var(--deframe-widget-color-text-secondary)] leading-[1.4]",
10247
+ children: "\xDAltimas transa\xE7\xF5es executadas"
10248
+ }
10249
+ )
10250
+ ] }),
10251
+ onClose && /* @__PURE__ */ jsxRuntime.jsx(
10252
+ CloseButton_default,
10253
+ {
10254
+ onClick: onClose,
10255
+ ariaLabel: "Fechar",
10256
+ className: "flex-shrink-0 mt-[-4px]"
10257
+ }
10258
+ )
10259
+ ]
10260
+ }
10261
+ ),
10262
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-px bg-[var(--deframe-widget-color-border-secondary)]" }),
10263
+ /* @__PURE__ */ jsxRuntime.jsxs(
10264
+ "div",
10265
+ {
10266
+ "data-test-id": "dashboard-recent-transactions-simple-search",
10267
+ className: "relative",
10268
+ children: [
10269
+ /* @__PURE__ */ jsxRuntime.jsx(
10270
+ "input",
10271
+ {
10272
+ "data-test-id": "dashboard-recent-transactions-simple-search-input",
10273
+ type: "text",
10274
+ value: query,
10275
+ onChange: (e) => setQuery(e.target.value),
10276
+ placeholder: "Buscar por status, moeda, rede ou tx...",
10277
+ "aria-label": "Buscar transa\xE7\xE3o",
10278
+ className: [
10279
+ "w-full box-border h-10",
10280
+ "bg-[var(--deframe-widget-color-bg-tertiary)]",
10281
+ "border border-[color:var(--deframe-widget-color-border-secondary)]",
10282
+ "rounded-[var(--deframe-widget-size-radius-sm)]",
10283
+ "py-0 pr-[var(--deframe-widget-size-padding-x-xl)] pl-[14px]",
10284
+ "text-[14px] text-[color:var(--deframe-widget-color-text-primary)]",
10285
+ "outline-none focus:outline-none",
10286
+ "focus:border-[color:var(--deframe-widget-color-brand-primary)]",
10287
+ "transition-colors duration-150",
10288
+ "font-[var(--deframe-widget-font-family)]",
10289
+ "placeholder:text-[color:var(--deframe-widget-color-text-tertiary)]"
10290
+ ].join(" ")
10291
+ }
10292
+ ),
10293
+ /* @__PURE__ */ jsxRuntime.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__ */ jsxRuntime.jsxs(
10294
+ "svg",
10295
+ {
10296
+ width: "15",
10297
+ height: "15",
10298
+ viewBox: "0 0 24 24",
10299
+ fill: "none",
10300
+ stroke: "currentColor",
10301
+ strokeWidth: "2",
10302
+ strokeLinecap: "round",
10303
+ "aria-hidden": "true",
10304
+ children: [
10305
+ /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "11", cy: "11", r: "8" }),
10306
+ /* @__PURE__ */ jsxRuntime.jsx("line", { x1: "21", y1: "21", x2: "16.65", y2: "16.65" })
10307
+ ]
10308
+ }
10309
+ ) })
10310
+ ]
10311
+ }
10312
+ ),
10313
+ /* @__PURE__ */ jsxRuntime.jsx(
10314
+ "div",
10315
+ {
10316
+ "data-test-id": "dashboard-recent-transactions-simple-list",
10317
+ className: "flex flex-col gap-[var(--deframe-widget-size-gap-sm)]",
10318
+ children: isLoading ? [1, 2, 3].map((i) => /* @__PURE__ */ jsxRuntime.jsxs(
10319
+ "div",
10320
+ {
10321
+ className: tailwindMerge.twMerge(
10322
+ "flex flex-col gap-[6px]",
10323
+ "px-[var(--deframe-widget-size-padding-x-md)] py-[14px]",
10324
+ "rounded-[var(--deframe-widget-size-radius-sm)]",
10325
+ "border border-[color:var(--deframe-widget-color-border-secondary)]"
10326
+ ),
10327
+ children: [
10328
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between", children: [
10329
+ /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { width: "100px", height: "12px", shimmer: true }),
10330
+ /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { width: "80px", height: "20px", shimmer: true, className: "rounded-full" })
10331
+ ] }),
10332
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-start justify-between", children: [
10333
+ /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { width: "160px", height: "18px", shimmer: true }),
10334
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-end gap-[4px]", children: [
10335
+ /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { width: "96px", height: "14px", shimmer: true }),
10336
+ /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { width: "72px", height: "12px", shimmer: true })
10337
+ ] })
10338
+ ] })
10339
+ ]
10340
+ },
10341
+ i
10342
+ )) : isEmpty ? /* @__PURE__ */ jsxRuntime.jsx(DashboardTransactionsPlaceholder, {}) : filtered.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx(
10343
+ "div",
10344
+ {
10345
+ "data-test-id": "dashboard-recent-transactions-simple-no-results",
10346
+ className: "py-[var(--deframe-widget-size-padding-y-xl)] text-center text-[13px] text-[color:var(--deframe-widget-color-text-tertiary)]",
10347
+ children: "Nenhuma transa\xE7\xE3o encontrada"
10348
+ }
10349
+ ) : filtered.map((item) => /* @__PURE__ */ jsxRuntime.jsxs(
10350
+ "div",
10351
+ {
10352
+ "data-test-id": "dashboard-recent-transactions-simple-item",
10353
+ className: tailwindMerge.twMerge(
10354
+ "w-full flex flex-col gap-[6px]",
10355
+ "bg-[var(--deframe-widget-color-bg-secondary)]",
10356
+ "border border-[color:var(--deframe-widget-color-border-secondary)]",
10357
+ "rounded-[var(--deframe-widget-size-radius-sm)]",
10358
+ "px-[var(--deframe-widget-size-padding-x-md)] py-[14px]"
10359
+ ),
10360
+ children: [
10361
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between gap-[var(--deframe-widget-size-gap-sm)]", children: [
10362
+ /* @__PURE__ */ jsxRuntime.jsx(
10363
+ "span",
10364
+ {
10365
+ "data-test-id": "dashboard-recent-transactions-simple-item-date",
10366
+ className: "text-[12px] text-[color:var(--deframe-widget-color-text-tertiary)] leading-none",
10367
+ children: item.formattedDate
10368
+ }
10369
+ ),
10370
+ /* @__PURE__ */ jsxRuntime.jsx(StatusBadge2, { status: "approved" })
10371
+ ] }),
10372
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-start justify-between gap-[var(--deframe-widget-size-gap-sm)]", children: [
10373
+ /* @__PURE__ */ jsxRuntime.jsx(
10374
+ "span",
10375
+ {
10376
+ "data-test-id": "dashboard-recent-transactions-simple-item-label",
10377
+ className: tailwindMerge.twMerge(
10378
+ "text-[18px] leading-[1.2]",
10379
+ "[font-weight:var(--deframe-widget-font-weight-bold)]",
10380
+ "text-[color:var(--deframe-widget-color-text-primary)]"
10381
+ ),
10382
+ children: item.label
10383
+ }
10384
+ ),
10385
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-end gap-[2px] flex-shrink-0", children: [
10386
+ /* @__PURE__ */ jsxRuntime.jsx(
10387
+ "span",
10388
+ {
10389
+ "data-test-id": "dashboard-recent-transactions-simple-item-primary",
10390
+ className: tailwindMerge.twMerge(
10391
+ "text-[13px] leading-[1.3]",
10392
+ "[font-weight:var(--deframe-widget-font-weight-semibold)]",
10393
+ "text-[color:var(--deframe-widget-color-text-primary)]"
10394
+ ),
10395
+ children: item.rightPrimary
10396
+ }
10397
+ ),
10398
+ item.rightSecondary && /* @__PURE__ */ jsxRuntime.jsx(
10399
+ "span",
10400
+ {
10401
+ "data-test-id": "dashboard-recent-transactions-simple-item-secondary",
10402
+ className: "text-[12px] text-[color:var(--deframe-widget-color-text-secondary)] leading-none",
10403
+ children: item.rightSecondary
10404
+ }
10405
+ )
10406
+ ] })
10407
+ ] })
10408
+ ]
10409
+ },
10410
+ item.id
10411
+ ))
10412
+ }
10413
+ )
10414
+ ]
10415
+ }
10416
+ );
10417
+ };
9525
10418
  var DashboardInvestmentOpportunitiesView = ({
9526
10419
  isLoadingBalances,
9527
10420
  formattedTotalProfit,
@@ -9530,7 +10423,7 @@ var DashboardInvestmentOpportunitiesView = ({
9530
10423
  }) => {
9531
10424
  return /* @__PURE__ */ jsxRuntime.jsx(DashboardCard, { className: "hidden lg:block p-6", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col space-y-4", children: [
9532
10425
  /* @__PURE__ */ jsxRuntime.jsx(TextBody, { variant: "text-large", children: "Oportunidades de investimento" }),
9533
- /* @__PURE__ */ jsxRuntime.jsxs(DashboardCard, { className: "bg-[var(--deframe-widget-color-bg-secondary)] flex flex-col space-y-2 p-4", children: [
10426
+ /* @__PURE__ */ jsxRuntime.jsxs(DashboardCard, { className: "bg-[var(--deframe-widget-color-bg-raised)] flex flex-col space-y-2 p-4", children: [
9534
10427
  /* @__PURE__ */ jsxRuntime.jsx(TextBody, { children: "Rendimentos" }),
9535
10428
  isLoadingBalances ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-baseline gap-2", children: /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { width: "80px", height: "24px", shimmer: true }) }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-baseline gap-2", children: /* @__PURE__ */ jsxRuntime.jsx(TextBody, { variant: "text-large", children: formattedTotalProfit }) })
9536
10429
  ] }),
@@ -9552,15 +10445,15 @@ var DashboardView = ({
9552
10445
  /* @__PURE__ */ jsxRuntime.jsx(DashboardCard, { "data-testid": "dashboard-quick-actions-card", className: "hidden lg:block p-6", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col space-y-3", children: [
9553
10446
  /* @__PURE__ */ jsxRuntime.jsx(TextBody, { className: "mb-6", children: "A\xE7\xF5es r\xE1pidas" }),
9554
10447
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-row gap-4 w-full", children: [
9555
- /* @__PURE__ */ jsxRuntime.jsx(Link2__default.default, { "data-testid": "dashboard-quick-action-deposit", href: "/dashboard/deposit", className: "flex-1 min-w-0 cursor-pointer", onClick: () => quickActions.onDepositClick(), children: /* @__PURE__ */ jsxRuntime.jsxs(PrimaryButton, { children: [
10448
+ /* @__PURE__ */ jsxRuntime.jsx(Link2__default.default, { "data-testid": "dashboard-quick-action-deposit", href: "/dashboard/deposit", className: "flex-1 min-w-0 cursor-pointer", onClick: () => quickActions == null ? void 0 : quickActions.onDepositClick(), children: /* @__PURE__ */ jsxRuntime.jsxs(PrimaryButton, { children: [
9556
10449
  /* @__PURE__ */ jsxRuntime.jsx(md.MdOutlineArrowUpward, { className: "w-4 h-4 shrink-0" }),
9557
10450
  "Depositar"
9558
10451
  ] }) }),
9559
- /* @__PURE__ */ jsxRuntime.jsx(Link2__default.default, { "data-testid": "dashboard-quick-action-withdraw", href: "/dashboard/withdraw", className: "flex-1 min-w-0 cursor-pointer", onClick: () => quickActions.onWithdrawClick(), children: /* @__PURE__ */ jsxRuntime.jsxs(PrimaryButton, { children: [
10452
+ /* @__PURE__ */ jsxRuntime.jsx(Link2__default.default, { "data-testid": "dashboard-quick-action-withdraw", href: "/dashboard/withdraw", className: "flex-1 min-w-0 cursor-pointer", onClick: () => quickActions == null ? void 0 : quickActions.onWithdrawClick(), children: /* @__PURE__ */ jsxRuntime.jsxs(PrimaryButton, { children: [
9560
10453
  /* @__PURE__ */ jsxRuntime.jsx(md.MdOutlineArrowDownward, { className: "w-4 h-4 shrink-0" }),
9561
10454
  "Sacar"
9562
10455
  ] }) }),
9563
- /* @__PURE__ */ jsxRuntime.jsx(Link2__default.default, { "data-testid": "dashboard-quick-action-swap", href: "/dashboard/swap", className: "flex-1 min-w-0 cursor-pointer", onClick: () => quickActions.onSwapClick(), children: /* @__PURE__ */ jsxRuntime.jsxs(PrimaryButton, { children: [
10456
+ /* @__PURE__ */ jsxRuntime.jsx(Link2__default.default, { "data-testid": "dashboard-quick-action-swap", href: "/dashboard/swap", className: "flex-1 min-w-0 cursor-pointer", onClick: () => quickActions == null ? void 0 : quickActions.onSwapClick(), children: /* @__PURE__ */ jsxRuntime.jsxs(PrimaryButton, { children: [
9564
10457
  /* @__PURE__ */ jsxRuntime.jsx(md.MdOutlineSwapHoriz, { className: "w-4 h-4 shrink-0" }),
9565
10458
  "Trocar"
9566
10459
  ] }) })
@@ -9569,17 +10462,87 @@ var DashboardView = ({
9569
10462
  /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-full bg-[#002608] rounded shadow-[0px_1px_3px_0px_rgba(0,0,0,0.1)] flex items-center justify-between cursor-pointer", children: /* @__PURE__ */ jsxRuntime.jsx(
9570
10463
  "img",
9571
10464
  {
9572
- src: banner.imageUrl,
9573
- alt: banner.altText,
10465
+ src: banner == null ? void 0 : banner.imageUrl,
10466
+ alt: banner == null ? void 0 : banner.altText,
9574
10467
  className: "w-full h-[90%] object-cover rounded"
9575
10468
  }
9576
10469
  ) }),
9577
10470
  /* @__PURE__ */ jsxRuntime.jsx(DashboardTokensView, __spreadValues({}, tokens)),
9578
- /* @__PURE__ */ jsxRuntime.jsx(DashboardRecentTransactionsView, __spreadValues({}, recentTransactions))
10471
+ recentTransactions && /* @__PURE__ */ jsxRuntime.jsx(DashboardRecentTransactionsView, __spreadValues({}, recentTransactions))
9579
10472
  ] }),
9580
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "lg:col-span-1 space-y-6", children: /* @__PURE__ */ jsxRuntime.jsx(DashboardInvestmentOpportunitiesView, __spreadValues({}, investmentOpportunities)) })
10473
+ investmentOpportunities && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "lg:col-span-1 space-y-6", children: /* @__PURE__ */ jsxRuntime.jsx(DashboardInvestmentOpportunitiesView, __spreadValues({}, investmentOpportunities)) })
9581
10474
  ] }) });
9582
10475
  };
10476
+ var DashboardViewSimple = ({
10477
+ portfolio,
10478
+ tokens,
10479
+ quickActions
10480
+ }) => {
10481
+ const assetCount = tokens.sortedRegularTokens.filter((t) => !isDustValue(t.amountInUSD)).length;
10482
+ return /* @__PURE__ */ jsxRuntime.jsxs(
10483
+ "div",
10484
+ {
10485
+ "data-test-id": "dashboard-page-simple",
10486
+ className: "w-full flex flex-col gap-[var(--deframe-widget-size-gap-md)]",
10487
+ children: [
10488
+ /* @__PURE__ */ jsxRuntime.jsxs(
10489
+ "div",
10490
+ {
10491
+ "data-test-id": "dashboard-home-header",
10492
+ className: "flex items-center justify-between gap-[var(--deframe-widget-size-gap-md)]",
10493
+ children: [
10494
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-[var(--deframe-widget-size-gap-xs)]", children: [
10495
+ /* @__PURE__ */ jsxRuntime.jsx(
10496
+ "h1",
10497
+ {
10498
+ "data-test-id": "dashboard-home-title",
10499
+ className: "text-[color:var(--deframe-widget-color-text-primary)] text-[length:var(--deframe-widget-font-size-xxl)] [font-weight:var(--deframe-widget-font-weight-bold)] leading-[var(--deframe-widget-font-leading-xxl)] font-[var(--deframe-widget-font-family)]",
10500
+ children: "Wallet"
10501
+ }
10502
+ ),
10503
+ /* @__PURE__ */ jsxRuntime.jsx(
10504
+ "p",
10505
+ {
10506
+ "data-test-id": "dashboard-home-subtitle",
10507
+ className: "text-[color:var(--deframe-widget-color-text-secondary)] text-[length:var(--deframe-widget-font-size-sm)] leading-[var(--deframe-widget-font-leading-sm)] font-[var(--deframe-widget-font-family)]",
10508
+ children: "Resumo da sua carteira e movimenta\xE7\xF5es."
10509
+ }
10510
+ )
10511
+ ] }),
10512
+ /* @__PURE__ */ jsxRuntime.jsxs(
10513
+ "div",
10514
+ {
10515
+ "data-test-id": "dashboard-home-actions",
10516
+ className: "flex items-center gap-[var(--deframe-widget-size-gap-sm)] flex-shrink-0",
10517
+ children: [
10518
+ /* @__PURE__ */ jsxRuntime.jsx(
10519
+ PrimaryButton,
10520
+ {
10521
+ className: "w-auto py-[var(--deframe-widget-size-padding-y-sm)] [font-weight:var(--deframe-widget-font-weight-medium)]",
10522
+ onClick: () => quickActions == null ? void 0 : quickActions.onDepositClick(),
10523
+ children: "Depositar"
10524
+ }
10525
+ ),
10526
+ /* @__PURE__ */ jsxRuntime.jsx(
10527
+ SecondaryButton,
10528
+ {
10529
+ className: "w-auto py-[var(--deframe-widget-size-padding-y-sm)] [font-weight:var(--deframe-widget-font-weight-medium)]",
10530
+ onClick: () => quickActions == null ? void 0 : quickActions.onWithdrawClick(),
10531
+ children: "Sacar"
10532
+ }
10533
+ )
10534
+ ]
10535
+ }
10536
+ )
10537
+ ]
10538
+ }
10539
+ ),
10540
+ /* @__PURE__ */ jsxRuntime.jsx(DashboardPortfolioViewSimple, __spreadProps(__spreadValues({}, portfolio), { assetCount })),
10541
+ /* @__PURE__ */ jsxRuntime.jsx(DashboardTokensViewSimple, __spreadValues({}, tokens))
10542
+ ]
10543
+ }
10544
+ );
10545
+ };
9583
10546
 
9584
10547
  exports.ActionButton = ActionButton;
9585
10548
  exports.ActionSheet = ActionSheet;
@@ -9588,6 +10551,8 @@ exports.ApyRange = ApyRange;
9588
10551
  exports.BackButton = BackButton;
9589
10552
  exports.BackgroundContainer = BackgroundContainer;
9590
10553
  exports.BannerNotification = BannerNotification;
10554
+ exports.Chip = Chip;
10555
+ exports.ChipGroup = ChipGroup;
9591
10556
  exports.ChooseANetworkView = ChooseANetworkView;
9592
10557
  exports.ChooseAStrategyActionsheetView = ChooseAStrategyActionsheetView;
9593
10558
  exports.ChooseAnAssetSwapView = ChooseAnAssetSwapView;
@@ -9603,12 +10568,16 @@ exports.DashboardBalancesBreakdown = DashboardBalancesBreakdown;
9603
10568
  exports.DashboardCard = DashboardCard;
9604
10569
  exports.DashboardInvestmentOpportunitiesView = DashboardInvestmentOpportunitiesView;
9605
10570
  exports.DashboardPortfolioView = DashboardPortfolioView;
10571
+ exports.DashboardPortfolioViewSimple = DashboardPortfolioViewSimple;
9606
10572
  exports.DashboardRecentTransactionsView = DashboardRecentTransactionsView;
10573
+ exports.DashboardRecentTransactionsViewSimple = DashboardRecentTransactionsViewSimple;
9607
10574
  exports.DashboardStrategiesListView = DashboardStrategiesListView;
9608
10575
  exports.DashboardTokenListView = DashboardTokenListView;
9609
10576
  exports.DashboardTokensView = DashboardTokensView;
10577
+ exports.DashboardTokensViewSimple = DashboardTokensViewSimple;
9610
10578
  exports.DashboardTransactionsPlaceholder = DashboardTransactionsPlaceholder;
9611
10579
  exports.DashboardView = DashboardView;
10580
+ exports.DashboardViewSimple = DashboardViewSimple;
9612
10581
  exports.DeframeComponentsProvider = DeframeComponentsProvider;
9613
10582
  exports.DetailsHeader = DetailsHeader;
9614
10583
  exports.EarnAmountInputView = EarnAmountInputView;
@@ -9625,6 +10594,7 @@ exports.EarnInvestedSectionView = EarnInvestedSectionView;
9625
10594
  exports.EarnInvestmentDetailsView = EarnInvestmentDetailsView;
9626
10595
  exports.EarnInvestmentSummaryView = EarnInvestmentSummaryView;
9627
10596
  exports.EarnNoBalanceNotificationView = EarnNoBalanceNotificationView;
10597
+ exports.EarnOverviewView = EarnOverviewView;
9628
10598
  exports.EarnPercentageButtonsView = EarnPercentageButtonsView;
9629
10599
  exports.EarnPositionCardView = EarnPositionCardView;
9630
10600
  exports.EarnRecentTransactionsView = EarnRecentTransactionsView;
@@ -9726,5 +10696,6 @@ exports.WalletConnectPanel = WalletConnectPanel;
9726
10696
  exports.WalletItem = WalletItem;
9727
10697
  exports.WalletList = ConnectWalletList;
9728
10698
  exports.WalletListContainer = WalletListContainer;
10699
+ exports.isDustValue = isDustValue;
9729
10700
  //# sourceMappingURL=index.js.map
9730
10701
  //# sourceMappingURL=index.js.map