@b3dotfun/sdk 0.0.40-alpha.1 → 0.0.40-alpha.11

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.
Files changed (121) hide show
  1. package/dist/cjs/anyspend/react/components/AnySpend.d.ts +2 -1
  2. package/dist/cjs/anyspend/react/components/AnySpend.js +6 -2
  3. package/dist/cjs/anyspend/react/components/AnyspendDepositHype.js +5 -2
  4. package/dist/cjs/anyspend/react/components/common/CryptoReceiveSection.d.ts +2 -1
  5. package/dist/cjs/anyspend/react/components/common/CryptoReceiveSection.js +39 -37
  6. package/dist/cjs/anyspend/react/components/common/OrderDetails.js +1 -4
  7. package/dist/cjs/anyspend/react/components/common/PanelOnramp.d.ts +4 -1
  8. package/dist/cjs/anyspend/react/components/common/PanelOnramp.js +7 -6
  9. package/dist/cjs/anyspend/react/components/common/PointsDetailPanel.d.ts +6 -0
  10. package/dist/cjs/anyspend/react/components/common/PointsDetailPanel.js +14 -0
  11. package/dist/cjs/anyspend/react/contexts/FeatureFlagsContext.d.ts +11 -0
  12. package/dist/cjs/anyspend/react/contexts/FeatureFlagsContext.js +21 -0
  13. package/dist/cjs/anyspend/react/hooks/useAnyspendFlow.d.ts +4 -1
  14. package/dist/cjs/anyspend/react/hooks/useAnyspendFlow.js +13 -5
  15. package/dist/cjs/anyspend/react/providers/AnyspendProvider.d.ts +5 -2
  16. package/dist/cjs/anyspend/react/providers/AnyspendProvider.js +5 -3
  17. package/dist/cjs/anyspend/react/providers/index.d.ts +1 -0
  18. package/dist/cjs/anyspend/react/providers/index.js +3 -0
  19. package/dist/cjs/anyspend/types/api.d.ts +10 -0
  20. package/dist/cjs/bondkit/bondkitToken.d.ts +37 -2
  21. package/dist/cjs/bondkit/bondkitToken.js +268 -2
  22. package/dist/cjs/bondkit/bondkitTokenFactory.d.ts +1 -1
  23. package/dist/cjs/bondkit/bondkitTokenFactory.js +2 -2
  24. package/dist/cjs/bondkit/config.d.ts +1 -1
  25. package/dist/cjs/bondkit/config.js +5 -2
  26. package/dist/cjs/bondkit/constants.d.ts +4 -0
  27. package/dist/cjs/bondkit/constants.js +6 -1
  28. package/dist/cjs/bondkit/index.d.ts +1 -0
  29. package/dist/cjs/bondkit/index.js +4 -1
  30. package/dist/cjs/bondkit/swapService.d.ts +43 -0
  31. package/dist/cjs/bondkit/swapService.js +373 -0
  32. package/dist/cjs/bondkit/types.d.ts +10 -4
  33. package/dist/cjs/bondkit/types.js +4 -5
  34. package/dist/cjs/global-account/react/components/B3Provider/B3Provider.d.ts +4 -3
  35. package/dist/cjs/global-account/react/components/B3Provider/B3Provider.js +35 -9
  36. package/dist/cjs/global-account/react/components/LinkAccount/LinkAccount.js +63 -3
  37. package/dist/cjs/global-account/react/components/ManageAccount/ManageAccount.js +35 -2
  38. package/dist/cjs/global-account/react/components/SignInWithB3/steps/LoginStepCustom.js +4 -3
  39. package/dist/cjs/global-account/react/hooks/useAuthentication.js +1 -2
  40. package/dist/esm/anyspend/react/components/AnySpend.d.ts +2 -1
  41. package/dist/esm/anyspend/react/components/AnySpend.js +6 -2
  42. package/dist/esm/anyspend/react/components/AnyspendDepositHype.js +5 -2
  43. package/dist/esm/anyspend/react/components/common/CryptoReceiveSection.d.ts +2 -1
  44. package/dist/esm/anyspend/react/components/common/CryptoReceiveSection.js +39 -37
  45. package/dist/esm/anyspend/react/components/common/OrderDetails.js +1 -4
  46. package/dist/esm/anyspend/react/components/common/PanelOnramp.d.ts +4 -1
  47. package/dist/esm/anyspend/react/components/common/PanelOnramp.js +7 -6
  48. package/dist/esm/anyspend/react/components/common/PointsDetailPanel.d.ts +6 -0
  49. package/dist/esm/anyspend/react/components/common/PointsDetailPanel.js +8 -0
  50. package/dist/esm/anyspend/react/contexts/FeatureFlagsContext.d.ts +11 -0
  51. package/dist/esm/anyspend/react/contexts/FeatureFlagsContext.js +17 -0
  52. package/dist/esm/anyspend/react/hooks/useAnyspendFlow.d.ts +4 -1
  53. package/dist/esm/anyspend/react/hooks/useAnyspendFlow.js +13 -5
  54. package/dist/esm/anyspend/react/providers/AnyspendProvider.d.ts +5 -2
  55. package/dist/esm/anyspend/react/providers/AnyspendProvider.js +5 -3
  56. package/dist/esm/anyspend/react/providers/index.d.ts +1 -0
  57. package/dist/esm/anyspend/react/providers/index.js +1 -0
  58. package/dist/esm/anyspend/types/api.d.ts +10 -0
  59. package/dist/esm/bondkit/bondkitToken.d.ts +37 -2
  60. package/dist/esm/bondkit/bondkitToken.js +268 -2
  61. package/dist/esm/bondkit/bondkitTokenFactory.d.ts +1 -1
  62. package/dist/esm/bondkit/bondkitTokenFactory.js +2 -2
  63. package/dist/esm/bondkit/config.d.ts +1 -1
  64. package/dist/esm/bondkit/config.js +5 -2
  65. package/dist/esm/bondkit/constants.d.ts +4 -0
  66. package/dist/esm/bondkit/constants.js +5 -0
  67. package/dist/esm/bondkit/index.d.ts +1 -0
  68. package/dist/esm/bondkit/index.js +2 -0
  69. package/dist/esm/bondkit/swapService.d.ts +43 -0
  70. package/dist/esm/bondkit/swapService.js +369 -0
  71. package/dist/esm/bondkit/types.d.ts +10 -4
  72. package/dist/esm/bondkit/types.js +4 -5
  73. package/dist/esm/global-account/react/components/B3Provider/B3Provider.d.ts +4 -3
  74. package/dist/esm/global-account/react/components/B3Provider/B3Provider.js +36 -9
  75. package/dist/esm/global-account/react/components/LinkAccount/LinkAccount.js +65 -5
  76. package/dist/esm/global-account/react/components/ManageAccount/ManageAccount.js +35 -2
  77. package/dist/esm/global-account/react/components/SignInWithB3/steps/LoginStepCustom.js +3 -2
  78. package/dist/esm/global-account/react/hooks/useAuthentication.js +1 -2
  79. package/dist/styles/index.css +1 -1
  80. package/dist/types/anyspend/react/components/AnySpend.d.ts +2 -1
  81. package/dist/types/anyspend/react/components/common/CryptoReceiveSection.d.ts +2 -1
  82. package/dist/types/anyspend/react/components/common/PanelOnramp.d.ts +4 -1
  83. package/dist/types/anyspend/react/components/common/PointsDetailPanel.d.ts +6 -0
  84. package/dist/types/anyspend/react/contexts/FeatureFlagsContext.d.ts +11 -0
  85. package/dist/types/anyspend/react/hooks/useAnyspendFlow.d.ts +4 -1
  86. package/dist/types/anyspend/react/providers/AnyspendProvider.d.ts +5 -2
  87. package/dist/types/anyspend/react/providers/index.d.ts +1 -0
  88. package/dist/types/anyspend/types/api.d.ts +10 -0
  89. package/dist/types/bondkit/bondkitToken.d.ts +37 -2
  90. package/dist/types/bondkit/bondkitTokenFactory.d.ts +1 -1
  91. package/dist/types/bondkit/config.d.ts +1 -1
  92. package/dist/types/bondkit/constants.d.ts +4 -0
  93. package/dist/types/bondkit/index.d.ts +1 -0
  94. package/dist/types/bondkit/swapService.d.ts +43 -0
  95. package/dist/types/bondkit/types.d.ts +10 -4
  96. package/dist/types/global-account/react/components/B3Provider/B3Provider.d.ts +4 -3
  97. package/package.json +6 -5
  98. package/src/anyspend/react/components/AnySpend.tsx +15 -0
  99. package/src/anyspend/react/components/AnyspendDepositHype.tsx +14 -0
  100. package/src/anyspend/react/components/common/CryptoReceiveSection.tsx +63 -45
  101. package/src/anyspend/react/components/common/OrderDetails.tsx +2 -5
  102. package/src/anyspend/react/components/common/PanelOnramp.tsx +28 -15
  103. package/src/anyspend/react/components/common/PointsDetailPanel.tsx +55 -0
  104. package/src/anyspend/react/contexts/FeatureFlagsContext.tsx +34 -0
  105. package/src/anyspend/react/hooks/useAnyspendFlow.ts +13 -5
  106. package/src/anyspend/react/providers/AnyspendProvider.tsx +11 -6
  107. package/src/anyspend/react/providers/index.ts +1 -0
  108. package/src/anyspend/types/api.ts +10 -0
  109. package/src/anyspend/types/api_req_res.ts +6 -10
  110. package/src/bondkit/bondkitToken.ts +323 -3
  111. package/src/bondkit/bondkitTokenFactory.ts +2 -2
  112. package/src/bondkit/config.ts +5 -2
  113. package/src/bondkit/constants.ts +7 -0
  114. package/src/bondkit/index.ts +3 -0
  115. package/src/bondkit/swapService.ts +461 -0
  116. package/src/bondkit/types.ts +12 -5
  117. package/src/global-account/react/components/B3Provider/B3Provider.tsx +51 -15
  118. package/src/global-account/react/components/LinkAccount/LinkAccount.tsx +106 -32
  119. package/src/global-account/react/components/ManageAccount/ManageAccount.tsx +60 -5
  120. package/src/global-account/react/components/SignInWithB3/steps/LoginStepCustom.tsx +4 -2
  121. package/src/global-account/react/hooks/useAuthentication.ts +1 -2
@@ -12,7 +12,8 @@ export declare enum PanelView {
12
12
  FIAT_PAYMENT = 4,
13
13
  RECIPIENT_SELECTION = 5,
14
14
  CRYPTO_PAYMENT_METHOD = 6,
15
- FIAT_PAYMENT_METHOD = 7
15
+ FIAT_PAYMENT_METHOD = 7,
16
+ POINTS_DETAIL = 8
16
17
  }
