@b3dotfun/sdk 0.0.40-alpha.6 → 0.0.40-alpha.8

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 (53) hide show
  1. package/dist/cjs/anyspend/react/components/AnySpend.js +1 -1
  2. package/dist/cjs/anyspend/react/components/AnyspendDepositHype.js +1 -1
  3. package/dist/cjs/anyspend/react/components/common/CryptoReceiveSection.js +38 -36
  4. package/dist/cjs/anyspend/react/components/common/PanelOnramp.d.ts +3 -1
  5. package/dist/cjs/anyspend/react/components/common/PanelOnramp.js +7 -6
  6. package/dist/cjs/anyspend/react/contexts/FeatureFlagsContext.d.ts +11 -0
  7. package/dist/cjs/anyspend/react/contexts/FeatureFlagsContext.js +21 -0
  8. package/dist/cjs/anyspend/react/hooks/useAnyspendFlow.d.ts +1 -65
  9. package/dist/cjs/anyspend/react/providers/AnyspendProvider.d.ts +5 -2
  10. package/dist/cjs/anyspend/react/providers/AnyspendProvider.js +5 -3
  11. package/dist/cjs/anyspend/react/providers/index.d.ts +1 -0
  12. package/dist/cjs/anyspend/react/providers/index.js +3 -0
  13. package/dist/cjs/anyspend/types/api_req_res.d.ts +8 -1
  14. package/dist/cjs/global-account/react/components/B3Provider/B3Provider.d.ts +3 -2
  15. package/dist/cjs/global-account/react/components/B3Provider/B3Provider.js +35 -16
  16. package/dist/cjs/global-account/react/components/SignInWithB3/steps/LoginStepCustom.js +4 -3
  17. package/dist/cjs/global-account/react/hooks/useAuthentication.js +1 -2
  18. package/dist/esm/anyspend/react/components/AnySpend.js +1 -1
  19. package/dist/esm/anyspend/react/components/AnyspendDepositHype.js +1 -1
  20. package/dist/esm/anyspend/react/components/common/CryptoReceiveSection.js +38 -36
  21. package/dist/esm/anyspend/react/components/common/PanelOnramp.d.ts +3 -1
  22. package/dist/esm/anyspend/react/components/common/PanelOnramp.js +7 -6
  23. package/dist/esm/anyspend/react/contexts/FeatureFlagsContext.d.ts +11 -0
  24. package/dist/esm/anyspend/react/contexts/FeatureFlagsContext.js +17 -0
  25. package/dist/esm/anyspend/react/hooks/useAnyspendFlow.d.ts +1 -65
  26. package/dist/esm/anyspend/react/providers/AnyspendProvider.d.ts +5 -2
  27. package/dist/esm/anyspend/react/providers/AnyspendProvider.js +5 -3
  28. package/dist/esm/anyspend/react/providers/index.d.ts +1 -0
  29. package/dist/esm/anyspend/react/providers/index.js +1 -0
  30. package/dist/esm/anyspend/types/api_req_res.d.ts +8 -1
  31. package/dist/esm/global-account/react/components/B3Provider/B3Provider.d.ts +3 -2
  32. package/dist/esm/global-account/react/components/B3Provider/B3Provider.js +36 -17
  33. package/dist/esm/global-account/react/components/SignInWithB3/steps/LoginStepCustom.js +3 -2
  34. package/dist/esm/global-account/react/hooks/useAuthentication.js +1 -2
  35. package/dist/types/anyspend/react/components/common/PanelOnramp.d.ts +3 -1
  36. package/dist/types/anyspend/react/contexts/FeatureFlagsContext.d.ts +11 -0
  37. package/dist/types/anyspend/react/hooks/useAnyspendFlow.d.ts +1 -65
  38. package/dist/types/anyspend/react/providers/AnyspendProvider.d.ts +5 -2
  39. package/dist/types/anyspend/react/providers/index.d.ts +1 -0
  40. package/dist/types/anyspend/types/api_req_res.d.ts +8 -1
  41. package/dist/types/global-account/react/components/B3Provider/B3Provider.d.ts +3 -2
  42. package/package.json +6 -5
  43. package/src/anyspend/react/components/AnySpend.tsx +1 -0
  44. package/src/anyspend/react/components/AnyspendDepositHype.tsx +1 -0
  45. package/src/anyspend/react/components/common/CryptoReceiveSection.tsx +56 -45
  46. package/src/anyspend/react/components/common/PanelOnramp.tsx +22 -16
  47. package/src/anyspend/react/contexts/FeatureFlagsContext.tsx +34 -0
  48. package/src/anyspend/react/providers/AnyspendProvider.tsx +11 -6
  49. package/src/anyspend/react/providers/index.ts +1 -0
  50. package/src/anyspend/types/api_req_res.ts +10 -1
  51. package/src/global-account/react/components/B3Provider/B3Provider.tsx +49 -24
  52. package/src/global-account/react/components/SignInWithB3/steps/LoginStepCustom.tsx +4 -2
  53. package/src/global-account/react/hooks/useAuthentication.ts +1 -2
