@deframe-sdk/components 0.1.26 → 0.1.28

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.mjs CHANGED
@@ -1541,7 +1541,7 @@ var Skeleton = (_a) => {
1541
1541
  width = "100%",
1542
1542
  height = "1rem",
1543
1543
  variant = "text",
1544
- shimmer = true,
1544
+ shimmer: shimmer2 = true,
1545
1545
  className,
1546
1546
  style
1547
1547
  } = _b, props = __objRest(_b, [
@@ -1567,7 +1567,7 @@ var Skeleton = (_a) => {
1567
1567
  background: defaultGradient
1568
1568
  }, style)
1569
1569
  }, props), {
1570
- children: shimmer && /* @__PURE__ */ jsx("div", { className: "absolute inset-0 animate-shimmer bg-gradient-to-r from-transparent via-[color-mix(in srgb, var(--deframe-widget-color-bg-tertiary) 92%, transparent)] to-transparent" })
1570
+ children: shimmer2 && /* @__PURE__ */ jsx("div", { className: "absolute inset-0 animate-shimmer bg-gradient-to-r from-transparent via-[color-mix(in srgb, var(--deframe-widget-color-bg-tertiary) 92%, transparent)] to-transparent" })
1571
1571
  })
1572
1572
  );
1573
1573
  };
@@ -7021,14 +7021,24 @@ function ChooseNetworkAndAssetViewSimple({
7021
7021
  "data-test-id": "sheet-header",
7022
7022
  className: "flex items-center justify-between pt-[var(--deframe-widget-size-padding-y-xs)].5 pr-[var(--deframe-widget-size-padding-x-md)] pb-[var(--deframe-widget-size-padding-y-sm)].5 pl-[var(--deframe-widget-size-padding-x-md)] flex-shrink-0",
7023
7023
  children: [
7024
- /* @__PURE__ */ jsx(
7025
- "span",
7026
- {
7027
- "data-test-id": "sheet-title",
7028
- className: "text-[16px] [font-weight:var(--deframe-widget-font-weight-semibold)] text-[color:var(--deframe-widget-color-text-primary)] font-[var(--deframe-widget-font-family)]",
7029
- children: labels.title
7030
- }
7031
- ),
7024
+ /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
7025
+ /* @__PURE__ */ jsx(
7026
+ "span",
7027
+ {
7028
+ "data-test-id": "sheet-title",
7029
+ className: "text-[16px] [font-weight:var(--deframe-widget-font-weight-semibold)] text-[color:var(--deframe-widget-color-text-primary)] font-[var(--deframe-widget-font-family)]",
7030
+ children: labels.title
7031
+ }
7032
+ ),
7033
+ labels.subtitle && /* @__PURE__ */ jsx(
7034
+ "span",
7035
+ {
7036
+ "data-test-id": "sheet-subtitle",
7037
+ className: "text-[13px] text-[color:var(--deframe-widget-color-text-secondary)] font-[var(--deframe-widget-font-family)] mt-[2px]",
7038
+ children: labels.subtitle
7039
+ }
7040
+ )
7041
+ ] }),
7032
7042
  /* @__PURE__ */ jsx(CloseButtonInline, { onClick: onClose, ariaLabel: labels.closeAriaLabel })
7033
7043
  ]
7034
7044
  }