17
18
  export declare function AnySpend(props: {
18
19
  mode?: "page" | "modal";
@@ -29,6 +29,7 @@ const OrderDetails_1 = require("./common/OrderDetails");
29
29
  const OrderHistory_1 = require("./common/OrderHistory");
30
30
  const PanelOnramp_1 = require("./common/PanelOnramp");
31
31
  const PanelOnrampPayment_1 = require("./common/PanelOnrampPayment");
32
+ const PointsDetailPanel_1 = require("./common/PointsDetailPanel");
32
33
  const RecipientSelection_1 = require("./common/RecipientSelection");
33
34
  const TabSection_1 = require("./common/TabSection");
34
35
  var PanelView;
@@ -41,6 +42,7 @@ var PanelView;
41
42
  PanelView[PanelView["RECIPIENT_SELECTION"] = 5] = "RECIPIENT_SELECTION";
42
43
  PanelView[PanelView["CRYPTO_PAYMENT_METHOD"] = 6] = "CRYPTO_PAYMENT_METHOD";
43
44
  PanelView[PanelView["FIAT_PAYMENT_METHOD"] = 7] = "FIAT_PAYMENT_METHOD";
45
+ PanelView[PanelView["POINTS_DETAIL"] = 8] = "POINTS_DETAIL";
44
46
  })(PanelView || (exports.PanelView = PanelView = {}));
45
47
  const ANYSPEND_RECIPIENTS_KEY = "anyspend_recipients";
46
48
  function AnySpend(props) {
@@ -663,7 +665,7 @@ function AnySpendInner({ destinationTokenAddress, destinationTokenChainId, mode
663
665
  setActivePanel(PanelView.MAIN);
664
666
  setSelectedCryptoPaymentMethod(CryptoPaymentMethod_1.CryptoPaymentMethodType.NONE); // Reset payment method when going back
665
667
  } })) }) }));