@@ -663,7 +663,7 @@ function AnySpendInner({ destinationTokenAddress, destinationTokenChainId, mode
663
663
  setActivePanel(PanelView.MAIN);
664
664
  setSelectedCryptoPaymentMethod(CryptoPaymentMethod_1.CryptoPaymentMethodType.NONE); // Reset payment method when going back
665
665
  } })) }) }));
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: () => {
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, anyspendQuote: anyspendQuote }) })), (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
667
  if (activeTab === "fiat" || isBuyMode) {
668
668
  return;
669
669
  }
@@ -118,7 +118,7 @@ function AnySpendDepositHypeInner({ loadOrder, mode = "modal", recipientAddress,
118
118
  await handleFiatOrder();
119
119
  }
120
120
  };
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 => {
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, anyspendQuote: anyspendQuote }) })), (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
122
  setIsSrcInputDirty(false);
123
123
  setSrcAmount(value);
124
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] }));
@@ -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
13
  function CryptoReceiveSection({ isDepositMode = false, isBuyMode = false, selectedRecipientAddress, recipientName, onSelectRecipient, dstAmount, dstToken, selectedDstChainId, setSelectedDstChainId, setSelectedDstToken, onChangeDstAmount, anyspendQuote, dstTokenSymbol, dstTokenLogoURI, }) {
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-between 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.jsx)("div", { className: "flex items-center gap-1", children: (0, jsx_runtime_1.jsxs)("span", { className: "text-as-brand font-medium", children: ["+", anyspendQuote.data.pointsAmount.toLocaleString(), " pts"] }) }, `points-${anyspendQuote.data.pointsAmount}`))] })] }));
53
55
  }
@@ -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, }: {
4
5
  srcAmountOnRamp: string;
5
6
  setSrcAmountOnRamp: (amount: string) => void;
6
7
  selectedPaymentMethod?: FiatPaymentMethod;
@@ -15,4 +16,5 @@ export declare function PanelOnramp({ srcAmountOnRamp, setSrcAmountOnRamp, selec
15
16
  recipientSelectionPanelIndex: number;
16
17
  dstTokenSymbol?: string;
17
18
  hideDstToken?: boolean;
19
+ anyspendQuote?: GetQuoteResponse;
18
20
  }): 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, }) {
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)("span", { className: "text-as-brand text-sm font-medium", 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,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
+ }
@@ -78,71 +78,7 @@ export declare function useAnyspendFlow({ paymentType, recipientAddress, loadOrd
78
78
  globalAddress: string | undefined;
79
79
  hasEnoughBalance: boolean;
80
80
  isBalanceLoading: boolean;
81
- anyspendQuote: {
82
- success: boolean;
83
- message: string;
84
- data: {
85
- operation?: string;
86
- sender?: string;
87
- recipient?: string;
88
- currencyIn?: {
89
- currency?: {
90
- chainId?: number;
91
- address?: string;
92
- symbol?: string;
93
- name?: string;
94
- decimals?: number;
95
- metadata?: {
96
- logoURI?: string;
97
- };
98
- };
99
- amount?: string;
100
- amountFormatted?: string;
101
- amountUsd?: string;
102
- minimumAmount?: string;
103
- };
104
- currencyOut?: {
105
- currency?: {
106
- chainId?: number;
107
- address?: string;
108
- symbol?: string;
109
- name?: string;
110
- decimals?: number;
111
- metadata?: {
112
- logoURI?: string;
113
- };
114
- };
115
- amount?: string;
116
- amountFormatted?: string;
117
- amountUsd?: string;
118
- minimumAmount?: string;
119
- };
120
- totalImpact?: {
121
- usd?: string;
122
- percent?: string;
123
- };
124
- swapImpact?: {
125
- usd?: string;
126
- percent?: string;
127
- };
128
- rate?: string;
129
- slippageTolerance?: {
130
- origin?: {
131
- usd?: string;
132
- value?: string;
133
- percent?: string;
134
- };
135
- destination?: {
136
- usd?: string;
137
- value?: string;
138
- percent?: string;
139
- };
140
- };
141
- timeEstimate?: number;
142
- userBalance?: string;
143
- };
144
- statusCode: number;
145
- } | undefined;
81
+ anyspendQuote: import("../../types/api_req_res").GetQuoteResponse | undefined;
146
82
  isLoadingAnyspendQuote: boolean;
147
83
  getAnyspendQuoteError: Error | null;
148
84
  activeInputAmountInWei: string;
@@ -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; } });
@@ -1,10 +1,17 @@
1
1
  import { paths } from "./api";