@@ -7129,14 +7139,24 @@ function ChooseNetworkAndAssetViewSimple({
7129
7139
  "data-test-id": "modal-header",
7130
7140
  className: "flex items-center justify-between pt-[var(--deframe-widget-size-padding-y-md)] pr-[var(--deframe-widget-size-padding-x-md)] pb-[14px] pl-[var(--deframe-widget-size-padding-x-md)] border-b border-[color:var(--deframe-widget-color-border-secondary)] flex-shrink-0",
7131
7141
  children: [
7132
- /* @__PURE__ */ jsx(
7133
- "span",
7134
- {
7135
- "data-test-id": "modal-title",
7136
- className: "text-[16px] [font-weight:var(--deframe-widget-font-weight-semibold)] text-[color:var(--deframe-widget-color-text-primary)] font-[var(--deframe-widget-font-family)]",
7137
- children: labels.title
7138
- }
7139
- ),
7142
+ /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
7143
+ /* @__PURE__ */ jsx(
7144
+ "span",
7145
+ {
7146
+ "data-test-id": "modal-title",
7147
+ className: "text-[16px] [font-weight:var(--deframe-widget-font-weight-semibold)] text-[color:var(--deframe-widget-color-text-primary)] font-[var(--deframe-widget-font-family)]",
7148
+ children: labels.title
7149
+ }
7150
+ ),
7151
+ labels.subtitle && /* @__PURE__ */ jsx(
7152
+ "span",
7153
+ {
7154
+ "data-test-id": "modal-subtitle",
7155
+ className: "text-[13px] text-[color:var(--deframe-widget-color-text-secondary)] font-[var(--deframe-widget-font-family)] mt-[2px]",
7156
+ children: labels.subtitle
7157
+ }
7158
+ )
7159
+ ] }),
7140
7160
  /* @__PURE__ */ jsx(CloseButtonInline, { onClick: onClose, ariaLabel: labels.closeAriaLabel })
7141
7161
  ]
7142
7162
  }
@@ -8443,6 +8463,35 @@ var EarnPositionCardView = ({
8443
8463
  /* @__PURE__ */ jsx(TextBody, { as: "span", variant: "text-small", className: "text-[color:var(--deframe-widget-color-text-tertiary)]", children: balanceToken })
8444
8464
  ] })
8445
8465
  ] }) }) }) });