666
- const mainView = ((0, jsx_runtime_1.jsxs)("div", { className: "mx-auto flex w-[460px] max-w-full flex-col items-center gap-2", children: [isBuyMode && ((0, jsx_runtime_1.jsxs)("div", { className: "mb-4 flex flex-col items-center gap-3 text-center", children: [selectedDstToken.metadata?.logoURI && ((0, jsx_runtime_1.jsx)("div", { className: "relative", children: (0, jsx_runtime_1.jsx)("img", { src: selectedDstToken.metadata.logoURI, alt: selectedDstToken.symbol, className: "border-as-stroke h-12 w-12 rounded-full border-2 shadow-md" }) })), (0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsxs)("h1", { className: "text-as-primary text-xl font-bold", children: ["Buy ", selectedDstToken.symbol] }) })] })), (0, jsx_runtime_1.jsx)(TabSection_1.TabSection, { activeTab: activeTab, setActiveTab: setActiveTab, setSelectedCryptoPaymentMethod: setSelectedCryptoPaymentMethod, setSelectedFiatPaymentMethod: setSelectedFiatPaymentMethod }), (0, jsx_runtime_1.jsxs)("div", { className: "relative flex w-full max-w-[calc(100vw-32px)] flex-col gap-2", children: [activeTab === "crypto" ? ((0, jsx_runtime_1.jsx)(CryptoPaySection_1.CryptoPaySection, { selectedSrcChainId: selectedSrcChainId, setSelectedSrcChainId: setSelectedSrcChainId, selectedSrcToken: selectedSrcToken, setSelectedSrcToken: setSelectedSrcToken, srcAmount: srcAmount, setSrcAmount: setSrcAmount, setIsSrcInputDirty: setIsSrcInputDirty, selectedCryptoPaymentMethod: selectedCryptoPaymentMethod, onSelectCryptoPaymentMethod: () => setActivePanel(PanelView.CRYPTO_PAYMENT_METHOD), anyspendQuote: anyspendQuote })) : ((0, jsx_runtime_1.jsx)(react_3.motion.div, { initial: { opacity: 0, y: 20, filter: "blur(10px)" }, animate: { opacity: 1, y: 0, filter: "blur(0px)" }, transition: { duration: 0.3, delay: 0, ease: "easeInOut" }, children: (0, jsx_runtime_1.jsx)(PanelOnramp_1.PanelOnramp, { srcAmountOnRamp: srcAmountOnRamp, setSrcAmountOnRamp: setSrcAmountOnRamp, selectedPaymentMethod: selectedFiatPaymentMethod, setActivePanel: setActivePanel, _recipientAddress: recipientAddress, destinationToken: selectedDstToken, destinationChainId: selectedDstChainId, destinationAmount: dstAmount, onDestinationTokenChange: setSelectedDstToken, onDestinationChainChange: setSelectedDstChainId, fiatPaymentMethodIndex: PanelView.FIAT_PAYMENT_METHOD, recipientSelectionPanelIndex: PanelView.RECIPIENT_SELECTION, hideDstToken: isBuyMode }) })), (0, jsx_runtime_1.jsx)(react_2.Button, { variant: "ghost", className: (0, cn_1.cn)("border-as-stroke bg-as-surface-primary absolute left-1/2 top-1/2 z-10 h-10 w-10 -translate-x-1/2 -translate-y-1/2 rounded-xl border-2 sm:h-8 sm:w-8 sm:rounded-xl", isBuyMode && "top-[calc(50%+56px)] cursor-default", activeTab === "fiat" && "hidden"), onClick: () => {
668
+ const mainView = ((0, jsx_runtime_1.jsxs)("div", { className: "mx-auto flex w-[460px] max-w-full flex-col items-center gap-2", children: [isBuyMode && ((0, jsx_runtime_1.jsxs)("div", { className: "mb-4 flex flex-col items-center gap-3 text-center", children: [selectedDstToken.metadata?.logoURI && ((0, jsx_runtime_1.jsx)("div", { className: "relative", children: (0, jsx_runtime_1.jsx)("img", { src: selectedDstToken.metadata.logoURI, alt: selectedDstToken.symbol, className: "border-as-stroke h-12 w-12 rounded-full border-2 shadow-md" }) })), (0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsxs)("h1", { className: "text-as-primary text-xl font-bold", children: ["Buy ", selectedDstToken.symbol] }) })] })), (0, jsx_runtime_1.jsx)(TabSection_1.TabSection, { activeTab: activeTab, setActiveTab: setActiveTab, setSelectedCryptoPaymentMethod: setSelectedCryptoPaymentMethod, setSelectedFiatPaymentMethod: setSelectedFiatPaymentMethod }), (0, jsx_runtime_1.jsxs)("div", { className: "relative flex w-full max-w-[calc(100vw-32px)] flex-col gap-2", children: [activeTab === "crypto" ? ((0, jsx_runtime_1.jsx)(CryptoPaySection_1.CryptoPaySection, { selectedSrcChainId: selectedSrcChainId, setSelectedSrcChainId: setSelectedSrcChainId, selectedSrcToken: selectedSrcToken, setSelectedSrcToken: setSelectedSrcToken, srcAmount: srcAmount, setSrcAmount: setSrcAmount, setIsSrcInputDirty: setIsSrcInputDirty, selectedCryptoPaymentMethod: selectedCryptoPaymentMethod, onSelectCryptoPaymentMethod: () => setActivePanel(PanelView.CRYPTO_PAYMENT_METHOD), anyspendQuote: anyspendQuote })) : ((0, jsx_runtime_1.jsx)(react_3.motion.div, { initial: { opacity: 0, y: 20, filter: "blur(10px)" }, animate: { opacity: 1, y: 0, filter: "blur(0px)" }, transition: { duration: 0.3, delay: 0, ease: "easeInOut" }, children: (0, jsx_runtime_1.jsx)(PanelOnramp_1.PanelOnramp, { srcAmountOnRamp: srcAmountOnRamp, setSrcAmountOnRamp: setSrcAmountOnRamp, selectedPaymentMethod: selectedFiatPaymentMethod, setActivePanel: setActivePanel, _recipientAddress: recipientAddress, destinationToken: selectedDstToken, destinationChainId: selectedDstChainId, destinationAmount: dstAmount, onDestinationTokenChange: setSelectedDstToken, onDestinationChainChange: setSelectedDstChainId, fiatPaymentMethodIndex: PanelView.FIAT_PAYMENT_METHOD, recipientSelectionPanelIndex: PanelView.RECIPIENT_SELECTION, hideDstToken: isBuyMode, anyspendQuote: anyspendQuote, onShowPointsDetail: () => setActivePanel(PanelView.POINTS_DETAIL) }) })), (0, jsx_runtime_1.jsx)(react_2.Button, { variant: "ghost", className: (0, cn_1.cn)("border-as-stroke bg-as-surface-primary absolute left-1/2 top-1/2 z-10 h-10 w-10 -translate-x-1/2 -translate-y-1/2 rounded-xl border-2 sm:h-8 sm:w-8 sm:rounded-xl", isBuyMode && "top-[calc(50%+56px)] cursor-default", activeTab === "fiat" && "hidden"), onClick: () => {
667
669
  if (activeTab === "fiat" || isBuyMode) {
668
670
  return;
669
671
  }
@@ -685,7 +687,7 @@ function AnySpendInner({ destinationTokenAddress, destinationTokenChainId, mode
685
687
  }, children: (0, jsx_runtime_1.jsx)("div", { className: "relative flex items-center justify-center transition-opacity", children: (0, jsx_runtime_1.jsx)(lucide_react_1.ArrowDown, { className: "text-as-primary/50 h-5 w-5" }) }) }), activeTab === "crypto" && ((0, jsx_runtime_1.jsx)(CryptoReceiveSection_1.CryptoReceiveSection, { isDepositMode: false, isBuyMode: isBuyMode, selectedRecipientAddress: recipientAddress, recipientName: recipientName || undefined, onSelectRecipient: () => setActivePanel(PanelView.RECIPIENT_SELECTION), dstAmount: dstAmount, dstToken: selectedDstToken, selectedDstChainId: selectedDstChainId, setSelectedDstChainId: setSelectedDstChainId, setSelectedDstToken: setSelectedDstToken, onChangeDstAmount: value => {
686
688
  setIsSrcInputDirty(false);
687
689
  setDstAmount(value);
688
- }, anyspendQuote: anyspendQuote }))] }), (0, jsx_runtime_1.jsx)(ErrorSection_1.ErrorSection, { error: getAnyspendQuoteError }), (0, jsx_runtime_1.jsxs)(react_3.motion.div, { initial: { opacity: 0, y: 20, filter: "blur(10px)" }, animate: { opacity: 1, y: 0, filter: "blur(0px)" }, transition: { duration: 0.3, delay: 0.2, ease: "easeInOut" }, className: (0, cn_1.cn)("mt-4 flex w-full max-w-[460px] flex-col gap-2", getAnyspendQuoteError && "mt-0"), children: [(0, jsx_runtime_1.jsx)(react_2.ShinyButton, { accentColor: "hsl(var(--as-brand))", disabled: btnInfo.disable, onClick: onMainButtonClick, className: (0, cn_1.cn)("as-main-button relative w-full", btnInfo.error ? "!bg-as-red" : btnInfo.disable ? "!bg-as-on-surface-2" : "!bg-as-brand"), textClassName: (0, cn_1.cn)(btnInfo.error ? "text-white" : btnInfo.disable ? "text-as-secondary" : "text-white"), children: btnInfo.text }), !hideTransactionHistoryButton && (globalAddress || recipientAddress) ? ((0, jsx_runtime_1.jsxs)(react_2.Button, { variant: "link", onClick: onClickHistory, className: "text-as-primary/50 hover:text-as-primary flex items-center gap-1 transition-colors", children: [(0, jsx_runtime_1.jsx)(lucide_react_1.HistoryIcon, { className: "h-4 w-4" }), " ", (0, jsx_runtime_1.jsx)("span", { className: "pr-4", children: "Transaction History" })] })) : null] })] }));
690
+ }, anyspendQuote: anyspendQuote, onShowPointsDetail: () => setActivePanel(PanelView.POINTS_DETAIL) }))] }), (0, jsx_runtime_1.jsx)(ErrorSection_1.ErrorSection, { error: getAnyspendQuoteError }), (0, jsx_runtime_1.jsxs)(react_3.motion.div, { initial: { opacity: 0, y: 20, filter: "blur(10px)" }, animate: { opacity: 1, y: 0, filter: "blur(0px)" }, transition: { duration: 0.3, delay: 0.2, ease: "easeInOut" }, className: (0, cn_1.cn)("mt-4 flex w-full max-w-[460px] flex-col gap-2", getAnyspendQuoteError && "mt-0"), children: [(0, jsx_runtime_1.jsx)(react_2.ShinyButton, { accentColor: "hsl(var(--as-brand))", disabled: btnInfo.disable, onClick: onMainButtonClick, className: (0, cn_1.cn)("as-main-button relative w-full", btnInfo.error ? "!bg-as-red" : btnInfo.disable ? "!bg-as-on-surface-2" : "!bg-as-brand"), textClassName: (0, cn_1.cn)(btnInfo.error ? "text-white" : btnInfo.disable ? "text-as-secondary" : "text-white"), children: btnInfo.text }), !hideTransactionHistoryButton && (globalAddress || recipientAddress) ? ((0, jsx_runtime_1.jsxs)(react_2.Button, { variant: "link", onClick: onClickHistory, className: "text-as-primary/50 hover:text-as-primary flex items-center gap-1 transition-colors", children: [(0, jsx_runtime_1.jsx)(lucide_react_1.HistoryIcon, { className: "h-4 w-4" }), " ", (0, jsx_runtime_1.jsx)("span", { className: "pr-4", children: "Transaction History" })] })) : null] })] }));
689
691
  const onrampPaymentView = ((0, jsx_runtime_1.jsx)(PanelOnrampPayment_1.PanelOnrampPayment, { srcAmountOnRamp: srcAmountOnRamp, recipientName: recipientName || undefined, recipientAddress: recipientAddress, isBuyMode: isBuyMode, destinationTokenChainId: destinationTokenChainId, destinationTokenAddress: destinationTokenAddress, selectedDstChainId: selectedDstChainId, selectedDstToken: selectedDstToken, orderType: "swap", anyspendQuote: anyspendQuote, globalAddress: globalAddress, onOrderCreated: orderId => {
690
692
  setOrderId(orderId);
691
693
  setActivePanel(PanelView.ORDER_DETAILS);
@@ -713,6 +715,7 @@ function AnySpendInner({ destinationTokenAddress, destinationTokenChainId, mode
713
715
  setSelectedFiatPaymentMethod(method);
714
716
  setActivePanel(PanelView.MAIN); // Go back to main panel to show updated pricing
715
717
  }, srcAmountOnRamp: srcAmountOnRamp }));
718
+ const pointsDetailView = ((0, jsx_runtime_1.jsx)(PointsDetailPanel_1.PointsDetailPanel, { pointsAmount: anyspendQuote?.data?.pointsAmount || 0, onBack: () => setActivePanel(PanelView.MAIN) }));
716
719
  // Add tabs to the main component when no order is loaded
717
720
  return ((0, jsx_runtime_1.jsx)(react_2.StyleRoot, { children: (0, jsx_runtime_1.jsx)("div", { className: (0, cn_1.cn)("anyspend-container font-inter mx-auto w-full max-w-[460px]", mode === "page" &&
718
721
  "bg-as-surface-primary border-as-border-secondary overflow-hidden rounded-2xl border shadow-xl"), children: (0, jsx_runtime_1.jsx)(react_2.TransitionPanel, { activeIndex: orderId
@@ -736,5 +739,6 @@ function AnySpendInner({ destinationTokenAddress, destinationTokenChainId, mode
736
739
  (0, jsx_runtime_1.jsx)("div", { className: (0, cn_1.cn)(mode === "page" && "p-6"), children: recipientSelectionView }, "recipient-selection-view"),
737
740
  (0, jsx_runtime_1.jsx)("div", { className: (0, cn_1.cn)(mode === "page" && "p-6"), children: cryptoPaymentMethodView }, "crypto-payment-method-view"),
738
741
  (0, jsx_runtime_1.jsx)("div", { className: (0, cn_1.cn)(mode === "page" && "p-6"), children: fiatPaymentMethodView }, "fiat-payment-method-view"),
742
+ (0, jsx_runtime_1.jsx)("div", { className: (0, cn_1.cn)(mode === "page" && "p-6"), children: pointsDetailView }, "points-detail-view"),
739
743
  ] }) }) }));
740
744
  }
@@ -22,6 +22,7 @@ const CryptoReceiveSection_1 = require("./common/CryptoReceiveSection");
22
22
  const ErrorSection_1 = require("./common/ErrorSection");
23
23
  const FiatPaymentMethod_1 = require("./common/FiatPaymentMethod");
24
24
  const OrderDetails_1 = require("./common/OrderDetails");
25
+ const PointsDetailPanel_1 = require("./common/PointsDetailPanel");
25
26
  const RecipientSelection_1 = require("./common/RecipientSelection");
26
27
  const lucide_react_1 = require("lucide-react");
27
28
  const PanelOnramp_1 = require("./common/PanelOnramp");
@@ -118,10 +119,10 @@ function AnySpendDepositHypeInner({ loadOrder, mode = "modal", recipientAddress,
118
119
  await handleFiatOrder();
119
120
  }
120
121
  };
121
- const mainView = ((0, jsx_runtime_1.jsxs)("div", { className: "mx-auto flex w-[460px] max-w-full flex-col items-center gap-2", children: [(0, jsx_runtime_1.jsx)("div", { className: "mb-4 flex flex-col items-center gap-3 text-center", children: (0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)("h1", { className: "text-as-primary text-xl font-bold", children: paymentType === "crypto" ? "Deposit Crypto" : "Fund with Fiat" }) }) }), (0, jsx_runtime_1.jsx)("div", { className: "relative flex w-full max-w-[calc(100vw-32px)] flex-col gap-2", children: (0, jsx_runtime_1.jsxs)("div", { className: "relative flex w-full max-w-[calc(100vw-32px)] flex-col gap-2", children: [paymentType === "crypto" ? ((0, jsx_runtime_1.jsx)(CryptoPaySection_1.CryptoPaySection, { selectedSrcChainId: selectedSrcChainId, setSelectedSrcChainId: setSelectedSrcChainId, selectedSrcToken: selectedSrcToken, setSelectedSrcToken: setSelectedSrcToken, srcAmount: srcAmount, setSrcAmount: setSrcAmount, setIsSrcInputDirty: setIsSrcInputDirty, selectedCryptoPaymentMethod: selectedCryptoPaymentMethod, onSelectCryptoPaymentMethod: () => setActivePanel(useAnyspendFlow_1.PanelView.CRYPTO_PAYMENT_METHOD), anyspendQuote: anyspendQuote })) : ((0, jsx_runtime_1.jsx)(react_2.motion.div, { initial: { opacity: 0, y: 20, filter: "blur(10px)" }, animate: { opacity: 1, y: 0, filter: "blur(0px)" }, transition: { duration: 0.3, delay: 0, ease: "easeInOut" }, children: (0, jsx_runtime_1.jsx)(PanelOnramp_1.PanelOnramp, { srcAmountOnRamp: srcAmount, setSrcAmountOnRamp: setSrcAmount, selectedPaymentMethod: selectedFiatPaymentMethod, setActivePanel: setActivePanel, _recipientAddress: recipientAddress, destinationToken: anyspend_1.B3_TOKEN, destinationChainId: chains_1.base.id, dstTokenSymbol: exports.HYPE_TOKEN_DETAILS.SYMBOL, hideDstToken: true, destinationAmount: dstAmount, onDestinationTokenChange: () => { }, onDestinationChainChange: () => { }, fiatPaymentMethodIndex: useAnyspendFlow_1.PanelView.FIAT_PAYMENT_METHOD, recipientSelectionPanelIndex: useAnyspendFlow_1.PanelView.RECIPIENT_SELECTION }) })), (0, jsx_runtime_1.jsx)("div", { className: (0, cn_1.cn)("relative -my-1 flex h-0 items-center justify-center", paymentType === "fiat" && "hidden"), children: (0, jsx_runtime_1.jsx)(react_1.Button, { variant: "ghost", className: (0, cn_1.cn)("swap-direction-button border-as-stroke bg-as-surface-primary z-10 h-10 w-10 cursor-default rounded-xl border-2 sm:h-8 sm:w-8 sm:rounded-xl"), children: (0, jsx_runtime_1.jsx)("div", { className: "relative flex items-center justify-center transition-opacity", children: (0, jsx_runtime_1.jsx)(lucide_react_1.ArrowDown, { className: "text-as-primary/50 h-5 w-5" }) }) }) }), paymentType === "crypto" && ((0, jsx_runtime_1.jsx)(CryptoReceiveSection_1.CryptoReceiveSection, { isDepositMode: false, isBuyMode: true, selectedRecipientAddress: recipientAddress, recipientName: recipientName || undefined, onSelectRecipient: () => setActivePanel(useAnyspendFlow_1.PanelView.RECIPIENT_SELECTION), dstAmount: dstAmount, dstToken: anyspend_1.B3_TOKEN, dstTokenSymbol: exports.HYPE_TOKEN_DETAILS.SYMBOL, dstTokenLogoURI: exports.HYPE_TOKEN_DETAILS.LOGO_URI, selectedDstChainId: chains_1.base.id, setSelectedDstChainId: () => { }, setSelectedDstToken: () => { }, onChangeDstAmount: value => {
122
+ const mainView = ((0, jsx_runtime_1.jsxs)("div", { className: "mx-auto flex w-[460px] max-w-full flex-col items-center gap-2", children: [(0, jsx_runtime_1.jsx)("div", { className: "mb-4 flex flex-col items-center gap-3 text-center", children: (0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)("h1", { className: "text-as-primary text-xl font-bold", children: paymentType === "crypto" ? "Deposit Crypto" : "Fund with Fiat" }) }) }), (0, jsx_runtime_1.jsx)("div", { className: "relative flex w-full max-w-[calc(100vw-32px)] flex-col gap-2", children: (0, jsx_runtime_1.jsxs)("div", { className: "relative flex w-full max-w-[calc(100vw-32px)] flex-col gap-2", children: [paymentType === "crypto" ? ((0, jsx_runtime_1.jsx)(CryptoPaySection_1.CryptoPaySection, { selectedSrcChainId: selectedSrcChainId, setSelectedSrcChainId: setSelectedSrcChainId, selectedSrcToken: selectedSrcToken, setSelectedSrcToken: setSelectedSrcToken, srcAmount: srcAmount, setSrcAmount: setSrcAmount, setIsSrcInputDirty: setIsSrcInputDirty, selectedCryptoPaymentMethod: selectedCryptoPaymentMethod, onSelectCryptoPaymentMethod: () => setActivePanel(useAnyspendFlow_1.PanelView.CRYPTO_PAYMENT_METHOD), anyspendQuote: anyspendQuote })) : ((0, jsx_runtime_1.jsx)(react_2.motion.div, { initial: { opacity: 0, y: 20, filter: "blur(10px)" }, animate: { opacity: 1, y: 0, filter: "blur(0px)" }, transition: { duration: 0.3, delay: 0, ease: "easeInOut" }, children: (0, jsx_runtime_1.jsx)(PanelOnramp_1.PanelOnramp, { srcAmountOnRamp: srcAmount, setSrcAmountOnRamp: setSrcAmount, selectedPaymentMethod: selectedFiatPaymentMethod, setActivePanel: setActivePanel, _recipientAddress: recipientAddress, destinationToken: anyspend_1.B3_TOKEN, destinationChainId: chains_1.base.id, dstTokenSymbol: exports.HYPE_TOKEN_DETAILS.SYMBOL, hideDstToken: true, destinationAmount: dstAmount, onDestinationTokenChange: () => { }, onDestinationChainChange: () => { }, fiatPaymentMethodIndex: useAnyspendFlow_1.PanelView.FIAT_PAYMENT_METHOD, recipientSelectionPanelIndex: useAnyspendFlow_1.PanelView.RECIPIENT_SELECTION, anyspendQuote: anyspendQuote, onShowPointsDetail: () => setActivePanel(useAnyspendFlow_1.PanelView.POINTS_DETAIL) }) })), (0, jsx_runtime_1.jsx)("div", { className: (0, cn_1.cn)("relative -my-1 flex h-0 items-center justify-center", paymentType === "fiat" && "hidden"), children: (0, jsx_runtime_1.jsx)(react_1.Button, { variant: "ghost", className: (0, cn_1.cn)("swap-direction-button border-as-stroke bg-as-surface-primary z-10 h-10 w-10 cursor-default rounded-xl border-2 sm:h-8 sm:w-8 sm:rounded-xl"), children: (0, jsx_runtime_1.jsx)("div", { className: "relative flex items-center justify-center transition-opacity", children: (0, jsx_runtime_1.jsx)(lucide_react_1.ArrowDown, { className: "text-as-primary/50 h-5 w-5" }) }) }) }), paymentType === "crypto" && ((0, jsx_runtime_1.jsx)(CryptoReceiveSection_1.CryptoReceiveSection, { isDepositMode: false, isBuyMode: true, selectedRecipientAddress: recipientAddress, recipientName: recipientName || undefined, onSelectRecipient: () => setActivePanel(useAnyspendFlow_1.PanelView.RECIPIENT_SELECTION), dstAmount: dstAmount, dstToken: anyspend_1.B3_TOKEN, dstTokenSymbol: exports.HYPE_TOKEN_DETAILS.SYMBOL, dstTokenLogoURI: exports.HYPE_TOKEN_DETAILS.LOGO_URI, selectedDstChainId: chains_1.base.id, setSelectedDstChainId: () => { }, setSelectedDstToken: () => { }, onChangeDstAmount: value => {
122
123
  setIsSrcInputDirty(false);
123
124
  setSrcAmount(value);
124
- }, anyspendQuote: anyspendQuote }))] }) }), (0, jsx_runtime_1.jsx)(ErrorSection_1.ErrorSection, { error: getAnyspendQuoteError }), (0, jsx_runtime_1.jsx)(react_2.motion.div, { initial: { opacity: 0, y: 20, filter: "blur(10px)" }, animate: { opacity: 1, y: 0, filter: "blur(0px)" }, transition: { duration: 0.3, delay: 0.2, ease: "easeInOut" }, className: (0, cn_1.cn)("mt-4 flex w-full max-w-[460px] flex-col gap-2", getAnyspendQuoteError && "mt-0"), children: (0, jsx_runtime_1.jsx)(react_1.ShinyButton, { accentColor: "hsl(var(--as-brand))", disabled: btnInfo.disable, onClick: onMainButtonClick, className: (0, cn_1.cn)("as-main-button relative w-full", btnInfo.error ? "!bg-as-red" : btnInfo.disable ? "!bg-as-on-surface-2" : "!bg-as-brand"), textClassName: (0, cn_1.cn)(btnInfo.error ? "text-white" : btnInfo.disable ? "text-as-secondary" : "text-white"), children: btnInfo.text }) }), mainFooter ? mainFooter : null] }));
125
+ }, anyspendQuote: anyspendQuote, onShowPointsDetail: () => setActivePanel(useAnyspendFlow_1.PanelView.POINTS_DETAIL) }))] }) }), (0, jsx_runtime_1.jsx)(ErrorSection_1.ErrorSection, { error: getAnyspendQuoteError }), (0, jsx_runtime_1.jsx)(react_2.motion.div, { initial: { opacity: 0, y: 20, filter: "blur(10px)" }, animate: { opacity: 1, y: 0, filter: "blur(0px)" }, transition: { duration: 0.3, delay: 0.2, ease: "easeInOut" }, className: (0, cn_1.cn)("mt-4 flex w-full max-w-[460px] flex-col gap-2", getAnyspendQuoteError && "mt-0"), children: (0, jsx_runtime_1.jsx)(react_1.ShinyButton, { accentColor: "hsl(var(--as-brand))", disabled: btnInfo.disable, onClick: onMainButtonClick, className: (0, cn_1.cn)("as-main-button relative w-full", btnInfo.error ? "!bg-as-red" : btnInfo.disable ? "!bg-as-on-surface-2" : "!bg-as-brand"), textClassName: (0, cn_1.cn)(btnInfo.error ? "text-white" : btnInfo.disable ? "text-as-secondary" : "text-white"), children: btnInfo.text }) }), mainFooter ? mainFooter : null] }));
125
126
  // Handle crypto order creation