2
2
  export type GetOrderAndTxsResponse = paths["/orders/{orderId}"]["get"]["responses"]["200"]["content"]["application/json"];
3
3
  export type GetQuoteRequest = paths["/orders/quote"]["post"]["requestBody"]["content"]["application/json"];
4
- export type GetQuoteResponse = paths["/orders/quote"]["post"]["responses"]["200"]["content"]["application/json"];
4
+ type BaseGetQuoteResponse = paths["/orders/quote"]["post"]["responses"]["200"]["content"]["application/json"];
5
+ export type GetQuoteResponse = BaseGetQuoteResponse & {
6
+ data: BaseGetQuoteResponse["data"] & {
7
+ pointsAmount?: number;
8
+ pointsMultiplier?: number;
9
+ };
10
+ };
5
11
  export type GetCoinbaseOnrampOptionsResponse = paths["/onramp/coinbase/options"]["get"]["responses"]["200"]["content"]["application/json"];
6
12
  export type GetOrderHistoryResponse = paths["/orders"]["get"]["responses"]["200"]["content"]["application/json"];
7
13
  export type GetTokenListResponse = paths["/chains/{chainId}/tokens"]["get"]["responses"]["200"]["content"]["application/json"];
8
14
  export type CreateOrderResponse = paths["/orders"]["post"]["responses"]["200"]["content"]["application/json"];
9
15
  export type GetStripeSupportedResponse = paths["/onramp/stripe/supported"]["get"]["responses"]["200"]["content"]["application/json"];
10
16
  export type GetStripeClientSecret = paths["/stripe/clientSecret"]["get"]["responses"]["200"]["content"]["application/json"];
17
+ export {};
@@ -1,12 +1,12 @@
1
1
  import { PermissionsConfig } from "../../../../global-account/types/permissions";
2
+ import "@reservoir0x/relay-kit-ui/styles.css";
2
3
  import { Account } from "thirdweb/wallets";
3
4
  import { ClientType } from "../../../client-manager";
4
5
  import { B3ContextType } from "./types";
5
- import "@reservoir0x/relay-kit-ui/styles.css";
6
6
  /**
7
7
  * Main B3Provider component
8
8
  */