8466
+ var shimmer = "animate-pulse rounded-[var(--deframe-widget-size-radius-sm)]";
8467
+ var bg = "bg-[var(--deframe-widget-color-bg-tertiary)]";
8468
+ var EarnFlowSkeletonSimple = () => {
8469
+ const panelClasses = [
8470
+ "relative flex flex-col overflow-hidden w-[420px]",
8471
+ "rounded-[var(--deframe-widget-size-radius-md)]",
8472
+ "border border-[color:var(--deframe-widget-color-border-secondary)]",
8473
+ "font-[var(--deframe-widget-font-family)]"
8474
+ ].join(" ");
8475
+ return /* @__PURE__ */ jsxs("div", { "data-test-id": "earn-flow-skeleton-simple", className: panelClasses, children: [
8476
+ /* @__PURE__ */ jsx("div", { className: "flex items-center px-[var(--deframe-widget-size-padding-x-md)] py-[var(--deframe-widget-size-padding-y-md)]", children: /* @__PURE__ */ jsx("div", { className: `w-24 h-5 ${shimmer} ${bg}` }) }),
8477
+ /* @__PURE__ */ jsx("div", { className: "h-px bg-[var(--deframe-widget-color-border-secondary)]" }),
8478
+ /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-[var(--deframe-widget-size-gap-md)] px-[var(--deframe-widget-size-padding-x-md)] py-[var(--deframe-widget-size-padding-y-md)]", children: /* @__PURE__ */ jsxs("div", { className: "rounded-[var(--deframe-widget-size-radius-sm)] border border-[color:var(--deframe-widget-color-border-secondary)] bg-[var(--deframe-widget-color-bg-secondary)] px-[var(--deframe-widget-size-padding-x-md)] py-[var(--deframe-widget-size-padding-y-md)]", children: [
8479
+ /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-[var(--deframe-widget-size-gap-sm)]", children: [
8480
+ /* @__PURE__ */ jsx("div", { className: `w-[120px] h-[42px] ${shimmer} ${bg} flex-shrink-0` }),
8481
+ /* @__PURE__ */ jsx("div", { className: "w-px h-10 bg-[var(--deframe-widget-color-border-secondary)] flex-shrink-0" }),
8482
+ /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-end flex-1 min-w-0 gap-1", children: [
8483
+ /* @__PURE__ */ jsx("div", { className: `w-20 h-9 ${shimmer} ${bg}` }),
8484
+ /* @__PURE__ */ jsx("div", { className: `w-12 h-4 ${shimmer} ${bg}` })
8485
+ ] })
8486
+ ] }),
8487
+ /* @__PURE__ */ jsx("div", { className: "mt-[var(--deframe-widget-size-gap-sm)]", children: /* @__PURE__ */ jsx("div", { className: `w-32 h-4 ${shimmer} ${bg}` }) })
8488
+ ] }) }),
8489
+ /* @__PURE__ */ jsxs("div", { className: "flex gap-[var(--deframe-widget-size-gap-sm)] px-[var(--deframe-widget-size-padding-x-md)] pb-[var(--deframe-widget-size-padding-y-md)]", children: [
8490
+ /* @__PURE__ */ jsx("div", { className: `flex-1 h-12 ${shimmer} ${bg}` }),
8491
+ /* @__PURE__ */ jsx("div", { className: `flex-1 h-12 ${shimmer} ${bg}` })
8492
+ ] })
8493
+ ] });
8494
+ };
8446
8495
  var EarnDepositFormView = ({
8447
8496
  // Header / Layout
8448
8497
  headerTitle,
@@ -8595,7 +8644,7 @@ var EarnTokenSelectorSimpleView = ({
8595
8644
  const isInteractive = !!onTokenClick;
8596
8645
  const baseClasses = [
8597
8646
  "inline-flex items-center gap-[10px]",
8598
- "py-[var(--deframe-widget-size-padding-y-sm)] px-[10px]",
8647
+ "h-[54px] px-[10px]",
8599
8648
  "rounded-[var(--deframe-widget-size-radius-sm)]",
8600
8649
  "bg-[var(--deframe-widget-color-bg-tertiary)]",
8601
8650
  "border-none outline-none",
@@ -8603,7 +8652,7 @@ var EarnTokenSelectorSimpleView = ({
8603
8652
  "flex-shrink-0"
8604
8653
  ].join(" ");
8605
8654
  const stateClasses = {
8606
- interactive: "cursor-pointer hover:bg-[color:color-mix(in_srgb,var(--deframe-widget-color-bg-tertiary)_80%,var(--deframe-widget-color-border-secondary))]",
8655
+ interactive: "cursor-pointer hover:bg-[color:color-mix(in_srgb,var(--deframe-widget-color-bg-tertiary)_72%,transparent)]",
8607
8656
  static: "cursor-default"
8608
8657
  };
8609
8658
  const selectorClasses = twMerge(
@@ -8712,7 +8761,7 @@ var EarnTokenSelectorSimpleView = ({
8712
8761
  "span",
8713
8762
  {
8714
8763
  "data-test-id": "earn-token-selector-simple-view-placeholder",
8715
- className: "text-[12px] tracking-[0.08em] uppercase [font-weight:var(--deframe-widget-font-weight-semibold)] text-[color:var(--deframe-widget-color-text-tertiary)] font-[var(--deframe-widget-font-family)] leading-[1] whitespace-nowrap",
8764
+ className: "text-[11px] uppercase [font-weight:var(--deframe-widget-font-weight-regular)] text-[color:var(--deframe-widget-color-text-secondary)] font-[var(--deframe-widget-font-family)] whitespace-nowrap",
8716
8765
  children: selectTokenLabel
8717
8766
  }
8718
8767
  ),
@@ -8741,6 +8790,7 @@ var EarnAmountInputSimpleView = ({
8741
8790
  "w-full",
8742
8791
  "px-[var(--deframe-widget-size-padding-x-none)] py-[var(--deframe-widget-size-padding-y-none)]",
8743
8792
  "font-[var(--deframe-widget-font-family)]",
8793
+ "placeholder:text-[color:var(--deframe-widget-color-text-tertiary)]",
8744
8794
  "[appearance:textfield]",
8745
8795
  "[&::-webkit-outer-spin-button]:appearance-none",
8746
8796
  "[&::-webkit-inner-spin-button]:appearance-none"
@@ -8990,7 +9040,6 @@ var EarnDepositFormViewSimple = ({
8990
9040
  const panelBaseClasses = [
8991
9041
  "relative flex flex-col overflow-hidden w-[420px]",
8992
9042
  "rounded-[var(--deframe-widget-size-radius-md)]",
8993
- "bg-[var(--deframe-widget-color-bg-primary)]",
8994
9043
  "border border-[color:var(--deframe-widget-color-border-secondary)]",
8995
9044
  "font-[var(--deframe-widget-font-family)]"
8996
9045
  ].join(" ");
@@ -9209,9 +9258,11 @@ var EarnDepositFormViewSimple = ({
9209
9258
  type: "submit",
9210
9259
  className: [
9211
9260
  "flex-1 h-12 rounded-[var(--deframe-widget-size-radius-sm)]",
9212
- "text-[15px] text-[color:var(--deframe-widget-color-text-primary-dark)]",
9261
+ "border-none",
9262
+ "text-[15px]",
9263
+ isSubmitDisabled ? "text-[color:var(--deframe-widget-color-text-primary-disabled)]" : "text-[color:var(--deframe-widget-color-text-primary-dark)]",
9213
9264
  "outline-none",
9214
- "transition-[background,color,opacity] duration-150"
9265
+ "transition-[background,color] duration-200"
9215
9266
  ].join(" "),
9216
9267
  disabled: isSubmitDisabled,
9217
9268
  "aria-disabled": isSubmitDisabled,
@@ -9443,7 +9494,6 @@ var EarnWithdrawFormViewSimple = ({
9443
9494
  const panelBaseClasses = [
9444
9495
  "relative flex flex-col overflow-hidden w-[420px]",
9445
9496
  "rounded-[var(--deframe-widget-size-radius-md)]",
9446
- "bg-[var(--deframe-widget-color-bg-primary)]",
9447
9497
  "border border-[color:var(--deframe-widget-color-border-secondary)]",
9448
9498
  "font-[var(--deframe-widget-font-family)]"
9449
9499
  ].join(" ");
@@ -9651,9 +9701,11 @@ var EarnWithdrawFormViewSimple = ({
9651
9701
  type: "submit",
9652
9702
  className: [
9653
9703
  "flex-1 h-12 rounded-[var(--deframe-widget-size-radius-sm)]",
9654
- "text-[15px] text-[color:var(--deframe-widget-color-text-primary-dark)]",
9704
+ "border-none",
9705
+ "text-[15px]",
9706
+ isSubmitDisabled ? "text-[color:var(--deframe-widget-color-text-primary-disabled)]" : "text-[color:var(--deframe-widget-color-text-primary-dark)]",
9655
9707
  "outline-none",
9656
- "transition-[background,color,opacity] duration-150"
9708
+ "transition-[background,color] duration-200"
9657
9709
  ].join(" "),
9658
9710
  disabled: isSubmitDisabled,
9659
9711
  "aria-disabled": isSubmitDisabled,
@@ -9873,7 +9925,6 @@ function EarnFeedbackOverlaySimpleView({
9873
9925
  const wrapperClasses = twMerge(
9874
9926
  "relative flex flex-col overflow-hidden w-[420px]",
9875
9927
  "rounded-[var(--deframe-widget-size-radius-md)]",
9876
- "bg-[var(--deframe-widget-color-bg-primary)]",
9877
9928
  "border border-[color:var(--deframe-widget-color-border-secondary)]",
9878
9929
  "font-[var(--deframe-widget-font-family)]"
9879
9930
  );
@@ -12062,6 +12113,6 @@ var DashboardViewSimple = ({
12062
12113
  );
12063
12114
  };
12064
12115
 
12065
- export { ActionButton, ActionSheet, AddressDisplay, ApyRange, BackButton, BackgroundContainer, BannerNotification, Chip, ChipGroup, ChooseANetworkView, ChooseAStrategyActionsheetView, ChooseAnAssetSwapView, ChooseNetworkAndAssetViewSimple, CloseButton_default as CloseButton, CollapsibleInfoRow, CollapsibleSection, ConfirmSwapButtonView, ConfirmSwapButtonViewSimple, ConnectWalletList, Currency, DashboardBalancesBreakdown, DashboardCard, DashboardInvestmentOpportunitiesView, DashboardPortfolioView, DashboardPortfolioViewSimple, DashboardRecentTransactionsView, DashboardRecentTransactionsViewSimple, DashboardStrategiesListView, DashboardTokenListView, DashboardTokensView, DashboardTokensViewSimple, DashboardTransactionsPlaceholder, DashboardView, DashboardViewSimple, DeframeComponentsProvider, DetailsHeader, EarnAmountInputView, EarnBalanceCard, EarnBytecodeErrorView, EarnDepositFailedSimpleView, EarnDepositFailedView, EarnDepositFormView, EarnDepositFormViewSimple, EarnDepositProcessingSimpleView, EarnDepositProcessingView, EarnDepositSuccessSimpleView, EarnDepositSuccessView, EarnDepositWarningSimpleView, EarnDepositWarningView, EarnDesktopView, EarnExploreGridView, EarnInvestedSectionView, EarnInvestmentDetailsView, EarnInvestmentSummaryView, EarnNoBalanceNotificationView, EarnOverviewView, EarnPercentageButtonsView, EarnPositionCardView, EarnRecentTransactionsView, EarnTokenSelectorView, EarnTxStatusCardView, EarnWithdrawFailedSimpleView, EarnWithdrawFailedView, EarnWithdrawFormView, EarnWithdrawFormViewSimple, EarnWithdrawProcessingSimpleView, EarnWithdrawProcessingView, EarnWithdrawSuccessSimpleView, EarnWithdrawSuccessView, EarnWithdrawTokenSelectorView, EarnWithdrawWarningSimpleView, EarnWithdrawWarningView, Currency as Fiat, FlexCol, FlexRow, GroupedStrategyListView, HighRiskBadge, HistoryDepositDetailsView, HistoryListSkeleton, HistoryListView, HistorySwapDetailsView, HistoryTabEmpty, HistoryWithdrawDetailsView, InfoLabel, InfoRow, InfoRowIconLabel, InfoRowIconValue, InfoRowWithIcon, InfoValue, Input2 as Input, InvestmentCrossChainProcessingView, Label, Link, ListItem, ListItemContent, ListItemLeftSide, ListItemRightSide, LoadingDots, LowRiskBadge, MediumRiskBadge, Navbar, PercentageButton, PrimaryButton, ProcessingBadge, ProgressIndicator, ScrollableContent, SearchEmptyState, SearchInput, SecondaryButton, SectionCard, Select, SelectContent, SelectItem, SelectTrigger, Skeleton, StepDisplay, StepStatusIcon, StepStatusText, StrategyDetailsView, StrategyGridCard, SummaryDetails, SummaryDetailsCryptoControlV2, SwapAdvancedSettingsView, SwapAmountInputView, SwapCrossChainProcessingView, SwapFormView, SwapFormViewSimple, SwapFromCardView, SwapFromCardViewSimple, SwapHistoryView, SwapProcessingView, SwapProcessingViewSimple, SwapQuoteDetailsView, SwapSignatureWarningView, SwapSignatureWarningViewSimple, SwapSuccessView, SwapSuccessViewSimple, SwapToCardView, SwapToCardViewSimple, SwapTransactionFailedView, SwapTransactionFailedViewSimple, SwapWidgetFallbackView, Tabs, TabsContent, TabsList, TabsTrigger, TertiaryButton, Text_default as Text, TextAccent, TextBody, TextHeading, Title, TokenWithChainBadge, TransactionProcessingDetails, TransactionScreen, TransactionScreenIcon, TransactionScreenInvestmentCard, WalletBalances, WalletConnectPanel, WalletItem, ConnectWalletList as WalletList, WalletListContainer, isDustValue };
12116
+ export { ActionButton, ActionSheet, AddressDisplay, ApyRange, BackButton, BackgroundContainer, BannerNotification, Chip, ChipGroup, ChooseANetworkView, ChooseAStrategyActionsheetView, ChooseAnAssetSwapView, ChooseNetworkAndAssetViewSimple, CloseButton_default as CloseButton, CollapsibleInfoRow, CollapsibleSection, ConfirmSwapButtonView, ConfirmSwapButtonViewSimple, ConnectWalletList, Currency, DashboardBalancesBreakdown, DashboardCard, DashboardInvestmentOpportunitiesView, DashboardPortfolioView, DashboardPortfolioViewSimple, DashboardRecentTransactionsView, DashboardRecentTransactionsViewSimple, DashboardStrategiesListView, DashboardTokenListView, DashboardTokensView, DashboardTokensViewSimple, DashboardTransactionsPlaceholder, DashboardView, DashboardViewSimple, DeframeComponentsProvider, DetailsHeader, EarnAmountInputView, EarnBalanceCard, EarnBytecodeErrorView, EarnDepositFailedSimpleView, EarnDepositFailedView, EarnDepositFormView, EarnDepositFormViewSimple, EarnDepositProcessingSimpleView, EarnDepositProcessingView, EarnDepositSuccessSimpleView, EarnDepositSuccessView, EarnDepositWarningSimpleView, EarnDepositWarningView, EarnDesktopView, EarnExploreGridView, EarnFlowSkeletonSimple, EarnInvestedSectionView, EarnInvestmentDetailsView, EarnInvestmentSummaryView, EarnNoBalanceNotificationView, EarnOverviewView, EarnPercentageButtonsView, EarnPositionCardView, EarnRecentTransactionsView, EarnTokenSelectorView, EarnTxStatusCardView, EarnWithdrawFailedSimpleView, EarnWithdrawFailedView, EarnWithdrawFormView, EarnWithdrawFormViewSimple, EarnWithdrawProcessingSimpleView, EarnWithdrawProcessingView, EarnWithdrawSuccessSimpleView, EarnWithdrawSuccessView, EarnWithdrawTokenSelectorView, EarnWithdrawWarningSimpleView, EarnWithdrawWarningView, Currency as Fiat, FlexCol, FlexRow, GroupedStrategyListView, HighRiskBadge, HistoryDepositDetailsView, HistoryListSkeleton, HistoryListView, HistorySwapDetailsView, HistoryTabEmpty, HistoryWithdrawDetailsView, InfoLabel, InfoRow, InfoRowIconLabel, InfoRowIconValue, InfoRowWithIcon, InfoValue, Input2 as Input, InvestmentCrossChainProcessingView, Label, Link, ListItem, ListItemContent, ListItemLeftSide, ListItemRightSide, LoadingDots, LowRiskBadge, MediumRiskBadge, Navbar, PercentageButton, PrimaryButton, ProcessingBadge, ProgressIndicator, ScrollableContent, SearchEmptyState, SearchInput, SecondaryButton, SectionCard, Select, SelectContent, SelectItem, SelectTrigger, Skeleton, StepDisplay, StepStatusIcon, StepStatusText, StrategyDetailsView, StrategyGridCard, SummaryDetails, SummaryDetailsCryptoControlV2, SwapAdvancedSettingsView, SwapAmountInputView, SwapCrossChainProcessingView, SwapFormView, SwapFormViewSimple, SwapFromCardView, SwapFromCardViewSimple, SwapHistoryView, SwapProcessingView, SwapProcessingViewSimple, SwapQuoteDetailsView, SwapSignatureWarningView, SwapSignatureWarningViewSimple, SwapSuccessView, SwapSuccessViewSimple, SwapToCardView, SwapToCardViewSimple, SwapTransactionFailedView, SwapTransactionFailedViewSimple, SwapWidgetFallbackView, Tabs, TabsContent, TabsList, TabsTrigger, TertiaryButton, Text_default as Text, TextAccent, TextBody, TextHeading, Title, TokenWithChainBadge, TransactionProcessingDetails, TransactionScreen, TransactionScreenIcon, TransactionScreenInvestmentCard, WalletBalances, WalletConnectPanel, WalletItem, ConnectWalletList as WalletList, WalletListContainer, isDustValue };
12066
12117
  //# sourceMappingURL=index.mjs.map
12067
12118
  //# sourceMappingURL=index.mjs.map