126
127
  const handleCryptoOrder = async () => {
127
128
  try {
@@ -218,6 +219,7 @@ function AnySpendDepositHypeInner({ loadOrder, mode = "modal", recipientAddress,
218
219
  setSelectedFiatPaymentMethod(method);
219
220
  setActivePanel(useAnyspendFlow_1.PanelView.MAIN);
220
221
  }, srcAmountOnRamp: srcAmount }));
222
+ const pointsDetailView = ((0, jsx_runtime_1.jsx)(PointsDetailPanel_1.PointsDetailPanel, { pointsAmount: anyspendQuote?.data?.pointsAmount || 0, onBack: () => setActivePanel(useAnyspendFlow_1.PanelView.MAIN) }));
221
223
  // If showing token selection, render with panel transitions
222
224
  return ((0, jsx_runtime_1.jsx)(react_1.StyleRoot, { children: (0, jsx_runtime_1.jsx)("div", { className: (0, cn_1.cn)("anyspend-container font-inter mx-auto w-full max-w-[460px]", mode === "page" &&
223
225
  "bg-as-surface-primary border-as-border-secondary overflow-hidden rounded-2xl border shadow-xl"), children: (0, jsx_runtime_1.jsx)(react_1.TransitionPanel, { activeIndex: orderId
@@ -239,5 +241,6 @@ function AnySpendDepositHypeInner({ loadOrder, mode = "modal", recipientAddress,
239
241
  (0, jsx_runtime_1.jsx)("div", { className: (0, cn_1.cn)(mode === "page" && "p-6"), children: recipientSelectionView }, "recipient-selection-view"),
240
242
  (0, jsx_runtime_1.jsx)("div", { className: (0, cn_1.cn)(mode === "page" && "p-6"), children: orderDetailsView }, "order-details-view"),
241
243
  (0, jsx_runtime_1.jsx)("div", { className: (0, cn_1.cn)(mode === "page" && "p-6"), children: loadingView }, "loading-view"),
244
+ (0, jsx_runtime_1.jsx)("div", { className: (0, cn_1.cn)(mode === "page" && "p-6"), children: pointsDetailView }, "points-detail-view"),
242
245
  ] }) }) }));
243
246
  }
@@ -14,6 +14,7 @@ interface CryptoReceiveSectionProps {
14
14
  anyspendQuote?: any;
15
15
  dstTokenSymbol?: string;
16
16
  dstTokenLogoURI?: string;
17
+ onShowPointsDetail?: () => void;
17
18
  }
18
- export declare function CryptoReceiveSection({ isDepositMode, isBuyMode, selectedRecipientAddress, recipientName, onSelectRecipient, dstAmount, dstToken, selectedDstChainId, setSelectedDstChainId, setSelectedDstToken, onChangeDstAmount, anyspendQuote, dstTokenSymbol, dstTokenLogoURI, }: CryptoReceiveSectionProps): import("react/jsx-runtime").JSX.Element;
19
+ export declare function CryptoReceiveSection({ isDepositMode, isBuyMode, selectedRecipientAddress, recipientName, onSelectRecipient, dstAmount, dstToken, selectedDstChainId, setSelectedDstChainId, setSelectedDstToken, onChangeDstAmount, anyspendQuote, dstTokenSymbol, dstTokenLogoURI, onShowPointsDetail, }: CryptoReceiveSectionProps): import("react/jsx-runtime").JSX.Element;
19
20
  export {};
@@ -8,46 +8,48 @@ const formatAddress_1 = require("../../../../shared/utils/formatAddress");
8
8
  const number_1 = require("../../../../shared/utils/number");
9
9
  const lucide_react_1 = require("lucide-react");
10
10
  const react_1 = require("motion/react");
11
+ const FeatureFlagsContext_1 = require("../../contexts/FeatureFlagsContext");
11
12
  const OrderTokenAmount_1 = require("./OrderTokenAmount");