9
- export declare function B3Provider({ theme, children, accountOverride, environment, automaticallySetFirstEoa, simDuneApiKey, toaster, clientType, rpcUrls, }: {
9
+ export declare function B3Provider({ theme, children, accountOverride, environment, automaticallySetFirstEoa, simDuneApiKey, toaster, clientType, rpcUrls, partnerId, }: {
10
10
  theme: "light" | "dark";
11
11
  children: React.ReactNode;
12
12
  accountOverride?: Account;
@@ -19,6 +19,7 @@ export declare function B3Provider({ theme, children, accountOverride, environme
19
19
  };
20
20
  clientType?: ClientType;
21
21
  rpcUrls?: Record<number, string>;
22
+ partnerId?: string;
22
23
  }): import("react/jsx-runtime").JSX.Element;
23
24
  /**
24
25
  * Inner provider component that provides the actual B3Context
@@ -5,8 +5,13 @@ exports.InnerProvider = InnerProvider;
5
5
  const jsx_runtime_1 = require("react/jsx-runtime");
6
6
  const react_1 = require("../../../../global-account/react");
7
7
  const analytics_1 = require("../../../../global-account/utils/analytics");
8
+ const constants_1 = require("../../../../shared/constants");
8
9
  const supported_1 = require("../../../../shared/constants/chains/supported");
10
+ const debug_1 = require("../../../../shared/utils/debug");
11
+ const thirdweb_1 = require("../../../../shared/utils/thirdweb");
12
+ require("@reservoir0x/relay-kit-ui/styles.css");
9
13
  const react_query_1 = require("@tanstack/react-query");
14
+ const wagmi_adapter_1 = require("@thirdweb-dev/wagmi-adapter");
10
15
  const react_2 = require("react");
11
16
  const sonner_1 = require("sonner");
12
17
  const react_3 = require("thirdweb/react");
@@ -14,7 +19,7 @@ const wagmi_1 = require("wagmi");
14
19
  const client_manager_1 = require("../../../client-manager");
15
20
  const StyleRoot_1 = require("../StyleRoot");
16
21
  const types_1 = require("./types");
17
- require("@reservoir0x/relay-kit-ui/styles.css");
22
+ const debug = (0, debug_1.debugB3React)("B3Provider");
18
23
  /**
19
24
  * Default permissions configuration for B3 provider
20
25
  */
@@ -24,24 +29,12 @@ const DEFAULT_PERMISSIONS = {
24
29
  startDate: new Date(),
25
30
  endDate: new Date(Date.now() + 1000 * 60 * 60 * 24 * 365), // 1 year from now
26
31
  };
27
- /**
28
- * Creates wagmi config with optional custom RPC URLs
29
- * @param rpcUrls - Optional mapping of chain IDs to RPC URLs
30
- */
31
- function createWagmiConfig(rpcUrls) {
32
- return (0, wagmi_1.createConfig)({
33
- chains: [supported_1.supportedChains[0], ...supported_1.supportedChains.slice(1)],
34
- transports: Object.fromEntries(supported_1.supportedChains.map(chain => [chain.id, (0, wagmi_1.http)(rpcUrls?.[chain.id])])),
35
- });
36
- }
37
32
  // Create queryClient instance
38
33
  const queryClient = new react_query_1.QueryClient();
39
34
  /**
40
35
  * Main B3Provider component
41
36
  */
42
- function B3Provider({ theme = "light", children, accountOverride, environment, automaticallySetFirstEoa, simDuneApiKey, toaster, clientType = "rest", rpcUrls, }) {
43
- // Create wagmi config with custom RPC URLs if provided
44
- const [wagmiConfig] = (0, react_2.useState)(() => createWagmiConfig(rpcUrls));
37
+ function B3Provider({ theme = "light", children, accountOverride, environment, automaticallySetFirstEoa, simDuneApiKey, toaster, clientType = "rest", rpcUrls, partnerId, }) {
45
38
  // Initialize Google Analytics on mount
46
39
  (0, react_2.useEffect)(() => {
47
40
  (0, analytics_1.loadGA4Script)();
@@ -50,7 +43,32 @@ function B3Provider({ theme = "light", children, accountOverride, environment, a
50
43
  (0, react_2.useEffect)(() => {
51
44
  (0, client_manager_1.setClientType)(clientType);
52
45
  }, [clientType]);
53
- return ((0, jsx_runtime_1.jsx)(wagmi_1.WagmiProvider, { config: wagmiConfig, children: (0, jsx_runtime_1.jsx)(react_query_1.QueryClientProvider, { client: queryClient, children: (0, jsx_runtime_1.jsx)(react_3.ThirdwebProvider, { children: (0, jsx_runtime_1.jsx)(react_1.TooltipProvider, { children: (0, jsx_runtime_1.jsx)(InnerProvider, { accountOverride: accountOverride, environment: environment, theme: theme, automaticallySetFirstEoa: !!automaticallySetFirstEoa, clientType: clientType, children: (0, jsx_runtime_1.jsxs)(react_1.RelayKitProviderWrapper, { simDuneApiKey: simDuneApiKey, children: [children, (0, jsx_runtime_1.jsx)(StyleRoot_1.StyleRoot, { id: "b3-root" }), (0, jsx_runtime_1.jsx)(sonner_1.Toaster, { theme: theme, position: toaster?.position, style: toaster?.style })] }) }) }) }) }) }));
46
+ const ecocystemConfig = (0, react_2.useMemo)(() => {
47
+ if (!partnerId)
48
+ return undefined;
49
+ return {
50
+ ecosystemId: constants_1.ecosystemWalletId,
51
+ partnerId: partnerId,
52
+ client: thirdweb_1.client,
53
+ };
54
+ }, [partnerId]);
55
+ /**
56
+ * Creates wagmi config with optional custom RPC URLs
57
+ * @param rpcUrls - Optional mapping of chain IDs to RPC URLs
58
+ */
59
+ const wagmiConfig = (0, react_2.useMemo)(() => (0, wagmi_1.createConfig)({
60
+ chains: [supported_1.supportedChains[0], ...supported_1.supportedChains.slice(1)],
61
+ transports: Object.fromEntries(supported_1.supportedChains.map(chain => [chain.id, (0, wagmi_1.http)(rpcUrls?.[chain.id])])),
62
+ connectors: [
63
+ (0, wagmi_adapter_1.inAppWalletConnector)({
64
+ ...(ecocystemConfig || {}),
65
+ client: thirdweb_1.client,
66
+ }),
67
+ // injected(),
68
+ // coinbaseWallet({ appName: "HypeDuel" }),
69
+ ],
70
+ }), [partnerId]);
71
+ return ((0, jsx_runtime_1.jsx)(react_3.ThirdwebProvider, { children: (0, jsx_runtime_1.jsx)(wagmi_1.WagmiProvider, { config: wagmiConfig, children: (0, jsx_runtime_1.jsx)(react_query_1.QueryClientProvider, { client: queryClient, children: (0, jsx_runtime_1.jsx)(react_1.TooltipProvider, { children: (0, jsx_runtime_1.jsx)(InnerProvider, { accountOverride: accountOverride, environment: environment, theme: theme, automaticallySetFirstEoa: !!automaticallySetFirstEoa, clientType: clientType, children: (0, jsx_runtime_1.jsxs)(react_1.RelayKitProviderWrapper, { simDuneApiKey: simDuneApiKey, children: [children, (0, jsx_runtime_1.jsx)(StyleRoot_1.StyleRoot, { id: "b3-root" }), (0, jsx_runtime_1.jsx)(sonner_1.Toaster, { theme: theme, position: toaster?.position, style: toaster?.style })] }) }) }) }) }) }));
54
72
  }
55
73
  /**
56
74
  * Inner provider component that provides the actual B3Context
@@ -61,6 +79,7 @@ function InnerProvider({ children, accountOverride, environment, defaultPermissi
61
79
  const wallets = (0, react_3.useConnectedWallets)();
62
80
  const setActiveWallet = (0, react_3.useSetActiveWallet)();
63
81
  const isAuthenticated = (0, react_1.useAuthStore)(state => state.isAuthenticated);
82
+ debug("@@wallets", wallets);
64
83
  const [user, setUser] = (0, react_2.useState)(() => {
65
84
  // Try to restore user from localStorage on initialization
66
85
  if (typeof window !== "undefined") {
@@ -91,7 +110,7 @@ function InnerProvider({ children, accountOverride, environment, defaultPermissi
91
110
  const setWallet = (0, react_2.useCallback)((wallet) => {
92
111
  setManuallySelectedWallet(wallet);
93
112
  const account = wallet.getAccount();
94
- console.log("@@gio:setWallet", wallet.id, account?.address);
113
+ debug("@@setWallet", wallet.id, account?.address);
95
114
  setActiveWallet(wallet);
96
115
  }, [setManuallySelectedWallet, setActiveWallet]);
97
116
  (0, react_2.useEffect)(() => {
@@ -8,6 +8,7 @@ const thirdweb_1 = require("../../../../../shared/utils/thirdweb");
8
8
  const react_2 = require("react");
9
9
  const react_3 = require("thirdweb/react");
10
10
  const wallets_1 = require("thirdweb/wallets");
11
+ const debug = (0, debug_1.debugB3React)("LoginStepCustom");
11
12
  function LoginStepCustom({ onSuccess, onError, partnerId, chain, strategies, maxInitialWallets = 2, automaticallySetFirstEoa, }) {
12
13
  const [isLoading, setIsLoading] = (0, react_2.useState)(false);
13
14
  const [showAllWallets, setShowAllWallets] = (0, react_2.useState)(false);
@@ -24,7 +25,7 @@ function LoginStepCustom({ onSuccess, onError, partnerId, chain, strategies, max
24
25
  const handleConnect = async (strategy) => {
25
26
  try {
26
27
  setIsLoading(true);
27
- (0, debug_1.debug)("setIsAuthenticating:true:3");
28
+ debug("setIsAuthenticating:true:3");
28
29
  setIsAuthenticating(true);
29
30
  const options = (0, react_1.getConnectOptionsFromStrategy)(strategy);
30
31
  let connectResult;
@@ -45,7 +46,7 @@ function LoginStepCustom({ onSuccess, onError, partnerId, chain, strategies, max
45
46
  connectResult = await connect(options);
46
47
  }
47
48
  const account = connectResult?.getAccount();
48
- console.log("@@gio:connectResult", { connectResult, account, options });
49
+ debug("@@connectResult", { connectResult, account, options });
49
50
  if (!account)
50
51
  throw new Error("Failed to connect");
51
52
  await onSuccess(account);
@@ -58,7 +59,7 @@ function LoginStepCustom({ onSuccess, onError, partnerId, chain, strategies, max
58
59
  }
59
60
  finally {
60
61
  setIsLoading(false);
61
- (0, debug_1.debug)("setIsAuthenticating:false:3");
62
+ debug("setIsAuthenticating:false:3");
62
63
  setIsAuthenticating(false);
63
64
  }
64
65
  };
@@ -122,8 +122,7 @@ function useAuthentication(partnerId, loginWithSiwe) {
122
122
  if (activeWallet) {
123
123
  debug("@@logout:activeWallet", activeWallet);
124
124
  disconnect(activeWallet);
125
- debug("@@logout:disconnected");
126
- console.log("@@gio:logout:activeWallet", activeWallet);
125
+ debug("@@logout:activeWallet", activeWallet);
127
126
  }
128
127
  // Log out of each wallet
129
128
  wallets.forEach(wallet => {
@@ -656,7 +656,7 @@ function AnySpendInner({ destinationTokenAddress, destinationTokenChainId, mode
656
656
  setActivePanel(PanelView.MAIN);
657
657
  setSelectedCryptoPaymentMethod(CryptoPaymentMethodType.NONE); // Reset payment method when going back
658
658
  } })) }) }));
659
- const mainView = (_jsxs("div", { className: "mx-auto flex w-[460px] max-w-full flex-col items-center gap-2", children: [isBuyMode && (_jsxs("div", { className: "mb-4 flex flex-col items-center gap-3 text-center", children: [selectedDstToken.metadata?.logoURI && (_jsx("div", { className: "relative", children: _jsx("img", { src: selectedDstToken.metadata.logoURI, alt: selectedDstToken.symbol, className: "border-as-stroke h-12 w-12 rounded-full border-2 shadow-md" }) })), _jsx("div", { children: _jsxs("h1", { className: "text-as-primary text-xl font-bold", children: ["Buy ", selectedDstToken.symbol] }) })] })), _jsx(TabSection, { activeTab: activeTab, setActiveTab: setActiveTab, setSelectedCryptoPaymentMethod: setSelectedCryptoPaymentMethod, setSelectedFiatPaymentMethod: setSelectedFiatPaymentMethod }), _jsxs("div", { className: "relative flex w-full max-w-[calc(100vw-32px)] flex-col gap-2", children: [activeTab === "crypto" ? (_jsx(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 })) : (_jsx(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: _jsx(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 }) })), _jsx(Button, { variant: "ghost", className: 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: () => {
659
+ const mainView = (_jsxs("div", { className: "mx-auto flex w-[460px] max-w-full flex-col items-center gap-2", children: [isBuyMode && (_jsxs("div", { className: "mb-4 flex flex-col items-center gap-3 text-center", children: [selectedDstToken.metadata?.logoURI && (_jsx("div", { className: "relative", children: _jsx("img", { src: selectedDstToken.metadata.logoURI, alt: selectedDstToken.symbol, className: "border-as-stroke h-12 w-12 rounded-full border-2 shadow-md" }) })), _jsx("div", { children: _jsxs("h1", { className: "text-as-primary text-xl font-bold", children: ["Buy ", selectedDstToken.symbol] }) })] })), _jsx(TabSection, { activeTab: activeTab, setActiveTab: setActiveTab, setSelectedCryptoPaymentMethod: setSelectedCryptoPaymentMethod, setSelectedFiatPaymentMethod: setSelectedFiatPaymentMethod }), _jsxs("div", { className: "relative flex w-full max-w-[calc(100vw-32px)] flex-col gap-2", children: [activeTab === "crypto" ? (_jsx(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 })) : (_jsx(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: _jsx(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 }) })), _jsx(Button, { variant: "ghost", className: 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: () => {
660
660
  if (activeTab === "fiat" || isBuyMode) {
661
661
  return;
662
662
  }