12
- function CryptoReceiveSection({ isDepositMode = false, isBuyMode = false, selectedRecipientAddress, recipientName, onSelectRecipient, dstAmount, dstToken, selectedDstChainId, setSelectedDstChainId, setSelectedDstToken, onChangeDstAmount, anyspendQuote, dstTokenSymbol, dstTokenLogoURI, }) {
13
+ function CryptoReceiveSection({ isDepositMode = false, isBuyMode = false, selectedRecipientAddress, recipientName, onSelectRecipient, dstAmount, dstToken, selectedDstChainId, setSelectedDstChainId, setSelectedDstToken, onChangeDstAmount, anyspendQuote, dstTokenSymbol, dstTokenLogoURI, onShowPointsDetail, }) {
14
+ const featureFlags = (0, FeatureFlagsContext_1.useFeatureFlags)();
13
15
  return ((0, jsx_runtime_1.jsxs)(react_1.motion.div, { initial: { opacity: 0, y: 20, filter: "blur(10px)" }, animate: { opacity: 1, y: 0, filter: "blur(0px)" }, transition: { duration: 0.3, delay: 0.1, ease: "easeInOut" }, className: "receive-section bg-as-surface-secondary border-as-border-secondary relative flex w-full flex-col gap-2 rounded-2xl border p-4 sm:p-6", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex w-full items-center justify-between", children: [(0, jsx_runtime_1.jsx)("div", { className: "text-as-primary/50 flex h-7 items-center text-sm", children: isDepositMode ? "Deposit" : "Receive" }), selectedRecipientAddress ? ((0, jsx_runtime_1.jsx)("button", { className: (0, cn_1.cn)("text-as-tertiarry flex h-7 items-center gap-2 rounded-lg"), onClick: onSelectRecipient, children: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("span", { className: "text-as-tertiarry flex items-center gap-1 text-sm", children: recipientName ? (0, utils_1.formatUsername)(recipientName) : (0, formatAddress_1.shortenAddress)(selectedRecipientAddress || "") }), (0, jsx_runtime_1.jsx)(lucide_react_1.ChevronRight, { className: "h-4 w-4" })] }) })) : ((0, jsx_runtime_1.jsx)("button", { className: "text-as-primary/70 flex items-center gap-1 rounded-lg", onClick: onSelectRecipient, children: (0, jsx_runtime_1.jsx)("div", { className: "text-sm font-medium", children: "Select recipient" }) }))] }), isBuyMode || isDepositMode ? (
14
16
  // Fixed destination token display for buy mode and deposit mode
15
17
  (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center justify-between", children: [(0, jsx_runtime_1.jsx)("div", { className: "text-as-primary text-2xl font-bold", children: dstAmount || "0" }), (0, jsx_runtime_1.jsxs)("div", { className: "bg-as-brand/10 border-as-brand/30 flex items-center gap-3 rounded-xl border px-4 py-3", children: [(dstTokenLogoURI || dstToken.metadata?.logoURI) && ((0, jsx_runtime_1.jsx)("img", { src: dstTokenLogoURI || dstToken.metadata?.logoURI, alt: dstTokenSymbol || dstToken.symbol, className: "h-8 w-8 rounded-full" })), (0, jsx_runtime_1.jsx)("span", { className: "text-as-brand text-lg font-bold", children: dstTokenSymbol || dstToken.symbol })] })] })) : (
16
18
  // Token selection for regular swap mode
17
- (0, jsx_runtime_1.jsx)(OrderTokenAmount_1.OrderTokenAmount, { address: selectedRecipientAddress, context: "to", inputValue: dstAmount, onChangeInput: onChangeDstAmount || (() => { }), chainId: selectedDstChainId || dstToken.chainId, setChainId: setSelectedDstChainId || (() => { }), token: dstToken, setToken: setSelectedDstToken || (() => { }) })), (0, jsx_runtime_1.jsxs)("div", { className: "text-as-primary/50 flex h-5 items-center text-sm", children: [(0, number_1.formatDisplayNumber)(anyspendQuote?.data?.currencyOut?.amountUsd, {
18
- style: "currency",
19
- fallback: "",
20
- }), anyspendQuote?.data?.currencyIn?.amountUsd &&
21
- anyspendQuote?.data?.currencyOut?.amountUsd &&
22
- (() => {
23
- const calculatePriceImpact = (inputUsd, outputUsd) => {
24
- if (!inputUsd || !outputUsd) {
25
- return { percentage: "0.00", isNegative: false };
26
- }
27
- const input = Number(inputUsd);
28
- const output = Number(outputUsd);
29
- // Handle edge cases
30
- if (input === 0 || isNaN(input) || isNaN(output) || input <= output) {
31
- return { percentage: "0.00", isNegative: false };
32
- }
33
- const percentageValue = ((output - input) / input) * 100;
34
- // Handle the -0.00% case
35
- if (percentageValue > -0.005 && percentageValue < 0) {
36
- return { percentage: "0.00", isNegative: false };
37
- }
38
- return {
39
- percentage: Math.abs(percentageValue).toFixed(2),
40
- isNegative: percentageValue < 0,
41
- };
42
- };
43
- const { percentage, isNegative } = calculatePriceImpact(anyspendQuote.data.currencyIn.amountUsd, anyspendQuote.data.currencyOut.amountUsd);
44
- // Parse the percentage as a number for comparison
45
- const percentageNum = parseFloat(percentage);
46
- // Don't show if less than 1%
47
- if (percentageNum < 1) {
48
- return null;
49
- }
50
- // Using inline style to ensure color displays
51
- return ((0, jsx_runtime_1.jsxs)("span", { className: "ml-2", style: { color: percentageNum >= 10 ? "red" : "#FFD700" }, children: ["(", isNegative ? "-" : "", percentage, "%)"] }));
52
- })()] })] }));
19
+ (0, jsx_runtime_1.jsx)(OrderTokenAmount_1.OrderTokenAmount, { address: selectedRecipientAddress, context: "to", inputValue: dstAmount, onChangeInput: onChangeDstAmount || (() => { }), chainId: selectedDstChainId || dstToken.chainId, setChainId: setSelectedDstChainId || (() => { }), token: dstToken, setToken: setSelectedDstToken || (() => { }) })), (0, jsx_runtime_1.jsxs)("div", { className: "text-as-primary/50 flex h-5 items-center justify-start gap-2 text-sm", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2", children: [(0, number_1.formatDisplayNumber)(anyspendQuote?.data?.currencyOut?.amountUsd, {
20
+ style: "currency",
21
+ fallback: "",
22
+ }), anyspendQuote?.data?.currencyIn?.amountUsd &&
23
+ anyspendQuote?.data?.currencyOut?.amountUsd &&
24
+ (() => {
25
+ const calculatePriceImpact = (inputUsd, outputUsd) => {
26
+ if (!inputUsd || !outputUsd) {
27
+ return { percentage: "0.00", isNegative: false };
28
+ }
29
+ const input = Number(inputUsd);
30
+ const output = Number(outputUsd);
31
+ // Handle edge cases
32
+ if (input === 0 || isNaN(input) || isNaN(output) || input <= output) {
33
+ return { percentage: "0.00", isNegative: false };
34
+ }
35
+ const percentageValue = ((output - input) / input) * 100;
36
+ // Handle the -0.00% case
37
+ if (percentageValue > -0.005 && percentageValue < 0) {
38
+ return { percentage: "0.00", isNegative: false };
39
+ }
40
+ return {
41
+ percentage: Math.abs(percentageValue).toFixed(2),
42
+ isNegative: percentageValue < 0,
43
+ };
44
+ };
45
+ const { percentage, isNegative } = calculatePriceImpact(anyspendQuote.data.currencyIn.amountUsd, anyspendQuote.data.currencyOut.amountUsd);
46
+ // Parse the percentage as a number for comparison
47
+ const percentageNum = parseFloat(percentage);
48
+ // Don't show if less than 1%
49
+ if (percentageNum < 1) {
50
+ return null;
51
+ }
52
+ // Using inline style to ensure color displays
53
+ return ((0, jsx_runtime_1.jsxs)("span", { className: "ml-2", style: { color: percentageNum >= 10 ? "red" : "#FFD700" }, children: ["(", isNegative ? "-" : "", percentage, "%)"] }));
54
+ })()] }), featureFlags.showPoints && anyspendQuote?.data?.pointsAmount && anyspendQuote.data.pointsAmount > 0 && ((0, jsx_runtime_1.jsxs)("button", { className: "bg-as-brand hover:scale-102 active:scale-98 active:scale-98 relative flex cursor-pointer items-center gap-1 rounded-lg px-2 py-1 transition-all", onClick: () => onShowPointsDetail?.(), children: [(0, jsx_runtime_1.jsx)("div", { className: "pointer-events-none absolute inset-0 h-full w-full rounded-lg border border-white/10 border-t-white/20 bg-gradient-to-b from-white/10 to-white/0" }), (0, jsx_runtime_1.jsxs)("span", { className: "text-xs text-white", children: ["+", anyspendQuote.data.pointsAmount.toLocaleString(), " pts"] })] }, `points-${anyspendQuote.data.pointsAmount}`))] })] }));
53
55
  }
@@ -55,9 +55,6 @@ function getOrderSuccessText({ order, tournament, formattedActualDstAmount, form
55
55
  case "custom":
56
56
  actionText = order.metadata.action || `executed contract`;
57
57
  return `Successfully ${actionText}`;
58
- case "hype_duel":
59
- actionText = `deposited ${formattedActualDstAmount || "--"} HYPE`;
60
- return `Successfully ${actionText} to ${recipient}`;
61
58
  default:
62
59
  throw new Error("Invalid order type");
63
60
  }
@@ -434,7 +431,7 @@ exports.OrderDetails = (0, react_4.memo)(function OrderDetails({ mode = "modal",
434
431
  : null] }) })] }) }), order.errorDetails && ((0, jsx_runtime_1.jsx)("div", { className: "flex justify-center", children: (0, jsx_runtime_1.jsx)("span", { className: "text-as-primary/50 text-center text-sm", style: { maxWidth: "40ch" }, children: (0, anyspend_1.getErrorDisplay)(order.errorDetails) }) })), (0, jsx_runtime_1.jsx)("button", { className: "order-close-button order-details-close-btn bg-as-brand flex w-full items-center justify-center gap-2 rounded-lg p-2 font-semibold text-white", onClick: mode === "page" ? handleBack : handleCloseModal, children: mode === "page" ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: ["Return to Home ", (0, jsx_runtime_1.jsx)(lucide_react_1.Home, { className: "ml-2 h-4 w-4" })] })) : ("Close") })] }));
435
432
  }
436
433
  if (executeTx) {
437
- return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(OrderStatus_1.OrderStatus, { order: order, selectedCryptoPaymentMethod: orderStatusPaymentMethod }), (0, jsx_runtime_1.jsx)(OrderDetailsCollapsible_1.OrderDetailsCollapsible, { order: order, dstToken: dstToken, tournament: tournament, nft: nft, recipientName: recipientName, formattedExpectedDstAmount: formattedExpectedDstAmount }), (0, jsx_runtime_1.jsx)(Accordion_1.Accordion, { type: "single", collapsible: true, className: "order-details-accordion w-full", children: (0, jsx_runtime_1.jsxs)(Accordion_1.AccordionItem, { value: "execute-details", className: "order-details-execute-item", children: [(0, jsx_runtime_1.jsx)(Accordion_1.AccordionTrigger, { className: "order-details-execute-trigger", children: "Transaction Details" }), (0, jsx_runtime_1.jsx)(Accordion_1.AccordionContent, { className: "order-details-execute-content pl-2", children: (0, jsx_runtime_1.jsxs)("div", { className: "relative flex w-full flex-col gap-4", children: [(0, jsx_runtime_1.jsx)("div", { className: "bg-as-surface-secondary absolute bottom-2 left-4 top-2 z-[5] w-2", children: (0, jsx_runtime_1.jsx)(react_3.motion.div, { className: "bg-as-border-primary absolute left-[2px] top-0 z-10 w-[3px]", initial: { height: "0%" }, animate: { height: "100%" }, transition: { duration: 1.5, ease: "easeInOut" } }) }), depositTxs
434
+ return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(OrderStatus_1.OrderStatus, { order: order, selectedCryptoPaymentMethod: orderStatusPaymentMethod }), (0, jsx_runtime_1.jsx)(OrderDetailsCollapsible_1.OrderDetailsCollapsible, { order: order, dstToken: dstToken, tournament: tournament, nft: nft, recipientName: recipientName, formattedExpectedDstAmount: formattedExpectedDstAmount }), (0, jsx_runtime_1.jsx)(Accordion_1.Accordion, { type: "single", collapsible: true, className: "order-details-accordion w-full", children: (0, jsx_runtime_1.jsxs)(Accordion_1.AccordionItem, { value: "execute-details", className: "order-details-execute-item", children: [(0, jsx_runtime_1.jsx)(Accordion_1.AccordionTrigger, { className: "accordion-trigger", children: "Transaction Details" }), (0, jsx_runtime_1.jsx)(Accordion_1.AccordionContent, { className: "accordion-content pl-2", children: (0, jsx_runtime_1.jsxs)("div", { className: "relative flex w-full flex-col gap-4", children: [(0, jsx_runtime_1.jsx)("div", { className: "bg-as-surface-secondary absolute bottom-2 left-4 top-2 z-[5] w-2", children: (0, jsx_runtime_1.jsx)(react_3.motion.div, { className: "bg-as-border-primary absolute left-[2px] top-0 z-10 w-[3px]", initial: { height: "0%" }, animate: { height: "100%" }, transition: { duration: 1.5, ease: "easeInOut" } }) }), depositTxs
438
435
  ? depositTxs.map(dTxs => ((0, jsx_runtime_1.jsx)(TransactionDetails, { title: order.onrampMetadata?.vendor === "stripe-web2"
439
436
  ? `Received payment`
440
437
  : `Received ${(0, number_1.formatTokenAmount)(BigInt(dTxs.amount), srcToken.decimals)} ${srcToken.symbol}`, chainId: order.srcChain, tx: dTxs, isProcessing: false }, dTxs.txHash)))
@@ -1,6 +1,7 @@
1
1
  import { components } from "../../../../anyspend/types/api";
2
+ import { GetQuoteResponse } from "../../../../anyspend/types/api_req_res";
2
3
  import { FiatPaymentMethod } from "./FiatPaymentMethod";
3
- export declare function PanelOnramp({ srcAmountOnRamp, setSrcAmountOnRamp, selectedPaymentMethod, setActivePanel, _recipientAddress, destinationToken, destinationChainId, destinationAmount, onDestinationTokenChange, onDestinationChainChange, fiatPaymentMethodIndex, recipientSelectionPanelIndex, dstTokenSymbol, hideDstToken, }: {
4
+ export declare function PanelOnramp({ srcAmountOnRamp, setSrcAmountOnRamp, selectedPaymentMethod, setActivePanel, _recipientAddress, destinationToken, destinationChainId, destinationAmount, onDestinationTokenChange, onDestinationChainChange, fiatPaymentMethodIndex, recipientSelectionPanelIndex, dstTokenSymbol, hideDstToken, anyspendQuote, onShowPointsDetail, }: {
4
5
  srcAmountOnRamp: string;
5
6
  setSrcAmountOnRamp: (amount: string) => void;
6
7
  selectedPaymentMethod?: FiatPaymentMethod;
@@ -15,4 +16,6 @@ export declare function PanelOnramp({ srcAmountOnRamp, setSrcAmountOnRamp, selec
15
16
  recipientSelectionPanelIndex: number;
16
17
  dstTokenSymbol?: string;
17
18
  hideDstToken?: boolean;
19
+ anyspendQuote?: GetQuoteResponse;
20
+ onShowPointsDetail?: () => void;
18
21
  }): import("react/jsx-runtime").JSX.Element;
@@ -10,9 +10,11 @@ const formatAddress_1 = require("../../../../shared/utils/formatAddress");
10
10
  const lucide_react_1 = require("lucide-react");
11
11
  const react_3 = require("react");
12
12
  const sonner_1 = require("sonner");
13
+ const FeatureFlagsContext_1 = require("../../contexts/FeatureFlagsContext");
13
14
  const FiatPaymentMethod_1 = require("./FiatPaymentMethod");
14
15
  const OrderTokenAmountFiat_1 = require("./OrderTokenAmountFiat");
15
- function PanelOnramp({ srcAmountOnRamp, setSrcAmountOnRamp, selectedPaymentMethod, setActivePanel, _recipientAddress, destinationToken, destinationChainId, destinationAmount, onDestinationTokenChange, onDestinationChainChange, fiatPaymentMethodIndex, recipientSelectionPanelIndex, dstTokenSymbol, hideDstToken = false, }) {
16
+ function PanelOnramp({ srcAmountOnRamp, setSrcAmountOnRamp, selectedPaymentMethod, setActivePanel, _recipientAddress, destinationToken, destinationChainId, destinationAmount, onDestinationTokenChange, onDestinationChainChange, fiatPaymentMethodIndex, recipientSelectionPanelIndex, dstTokenSymbol, hideDstToken = false, anyspendQuote, onShowPointsDetail, }) {
17
+ const featureFlags = (0, FeatureFlagsContext_1.useFeatureFlags)();
16
18
  // Get geo-based onramp options to access fee information
17
19
  const { stripeWeb2Support } = (0, react_1.useGeoOnrampOptions)(srcAmountOnRamp);
18
20
  // Helper function to get fees from API data
@@ -73,9 +75,8 @@ function PanelOnramp({ srcAmountOnRamp, setSrcAmountOnRamp, selectedPaymentMetho
73
75
  width: `${Math.max(50, srcAmountOnRamp.length * 34)}px`,
74
76
  } })] }) }), (0, jsx_runtime_1.jsx)("div", { className: (0, utils_1.cn)("mx-auto mb-6 inline-grid grid-cols-4 gap-2", hideDstToken && "mb-0"), children: ["5", "10", "20", "25"].map(value => ((0, jsx_runtime_1.jsxs)("button", { onClick: () => handleQuickAmount(value), className: `bg-as-surface-secondary border-as-border-secondary hover:border-as-border-secondary h-7 w-14 rounded-lg border text-sm font-medium transition-all duration-200 ${srcAmountOnRamp === value
75
77
  ? "border-as-border-secondary bg-as-surface-secondary"
76
- : "bg-as-surface-secondary hover:bg-as-surface-secondary"}`, children: ["$", value] }, value))) }), destinationToken && destinationChainId && !hideDstToken && ((0, jsx_runtime_1.jsx)(OrderTokenAmountFiat_1.OrderTokenAmountFiat, { address: _recipientAddress, context: "to", inputValue: destinationAmount || "0", onChangeInput: () => { }, chainId: destinationChainId, setChainId: onDestinationChainChange || (() => { }), token: destinationToken, setToken: onDestinationTokenChange || (() => { }) }))] }), (0, jsx_runtime_1.jsxs)("div", { className: "border-as-border-secondary bg-as-surface-secondary mt-4 flex w-full flex-col gap-3 rounded-xl border p-4", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex w-full items-center justify-between gap-2", children: [(0, jsx_runtime_1.jsx)("span", { className: "text-as-tertiarry flex items-center text-sm", children: "Recipient" }), _recipientAddress ? ((0, jsx_runtime_1.jsxs)("button", { className: "text-as-tertiarry flex h-7 items-center gap-1 text-sm transition-colors hover:text-blue-700", onClick: () => setActivePanel(recipientSelectionPanelIndex), children: [(0, jsx_runtime_1.jsx)("span", { className: "text-sm", children: recipientName ? (0, utils_1.formatUsername)(recipientName) : (0, formatAddress_1.formatAddress)(_recipientAddress) }), (0, jsx_runtime_1.jsx)(lucide_react_1.ChevronRight, { size: 16 })] })) : ((0, jsx_runtime_1.jsxs)("button", { className: "text-as-tertiarry flex h-7 items-center gap-1 text-sm transition-colors hover:text-blue-700", onClick: () => setActivePanel(5), children: [(0, jsx_runtime_1.jsx)(lucide_react_1.Wallet, { className: "text-as-brand", size: 16 }), "Select recipient", (0, jsx_runtime_1.jsx)(lucide_react_1.ChevronRight, { size: 16 })] }))] }), (0, jsx_runtime_1.jsx)("div", { className: "divider w-full" }), (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center justify-between", children: [(0, jsx_runtime_1.jsx)("span", { className: "text-as-tertiarry text-sm", children: "Expected to receive" }), (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2", children: [(0, jsx_runtime_1.jsxs)("span", { className: "text-as-primary font-semibold", children: [destinationAmount || "0", " ", dstTokenSymbol || destinationToken?.symbol || ""] }), (0, jsx_runtime_1.jsxs)("span", { className: "text-as-tertiarry text-sm", children: ["on ", destinationChainId ? chain_1.ALL_CHAINS[destinationChainId]?.name : ""] }), destinationToken && destinationChainId && destinationToken.metadata?.logoURI && ((0, jsx_runtime_1.jsx)("img", { src: chain_1.ALL_CHAINS[destinationChainId]?.logoUrl, alt: "Chain", className: "h-4 w-4 rounded-full" }))] })] }), (0, jsx_runtime_1.jsx)("div", { className: "divider w-full" }), (0, jsx_runtime_1.jsx)("div", { className: "", children: (0, jsx_runtime_1.jsx)("div", { className: "flex items-center justify-between", children: (() => {
77
- const currentPaymentMethod = selectedPaymentMethod || FiatPaymentMethod_1.FiatPaymentMethod.NONE;
78
- const fee = getFeeFromApi(currentPaymentMethod);
79
- return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("span", { className: "text-as-tertiarry text-sm", children: fee !== null ? `Total (included $${fee.toFixed(2)} fee)` : "Total" }), (0, jsx_runtime_1.jsxs)("span", { className: "text-as-primary font-semibold", children: ["$", getTotalAmount(currentPaymentMethod).toFixed(2)] })] }));
80
- })() }) })] })] }));
78
+ : "bg-as-surface-secondary hover:bg-as-surface-secondary"}`, children: ["$", value] }, value))) }), destinationToken && destinationChainId && !hideDstToken && ((0, jsx_runtime_1.jsx)(OrderTokenAmountFiat_1.OrderTokenAmountFiat, { address: _recipientAddress, context: "to", inputValue: destinationAmount || "0", onChangeInput: () => { }, chainId: destinationChainId, setChainId: onDestinationChainChange || (() => { }), token: destinationToken, setToken: onDestinationTokenChange || (() => { }) }))] }), (0, jsx_runtime_1.jsxs)("div", { className: "border-as-border-secondary bg-as-surface-secondary mt-4 flex w-full flex-col gap-3 rounded-xl border p-4", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex w-full items-center justify-between gap-2", children: [(0, jsx_runtime_1.jsx)("span", { className: "text-as-tertiarry flex items-center text-sm", children: "Recipient" }), _recipientAddress ? ((0, jsx_runtime_1.jsxs)("button", { className: "text-as-tertiarry flex h-7 items-center gap-1 text-sm transition-colors hover:text-blue-700", onClick: () => setActivePanel(recipientSelectionPanelIndex), children: [(0, jsx_runtime_1.jsx)("span", { className: "text-sm", children: recipientName ? (0, utils_1.formatUsername)(recipientName) : (0, formatAddress_1.formatAddress)(_recipientAddress) }), (0, jsx_runtime_1.jsx)(lucide_react_1.ChevronRight, { size: 16 })] })) : ((0, jsx_runtime_1.jsxs)("button", { className: "text-as-tertiarry flex h-7 items-center gap-1 text-sm transition-colors hover:text-blue-700", onClick: () => setActivePanel(5), children: [(0, jsx_runtime_1.jsx)(lucide_react_1.Wallet, { className: "text-as-brand", size: 16 }), "Select recipient", (0, jsx_runtime_1.jsx)(lucide_react_1.ChevronRight, { size: 16 })] }))] }), (0, jsx_runtime_1.jsx)("div", { className: "divider w-full" }), (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center justify-between", children: [(0, jsx_runtime_1.jsx)("span", { className: "text-as-tertiarry text-sm", children: "Expected to receive" }), (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2", children: [(0, jsx_runtime_1.jsxs)("span", { className: "text-as-primary font-semibold", children: [destinationAmount || "0", " ", dstTokenSymbol || destinationToken?.symbol || ""] }), (0, jsx_runtime_1.jsxs)("span", { className: "text-as-tertiarry text-sm", children: ["on ", destinationChainId ? chain_1.ALL_CHAINS[destinationChainId]?.name : ""] }), destinationToken && destinationChainId && destinationToken.metadata?.logoURI && ((0, jsx_runtime_1.jsx)("img", { src: chain_1.ALL_CHAINS[destinationChainId]?.logoUrl, alt: "Chain", className: "h-4 w-4 rounded-full" }))] })] }), (0, jsx_runtime_1.jsx)("div", { className: "divider w-full" }), (0, jsx_runtime_1.jsx)("div", { className: "", children: (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center justify-between", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2", children: [(0, jsx_runtime_1.jsx)("span", { className: "text-as-tertiarry text-sm", children: (() => {
79
+ const fee = getFeeFromApi(selectedPaymentMethod || FiatPaymentMethod_1.FiatPaymentMethod.NONE);
80
+ return fee !== null ? `Total (included $${fee.toFixed(2)} fee)` : "Total";
81
+ })() }), featureFlags.showPoints && anyspendQuote?.data?.pointsAmount && anyspendQuote.data.pointsAmount > 0 && ((0, jsx_runtime_1.jsxs)("button", { className: "bg-as-brand hover:scale-102 active:scale-98 relative flex cursor-pointer items-center gap-1 rounded-lg px-2 py-1 transition-all", onClick: () => onShowPointsDetail?.(), children: [(0, jsx_runtime_1.jsx)("div", { className: "pointer-events-none absolute inset-0 h-full w-full rounded-lg border border-white/10 border-t-white/20 bg-gradient-to-b from-white/10 to-white/0" }), (0, jsx_runtime_1.jsxs)("span", { className: "text-xs text-white", children: ["+", anyspendQuote.data.pointsAmount.toLocaleString(), " pts"] })] }, `points-${anyspendQuote.data.pointsAmount}`))] }), (0, jsx_runtime_1.jsxs)("span", { className: "text-as-primary font-semibold", children: ["$", getTotalAmount(selectedPaymentMethod || FiatPaymentMethod_1.FiatPaymentMethod.NONE).toFixed(2)] })] }) })] })] }));
81
82
  }
@@ -0,0 +1,6 @@
1
+ interface PointsDetailPanelProps {
2
+ pointsAmount?: number;
3
+ onBack: () => void;
4
+ }
5
+ export declare function PointsDetailPanel({ pointsAmount, onBack }: PointsDetailPanelProps): import("react/jsx-runtime").JSX.Element;
6
+ export {};
@@ -0,0 +1,14 @@
1
+ "use strict";
2
+ var __importDefault = (this && this.__importDefault) || function (mod) {
3
+ return (mod && mod.__esModule) ? mod : { "default": mod };
4
+ };
5
+ Object.defineProperty(exports, "__esModule", { value: true });
6
+ exports.PointsDetailPanel = PointsDetailPanel;
7
+ const jsx_runtime_1 = require("react/jsx-runtime");
8
+ const react_1 = require("../../../../global-account/react");
9
+ const cn_1 = require("../../../../shared/utils/cn");
10
+ const lucide_react_1 = require("lucide-react");
11
+ const link_1 = __importDefault(require("next/link"));
12
+ function PointsDetailPanel({ pointsAmount = 0, onBack }) {
13
+ return ((0, jsx_runtime_1.jsxs)("div", { className: "mx-auto flex w-[460px] max-w-full flex-col items-center gap-4", children: [(0, jsx_runtime_1.jsx)("div", { className: "flex w-full items-center justify-between", children: (0, jsx_runtime_1.jsxs)(react_1.Button, { variant: "ghost", onClick: onBack, className: "text-as-primary/70 hover:text-as-primary flex items-center gap-2", children: [(0, jsx_runtime_1.jsx)(lucide_react_1.ArrowDown, { className: "h-4 w-4 rotate-90" }), "Back"] }) }), (0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col items-center gap-4 text-center", children: [(0, jsx_runtime_1.jsx)("h3", { className: "text-as-primary text-xl font-bold", children: "Earn Points with Every Swap" }), (0, jsx_runtime_1.jsxs)("p", { className: "text-as-primary/70 text-balance text-sm leading-relaxed", children: ["You'll earn ", (0, jsx_runtime_1.jsxs)("span", { className: "text-as-brand font-semibold", children: ["+", pointsAmount.toLocaleString(), " points"] }), " ", "towards the", " ", (0, jsx_runtime_1.jsx)(link_1.default, { href: "https://anyspend.com/points", target: "_blank", className: "text-as-brand underline", children: "next AnySpend airdrop" }), " ", "when you complete this transaction."] }), (0, jsx_runtime_1.jsxs)("div", { className: "bg-as-surface-primary border-as-border-secondary mt-2 w-full rounded-lg border p-4 text-left", children: [(0, jsx_runtime_1.jsx)("h4", { className: "text-as-primary mb-2 font-semibold", children: "How it works:" }), (0, jsx_runtime_1.jsxs)("ul", { className: "text-as-primary/70 space-y-1 text-sm", children: [(0, jsx_runtime_1.jsx)("li", { children: "\u2022 Points are earned based on transaction volume" }), (0, jsx_runtime_1.jsx)("li", { children: "\u2022 Higher volume = more points" }), (0, jsx_runtime_1.jsx)("li", { children: "\u2022 Points contribute to future airdrops" }), (0, jsx_runtime_1.jsx)("li", { children: "\u2022 Keep swapping to maximize your rewards" })] })] }), (0, jsx_runtime_1.jsx)(react_1.ShinyButton, { accentColor: "hsl(var(--as-brand))", onClick: onBack, className: (0, cn_1.cn)("as-main-button !bg-as-brand relative w-full"), textClassName: (0, cn_1.cn)("text-white"), children: "Back to Swap" })] })] }));
14
+ }
@@ -0,0 +1,11 @@
1
+ import { ReactNode } from "react";
2
+ export interface FeatureFlags {
3
+ showPoints?: boolean;
4
+ }
5
+ interface FeatureFlagsProviderProps {
6
+ children: ReactNode;
7
+ featureFlags?: FeatureFlags;
8
+ }
9
+ export declare function FeatureFlagsProvider({ children, featureFlags }: FeatureFlagsProviderProps): import("react/jsx-runtime").JSX.Element;
10
+ export declare function useFeatureFlags(): FeatureFlags;
11
+ export {};
@@ -0,0 +1,21 @@
1
+ "use strict";
2
+ "use client";
3
+ Object.defineProperty(exports, "__esModule", { value: true });
4
+ exports.FeatureFlagsProvider = FeatureFlagsProvider;
5
+ exports.useFeatureFlags = useFeatureFlags;
6
+ const jsx_runtime_1 = require("react/jsx-runtime");
7
+ const react_1 = require("react");
8
+ const FeatureFlagsContext = (0, react_1.createContext)(undefined);
9
+ const defaultFeatureFlags = {
10
+ showPoints: false,
11
+ };
12
+ function FeatureFlagsProvider({ children, featureFlags = defaultFeatureFlags }) {
13
+ return (0, jsx_runtime_1.jsx)(FeatureFlagsContext.Provider, { value: { featureFlags }, children: children });
14
+ }
15
+ function useFeatureFlags() {
16
+ const context = (0, react_1.useContext)(FeatureFlagsContext);
17
+ if (!context) {
18
+ return defaultFeatureFlags;
19
+ }
20
+ return context.featureFlags;
21
+ }
@@ -7,7 +7,8 @@ export declare enum PanelView {
7
7
  FIAT_PAYMENT_METHOD = 2,
8
8
  RECIPIENT_SELECTION = 3,
9
9
  ORDER_DETAILS = 4,
10
- LOADING = 5
10
+ LOADING = 5,
11
+ POINTS_DETAIL = 6
11
12
  }
12
13
  interface UseAnyspendFlowProps {
13
14
  paymentType?: "crypto" | "fiat";
@@ -140,6 +141,8 @@ export declare function useAnyspendFlow({ paymentType, recipientAddress, loadOrd
140
141
  };
141
142
  timeEstimate?: number;
142
143
  userBalance?: string;
144
+ pointsAmount?: number;
145
+ pointsMultiplier?: number;
143
146
  };
144
147
  statusCode: number;
145
148
  } | undefined;
@@ -22,6 +22,7 @@ var PanelView;
22
22
  PanelView[PanelView["RECIPIENT_SELECTION"] = 3] = "RECIPIENT_SELECTION";
23
23
  PanelView[PanelView["ORDER_DETAILS"] = 4] = "ORDER_DETAILS";
24
24
  PanelView[PanelView["LOADING"] = 5] = "LOADING";
25
+ PanelView[PanelView["POINTS_DETAIL"] = 6] = "POINTS_DETAIL";
25
26
  })(PanelView || (exports.PanelView = PanelView = {}));
26
27
  function useAnyspendFlow({ paymentType = "crypto", recipientAddress, loadOrder, isDepositMode = false, onOrderSuccess, onTransactionSuccess, sourceTokenAddress, sourceTokenChainId, slippage = 0, disableUrlParamManagement = false, }) {
27
28
  const searchParams = (0, react_2.useSearchParamsSSR)();
@@ -189,12 +190,19 @@ function useAnyspendFlow({ paymentType = "crypto", recipientAddress, loadOrder,
189
190
  // Handle order completion
190
191
  (0, react_3.useEffect)(() => {
191
192
  if (oat?.data?.order.status === "executed") {
192
- console.log("Order executed successfully");
193
- // just get the payload.amount if available from custompayload
194
- const amount = oat.data.order.payload?.amount;
195
- onTransactionSuccess?.(amount);
193
+ // get the actualDstAmount if available from custompayload
194
+ const amount = oat.data.order.payload?.actualDstAmount;
195
+ const formattedActualDstAmount = amount
196
+ ? (0, number_1.formatTokenAmount)(BigInt(amount), oat.data.order.metadata.dstToken.decimals)
197
+ : undefined;
198
+ onTransactionSuccess?.(formattedActualDstAmount);
196
199
  }
197
- }, [oat?.data?.order.status, oat?.data?.order.payload, onTransactionSuccess]);
200
+ }, [
201
+ oat?.data?.order.status,
202
+ oat?.data?.order.payload,
203
+ onTransactionSuccess,
204
+ oat?.data?.order.metadata.dstToken.decimals,
205
+ ]);
198
206
  return {
199
207
  // State
200
208
  activePanel,
@@ -1,6 +1,8 @@
1
1
  import { ReactNode } from "react";
2
+ import { FeatureFlags } from "../contexts/FeatureFlagsContext";
2
3
  interface AnyspendProviderProps {
3
4
  children: ReactNode;
5
+ featureFlags?: FeatureFlags;
4
6
  }
5
7
  /**
6
8
  * AnyspendProvider is a top-level provider that wraps your application to provide
@@ -12,17 +14,18 @@ interface AnyspendProviderProps {
12
14
  * - Safe to use at the application root
13
15
  * - Configures sensible defaults for query caching
14
16
  * - Handles Stripe payment redirects and modal state
17
+ * - Provides feature flags configuration
15
18
  *
16
19
  * @example
17
20
  * ```tsx
18
21
  * function App() {
19
22
  * return (
20
- * <AnyspendProvider>
23
+ * <AnyspendProvider featureFlags={{ showPoints: true }}>
21
24
  * <YourApp />
22
25
  * </AnyspendProvider>
23
26
  * );
24
27
  * }
25
28
  * ```
26
29
  */
27
- export declare const AnyspendProvider: ({ children }: AnyspendProviderProps) => import("react/jsx-runtime").JSX.Element;
30
+ export declare const AnyspendProvider: ({ children, featureFlags }: AnyspendProviderProps) => import("react/jsx-runtime").JSX.Element;
28
31
  export {};
@@ -6,6 +6,7 @@ const jsx_runtime_1 = require("react/jsx-runtime");
6
6
  const react_1 = require("../../../global-account/react");
7
7
  const react_query_1 = require("@tanstack/react-query");
8
8
  const react_2 = require("react");
9
+ const FeatureFlagsContext_1 = require("../contexts/FeatureFlagsContext");
9
10
  const StripeRedirectHandler_1 = require("./StripeRedirectHandler");
10
11
  const defaultQueryClientConfig = {
11
12
  defaultOptions: {
@@ -26,20 +27,21 @@ const defaultQueryClientConfig = {
26
27
  * - Safe to use at the application root
27
28
  * - Configures sensible defaults for query caching
28
29
  * - Handles Stripe payment redirects and modal state
30
+ * - Provides feature flags configuration
29
31
  *
30
32
  * @example
31
33
  * ```tsx
32
34
  * function App() {
33
35
  * return (
34
- * <AnyspendProvider>
36
+ * <AnyspendProvider featureFlags={{ showPoints: true }}>
35
37
  * <YourApp />
36
38
  * </AnyspendProvider>
37
39
  * );
38
40
  * }
39
41
  * ```
40
42
  */
41
- const AnyspendProvider = function AnyspendProvider({ children }) {
43
+ const AnyspendProvider = function AnyspendProvider({ children, featureFlags }) {
42
44
  const [queryClient] = (0, react_2.useState)(() => new react_query_1.QueryClient(defaultQueryClientConfig));
43
- return ((0, jsx_runtime_1.jsx)(react_query_1.QueryClientProvider, { client: queryClient, children: (0, jsx_runtime_1.jsxs)(react_1.TooltipProvider, { children: [(0, jsx_runtime_1.jsx)(StripeRedirectHandler_1.StripeRedirectHandler, {}), children] }) }));
45
+ return ((0, jsx_runtime_1.jsx)(react_query_1.QueryClientProvider, { client: queryClient, children: (0, jsx_runtime_1.jsx)(FeatureFlagsContext_1.FeatureFlagsProvider, { featureFlags: featureFlags, children: (0, jsx_runtime_1.jsxs)(react_1.TooltipProvider, { children: [(0, jsx_runtime_1.jsx)(StripeRedirectHandler_1.StripeRedirectHandler, {}), children] }) }) }));
44
46
  };
45
47
  exports.AnyspendProvider = AnyspendProvider;
@@ -1,2 +1,3 @@
1
1
  export * from "./AnyspendProvider";
2
2
  export * from "./StripeRedirectHandler";
3
+ export { useFeatureFlags, type FeatureFlags } from "../contexts/FeatureFlagsContext";
@@ -14,5 +14,8 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
14
14
  for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
15
15
  };
16
16
  Object.defineProperty(exports, "__esModule", { value: true });
17
+ exports.useFeatureFlags = void 0;
17
18
  __exportStar(require("./AnyspendProvider"), exports);
18
19
  __exportStar(require("./StripeRedirectHandler"), exports);
20
+ var FeatureFlagsContext_1 = require("../contexts/FeatureFlagsContext");
21
+ Object.defineProperty(exports, "useFeatureFlags", { enumerable: true, get: function () { return FeatureFlagsContext_1.useFeatureFlags; } });
@@ -798,6 +798,16 @@ export interface paths {
798
798
  * @example 0
799
799
  */
800
800
  userBalance?: string;
801
+ /**
802
+ * @description Anyspend points that will be awarded for the order
803
+ * @example 100
804
+ */
805
+ pointsAmount?: number;
806
+ /**
807
+ * @description Multiplier applied to points that will be awarded for the order
808
+ * @example 1.5
809
+ */
810
+ pointsMultiplier?: number;
801
811
  };
802
812
  /** @example 200 */
803
813
  statusCode: number;
@@ -1,6 +1,7 @@
1
1
  import type { Address, EIP1193Provider, GetContractReturnType, Hex, PublicClient, WalletClient } from "viem";
2
2
  import { BondkitTokenABI } from "./abis";
3
- import type { BondkitTokenInitializationConfig, GetTransactionHistoryOptions, TokenDetails, TokenStatus, TransactionResponse } from "./types";
3
+ import type { BondkitTokenInitializationConfig, GetTransactionHistoryOptions, SwapQuote, TokenDetails, TransactionResponse } from "./types";
4
+ import { TokenStatus } from "./types";
4
5
  type ExecuteWriteOptions = {
5
6
  value?: bigint;
6
7
  gas?: bigint;
@@ -18,7 +19,8 @@ export declare class BondkitToken {
18
19
  private walletClientInstance;
19
20
  private connectedProvider?;
20
21
  private tradingToken?;
21
- constructor(contractAddress: string, walletKey?: string);
22
+ private swapService?;
23
+ constructor(contractAddress: string, walletKey?: string, rpcUrl?: string);
22
24
  connect(provider?: EIP1193Provider): boolean;
23
25
  /**
24
26
  * Connects using an EIP-1193 provider and requests accounts, selecting the first one.
@@ -69,5 +71,38 @@ export declare class BondkitToken {
69
71
  migrateToDex(options?: ExecuteWriteOptions): Promise<Hex | undefined>;
70
72
  transferTokenOwnership(newOwner: Address, options?: ExecuteWriteOptions): Promise<Hex | undefined>;
71
73
  renounceTokenOwnership(options?: ExecuteWriteOptions): Promise<Hex | undefined>;
74
+ /**
75
+ * Get the swap service instance (lazy initialization)
76
+ */
77
+ private getSwapService;
78
+ /**
79
+ * Check if DEX swapping is available (token must be in Dex phase)
80
+ */
81
+ isSwapAvailable(): Promise<boolean | undefined>;
82
+ /**
83
+ * Get swap quote for trading token → bondkit token
84
+ */
85
+ getSwapQuoteForBondkitToken(amountTradingTokenIn: string, slippageTolerance?: number): Promise<SwapQuote | undefined>;
86
+ /**
87
+ * Get swap quote for bondkit token → trading token
88
+ */
89
+ getSwapQuoteForTradingToken(amountBondkitTokenIn: string, slippageTolerance?: number): Promise<SwapQuote | undefined>;
90
+ /**
91
+ * Swap trading token for bondkit token
92
+ */
93
+ swapTradingTokenForBondkitToken(amountTradingTokenIn: string, slippageTolerance?: number, options?: ExecuteWriteOptions): Promise<Hex | undefined>;
94
+ /**
95
+ * Swap bondkit token for trading token
96
+ */
97
+ swapBondkitTokenForTradingToken(amountBondkitTokenIn: string, slippageTolerance?: number, options?: ExecuteWriteOptions): Promise<Hex | undefined>;
98
+ /**
99
+ * Helper method to get trading token decimals
100
+ */
101
+ private getTradingTokenDecimals;
102
+ /**
103
+ * Get trading token symbol
104
+ * @param tradingTokenAddress Optional trading token address to avoid fetching it again
105
+ */
106
+ getTradingTokenSymbol(tradingTokenAddress?: Address): Promise<string | undefined>;
72
107
  }
73
108
  export {};