@ape.swap/bonds-sdk 3.0.11 → 3.0.12

package/dist/components/uikit-sdk/TabNav/index.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+interface TabNavProps {
+    activeTab: string;
+    tabOptions: string[];
+    onChangeActiveTab?: (tab: string) => void;
+}
+declare const TabNav: React.FC<TabNavProps>;
+export default TabNav;

package/dist/main.d.ts

@@ -1,9 +1,9 @@
 import Bonds from './views/Bonds';
 import YourBonds from './views/YourBonds';
-import BondModal from './views/BondModal';
+import BuyBondModal from './views/BuyBond';
 import FullBondsView from './views/FullBondsView';
 import ProjectView from './views/ProjectView';
 import { generateImageFromTemplate } from './views/YourBondsModal/components/LinkShare/utils';
 import { ChainId } from '@ape.swap/apeswap-lists';
 import SingleBond from './views/SingleBond';
-export { Bonds, BondModal, YourBonds, FullBondsView, ProjectView, generateImageFromTemplate, ChainId, SingleBond };
+export { Bonds, BuyBondModal, YourBonds, FullBondsView, ProjectView, generateImageFromTemplate, ChainId, SingleBond };

package/dist/main.js

@@ -18028,8 +18028,9 @@ var types = {};
 (function (BillVersion) {
 	  BillVersion['V1'] = 'V1';
 	  BillVersion['V2'] = 'V2';
-	  BillVersion['FixedPrice'] = 'FixedPrice';
 	  BillVersion['V3'] = 'V3';
+	  BillVersion['V4'] = 'V4';
+	  BillVersion['FixedPrice'] = 'FixedPrice';
 	  BillVersion['TieredSale'] = 'TieredSale';
 	  BillVersion['FlashTieredSale'] = 'FlashTieredSale';
 	})((exports.BillVersion || (exports.BillVersion = {})));
@@ -21953,15 +21954,6 @@ function formatUSDNumber(input) {
 const youSpendUSD = (bond, inputValue) => {
     return (parseFloat(inputValue) * parseFloat(bond.principalTokenPrice)).toString();
 };
-// receives depositAmount and returns the payoutTokens the user will receive. IT DOES NOT SUBTRACT FEE
-const getRawPayoutAmount = (bond, inputValue) => {
-    var _a;
-    if (!inputValue || !bond)
-        return 0;
-    const bigValue = new BigNumber$1(inputValue).times(new BigNumber$1(10).pow(18));
-    const billValue = bigValue.div(new BigNumber$1((_a = bond.trueBillPrice) !== null && _a !== void 0 ? _a : 0));
-    return billValue.toNumber();
-};
 // receives depositAmount and returns the payoutTokens the user will receive. IT DOES SUBTRACT FEE
 const getPayoutAmount = (bond, inputValue) => {
     var _a;
@@ -71198,7 +71190,7 @@ const YourBondsMenu = ({ chainFilterOption, setChainFilterOption, filterOptions,
     return (jsxs("div", { className: "bonds-menu", children: [jsx$2(BondFilters, { chainFilterOption: chainFilterOption !== null && chainFilterOption !== void 0 ? chainFilterOption : ['All Chains'], setChainFilterOption: setChainFilterOption, filterOptions: filterOptions, filterOption: filterOption, setFilterOption: setFilterOption, onHandleQueryChange: () => setInputValue('') }), jsxs("div", { className: "table-header-container", children: [jsx$2("div", { className: "search-container", children: jsx$2(Flex$1, { sx: { width: '100%', maxWidth: '300px' }, children: jsx$2(Input, { className: "search-input", value: inputValue, onChange: (event) => setInputValue(event.target.value), variant: "search", sx: { fontWeight: 600, background: 'white2', height: '30px', fontSize: '14px', color: 'white' }, width: '100%', placeholder: 'Search...' }) }) }), jsxs("div", { className: "headers-container", children: [jsxs("div", { className: "your-bonds-table-headers", onClick: () => handleSort('claimable'), children: ["CLAIMABLE", jsx$2(Flex$1, { sx: { ml: '5px' }, children: jsx$2(Svg, { icon: "sort", width: "12px", color: "textDisabledButton" }) })] }), jsxs("div", { className: "your-bonds-table-headers", onClick: () => handleSort('pending'), children: ["PENDING", jsx$2(Flex$1, { sx: { ml: '5px' }, children: jsx$2(Svg, { icon: "sort", width: "12px", color: "textDisabledButton" }) })] }), jsxs("div", { className: "your-bonds-table-headers", onClick: () => handleSort('terms'), children: ["TERMS", jsx$2(Flex$1, { sx: { ml: '5px' }, children: jsx$2(Svg, { icon: "sort", width: "12px", color: "textDisabledButton" }) })] }), jsx$2(Flex$1, { className: "claim-all-button-container", children: SDKConfig.referenceId === 'apebond' && jsx$2(ClaimAll, {}) })] })] })] }));
 };
 
-const YourBonds = () => {
+const YourBonds = ({ showOnly }) => {
     // Hooks
     const { address: account } = useAccount();
     const { data: userBonds, isFetched: userBondsFetched } = useUserBonds();
@@ -71224,6 +71216,13 @@ const YourBonds = () => {
             return [];
         let bondsToReturn = userBonds;
         // Handle Filtering //
+        // Filter Single Token View
+        if (showOnly) {
+            bondsToReturn = bondsToReturn === null || bondsToReturn === void 0 ? void 0 : bondsToReturn.filter((bond) => {
+                var _a, _b, _c;
+                return ((_c = (_b = (_a = bond === null || bond === void 0 ? void 0 : bond.bond) === null || _a === void 0 ? void 0 : _a.earnToken) === null || _b === void 0 ? void 0 : _b.symbol) === null || _c === void 0 ? void 0 : _c.toLowerCase()) === showOnly.toLowerCase();
+            });
+        }
         // Filter by search query
         if (inputValue !== '') {
             bondsToReturn = bondsToReturn === null || bondsToReturn === void 0 ? void 0 : bondsToReturn.filter((bond) => {
@@ -71290,7 +71289,7 @@ const YourBonds = () => {
     const handleFilterOption = useCallback((newOption) => {
         setFilterOption(newOption);
     }, []);
-    return (jsxs(Flex$1, { className: "yourbonds table-container", children: [jsx$2(YourBondsMenu, { chainFilterOption: chainFilterOption, setChainFilterOption: setChainFilterOption, filterOptions: filterOptions, filterOption: filterOption, setFilterOption: handleFilterOption, setInputValue: setInputValue, inputValue: inputValue, handleSort: handleSort }), !account ? (jsx$2(PlaceholderMonkey, { text: 'You are not connected' })) : bondsToRender && (bondsToRender === null || bondsToRender === void 0 ? void 0 : bondsToRender.length) > 0 ? (bondsToRender === null || bondsToRender === void 0 ? void 0 : bondsToRender.map((bill) => jsx$2(UserBondRow, { bill: bill }, bill.id))) : inputValue !== '' || !chainFilterOption.includes('All Chains') ? (jsx$2(PlaceholderMonkey, { text: 'No results, change filters!' })) : userBondsFetched && (userBonds === null || userBonds === void 0 ? void 0 : userBonds.length) === 0 ? (jsxs(Flex$1, { sx: { flexDirection: 'column', justifyContent: 'center', alignItems: 'center', width: '100%', mt: '30px' }, children: [jsx$2(Svg, { icon: "placeholderMonkey" }), jsx$2(Flex$1, { sx: { mt: '15px' }, children: "You do not own any Bonds." })] })) : (jsx$2(Flex$1, { className: "yourbonds-spinner", children: jsx$2(Spinner, { size: 100 }) }))] }));
+    return (jsxs(Flex$1, { className: "yourbonds table-container", children: [!showOnly && (jsx$2(YourBondsMenu, { chainFilterOption: chainFilterOption, setChainFilterOption: setChainFilterOption, filterOptions: filterOptions, filterOption: filterOption, setFilterOption: handleFilterOption, setInputValue: setInputValue, inputValue: inputValue, handleSort: handleSort })), !account ? (jsx$2(PlaceholderMonkey, { text: 'You are not connected' })) : bondsToRender && (bondsToRender === null || bondsToRender === void 0 ? void 0 : bondsToRender.length) > 0 ? (bondsToRender === null || bondsToRender === void 0 ? void 0 : bondsToRender.map((bill) => jsx$2(UserBondRow, { bill: bill }, bill.id))) : inputValue !== '' || !chainFilterOption.includes('All Chains') ? (jsx$2(PlaceholderMonkey, { text: 'No results, change filters!' })) : userBondsFetched && (userBonds === null || userBonds === void 0 ? void 0 : userBonds.length) === 0 ? (jsxs(Flex$1, { sx: { flexDirection: 'column', justifyContent: 'center', alignItems: 'center', width: '100%', mt: '30px' }, children: [jsx$2(Svg, { icon: "placeholderMonkey" }), jsx$2(Flex$1, { sx: { mt: '15px' }, children: showOnly ? `You do not own any ${showOnly.toUpperCase()} Bonds.` : 'You do not own any Bonds' })] })) : (jsx$2(Flex$1, { className: "yourbonds-spinner", children: jsx$2(Spinner, { size: 100 }) }))] }));
 };
 
 // This basically returns the 2 tags with the higher active bond count
@@ -72991,13 +72990,6 @@ const ZapModal = ({ onDismiss, outputToken, account, chainId }) => {
                                         : 'BUY' })) }), jsx$2(Flex, { sx: { marginTop: '10px', justifyContent: 'center' }, children: jsx$2(Link, { href: "https://docs.ape.bond/apebond/products-and-features/zap", target: "_blank", rel: "noopener noreferrer", sx: { textDecoration: 'none' }, children: jsxs(Text, { style: { fontSize: '12px', lineHeight: '18px', fontWeight: 400, borderBottom: '1px solid' }, children: ["Learn more", '>'] }) }) })] })] }));
 };
 
-const AccordionText = ({ isVisible = false }) => {
-    if (!isVisible) {
-        return null;
-    }
-    return (jsxs(Fragment$1, { children: [jsx$2(Flex, { className: "accordion-title", children: "Bonds at Seedify are an exciting new product!" }), jsx$2(AnimatePresence, { children: jsx$2(motion.div, { initial: { height: 0 }, animate: { height: 'fit-content' }, transition: { opacity: { duration: 0.2 } }, exit: { height: 0 }, sx: { overflow: 'hidden', width: '100%' }, children: jsxs(Flex, { className: "accordion-body", sx: { flexDirection: 'column' }, children: [jsx$2(Flex, { sx: { mt: '10px' }, children: "Are you a strong believer in a project? Do you want to buy project tokens at a discount compared to the market? If so, you've arrived at the right place!" }), jsx$2(Flex, { sx: { mt: '10px' }, children: "Bonds allow you to purchase project tokens at a discounted price with a short-term linear vesting. Its a perfect solution for projects you're planning to buy and hold tokens of!" }), jsx$2(Flex, { sx: { mt: '10px' }, children: "When you buy a Bond, you essentially are given an NFT (which you can transfer across your wallets). Whichever wallet owns the NFT will be able to Claim tokens of that project post-purchase until vesting period ends. Bonds at Seedify can range their vesting from 7 Days to 90 Days, with 30 Days being the standard." })] }) }) })] }));
-};
-
 const useSoulZapBondQuote = (typedValue, inputCurrency, bond, account) => {
     var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7, _8, _9, _10, _11;
     const debouncedInput = useDebounce(typedValue, 400);
@@ -73588,7 +73580,7 @@ const BondModalHeader = ({ bondData, onDismiss, showProjectInfoButton, }) => {
             },
         });
     };
-    return (jsxs(Flex, { className: "modaltable-container title-container", sx: { flexDirection: 'column', justifyContent: 'center', alignItems: 'start' }, children: [jsxs(Flex, { className: "slipagge-close-icon", sx: { width: '100%', height: '30px', mb: ['10px', '10px', '10px', '0px'], mt: '-10px' }, children: [jsx$2(Flex, { sx: { display: ['flex', 'flex', 'flex', 'none', 'none'] }, children: jsx$2(BondModalMinTierHeader, { minTier: minTier }) }), jsx$2(Flex, { sx: { flexDirection: 'column', position: 'absolute', right: '0px' }, children: onDismiss ? (jsxs(Fragment$1, { children: [showProjectInfoButton && jsx$2(ExpandedViewButton, { handleNavigation: handleProjectViewNavigation }), jsx$2(IconButton, { icon: "close", color: "text", variant: "transparent", onClick: handleClose }), jsx$2(Flex, { sx: { py: '3px' }, onClick: onOpenSlippageModal, children: jsx$2(Svg, { icon: "cog", width: "16px" }) })] })) : (jsx$2(Flex, { sx: { py: '3px' }, onClick: onOpenSlippageModal, children: jsx$2(Svg, { icon: "cog", width: "16px" }) })) })] }), jsxs(Flex, { sx: { width: '100%' }, children: [jsx$2(Flex, { className: "title-container bondicon", children: jsx$2(TokenImage, { symbol: (_a = bondData.showcaseTokenName) !== null && _a !== void 0 ? _a : bondData.earnToken.symbol, size: 50, chain: bondData.chainId }) }), jsxs(Flex, { className: "title-container bondname", children: [bondData === null || bondData === void 0 ? void 0 : bondData.showcaseTokenName, jsx$2(ListTag, { text: (_b = bondData === null || bondData === void 0 ? void 0 : bondData.tags) === null || _b === void 0 ? void 0 : _b[0] })] }), jsxs(Flex, { className: "title-container price-container", sx: { flexDirection: 'column', paddingLeft: '20px' }, children: [jsxs(Flex, { className: "price-container price", children: ["$", earnTokenPrice(bondData)] }), jsxs(Flex, { className: "price-container discounted", children: ["$", discountEarnTokenPrice(bondData)] })] }), jsx$2(Flex, { sx: { display: ['none', 'none', 'none', 'flex', 'flex'], ml: '10px' }, children: jsx$2(BondModalMinTierHeader, { minTier: minTier }) })] })] }));
+    return (jsxs(Flex, { className: "modaltable-container title-container", sx: { flexDirection: 'column', justifyContent: 'center', alignItems: 'start' }, children: [jsxs(Flex, { className: "slipagge-close-icon", sx: { width: '100%', height: '30px', mb: ['10px', '10px', '10px', '0px'] }, children: [jsx$2(Flex, { sx: { display: ['flex', 'flex', 'flex', 'none', 'none'] }, children: jsx$2(BondModalMinTierHeader, { minTier: minTier }) }), jsx$2(Flex, { sx: { flexDirection: 'column', position: 'absolute', right: '0px' }, children: onDismiss ? (jsxs(Fragment$1, { children: [showProjectInfoButton && jsx$2(ExpandedViewButton, { handleNavigation: handleProjectViewNavigation }), jsx$2(IconButton, { icon: "close", color: "text", variant: "transparent", onClick: handleClose }), jsx$2(Flex, { sx: { py: '3px' }, onClick: onOpenSlippageModal, children: jsx$2(Svg, { icon: "cog", width: "16px" }) })] })) : (jsx$2(Flex, { sx: { py: '3px', mt: '10px' }, onClick: onOpenSlippageModal, children: jsx$2(Svg, { icon: "cog", width: "16px" }) })) })] }), jsxs(Flex, { sx: { width: '100%' }, children: [jsx$2(Flex, { className: "title-container bondicon", children: jsx$2(TokenImage, { symbol: (_a = bondData.showcaseTokenName) !== null && _a !== void 0 ? _a : bondData.earnToken.symbol, size: 50, chain: bondData.chainId }) }), jsxs(Flex, { className: "title-container bondname", children: [bondData === null || bondData === void 0 ? void 0 : bondData.showcaseTokenName, jsx$2(ListTag, { text: (_b = bondData === null || bondData === void 0 ? void 0 : bondData.tags) === null || _b === void 0 ? void 0 : _b[0] })] }), jsxs(Flex, { className: "title-container price-container", sx: { flexDirection: 'column', paddingLeft: '20px' }, children: [jsxs(Flex, { className: "price-container price", children: ["$", earnTokenPrice(bondData)] }), jsxs(Flex, { className: "price-container discounted", children: ["$", discountEarnTokenPrice(bondData)] })] }), jsx$2(Flex, { sx: { display: ['none', 'none', 'none', 'flex', 'flex'], ml: '10px' }, children: jsx$2(BondModalMinTierHeader, { minTier: minTier }) })] })] }));
 };
 
 const BondCards = ({ bondData }) => {
@@ -73646,7 +73638,7 @@ const Estimations = ({ depositAmount, bondData, youSpendString, isZap, fetchingZ
     const feeUSD = fee * parseFloat((_a = bondData === null || bondData === void 0 ? void 0 : bondData.payoutTokenPrice) !== null && _a !== void 0 ? _a : '0');
     const estimatedOutputAmount = getPayoutAmount(bondData, depositAmount);
     const estimatedOutputUSD = estimatedOutputAmount * parseFloat((_b = bondData === null || bondData === void 0 ? void 0 : bondData.payoutTokenPrice) !== null && _b !== void 0 ? _b : '0');
-    return (jsxs(Flex, { className: "modaltable-container text-container", children: [jsxs(Flex, { className: "text-container row", children: [jsx$2(Flex, { className: "row-container spend", children: "You Spend:" }), jsx$2(Flex, { className: "row-container spend-val", children: youSpendString })] }), jsxs(Flex, { className: "text-container row", children: [jsxs(Flex, { className: "row-container premium", children: ["Bonus:", jsx$2(TooltipBubble, { className: "tooltip-bubble", body: jsx$2(Flex, { children: TooltipText.Premium }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, -5%)", children: jsx$2(Flex, { className: "row-container premium-icon", children: jsx$2(Svg, { icon: "questionCircle", width: "12px" }) }) })] }), isZap && fetchingZapQuote ? (jsx$2(Dots, {})) : isZap && zapError ? ('-') : (jsxs(Flex, { className: `row-container premium-val ${getBonusColor(bonusString)}`, children: ["$ ", formatUSDNumber(bonusString)] }))] }), bondData.feeInPayout && (jsxs(Flex, { className: "text-container row", children: [jsxs(Flex, { className: "row-container premium", children: ["Fee:", jsx$2(TooltipBubble, { className: "tooltip-bubble", body: jsx$2(Flex, { children: TooltipText.Fee }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, -5%)", children: jsx$2(Flex, { className: "row-container premium-icon", children: jsx$2(Svg, { icon: "questionCircle", width: "12px" }) }) })] }), jsxs(Flex, { className: `row-container premium-val`, children: ["$ ", formatUSDNumber(feeUSD.toString())] })] })), jsxs(Flex, { className: "text-container row", children: [jsxs(Flex, { className: "row-container get", children: ["You Get (over ", vestingTime(((_c = bondData === null || bondData === void 0 ? void 0 : bondData.vestingTerm) !== null && _c !== void 0 ? _c : 0) - ((_d = bondData.vestingCliff) !== null && _d !== void 0 ? _d : 0)).days, " days):"] }), isZap && fetchingZapQuote ? (jsx$2(Dots, {})) : isZap && zapError ? ('-') : (jsxs(Flex, { className: "row-container get-val", children: [formatNumber$2(estimatedOutputAmount.toString()), " ", bondData === null || bondData === void 0 ? void 0 : bondData.showcaseTokenName, " = $", ' ', formatUSDNumber(estimatedOutputUSD.toString())] }))] })] }));
+    return (jsxs(Flex, { className: "modaltable-container text-container", children: [jsxs(Flex, { className: "text-container row", children: [jsx$2(Flex, { className: "row-container spend", children: "You Spend:" }), jsx$2(Flex, { className: "row-container spend-val", children: youSpendString })] }), jsxs(Flex, { className: "text-container row", children: [jsxs(Flex, { className: "row-container premium", children: ["Bonus:", jsx$2(TooltipBubble, { className: "tooltip-bubble", body: jsx$2(Flex, { children: TooltipText.Premium }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, -5%)", children: jsx$2(Flex, { className: "row-container premium-icon", children: jsx$2(Svg, { icon: "questionCircle", width: "12px" }) }) })] }), isZap && fetchingZapQuote ? (jsx$2(Dots, {})) : isZap && zapError ? ('-') : (jsxs(Flex, { className: `row-container premium-val ${getBonusColor(bonusString)}`, children: ["$ ", formatUSDNumber(bonusString)] }))] }), !!bondData.feeInPayout && (jsxs(Flex, { className: "text-container row", children: [jsxs(Flex, { className: "row-container premium", children: ["Fee:", jsx$2(TooltipBubble, { className: "tooltip-bubble", body: jsx$2(Flex, { children: TooltipText.Fee }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, -5%)", children: jsx$2(Flex, { className: "row-container premium-icon", children: jsx$2(Svg, { icon: "questionCircle", width: "12px" }) }) })] }), jsxs(Flex, { className: `row-container premium-val`, children: ["$ ", formatUSDNumber(feeUSD.toString())] })] })), jsxs(Flex, { className: "text-container row", children: [jsxs(Flex, { className: "row-container get", children: ["You Get (over ", vestingTime(((_c = bondData === null || bondData === void 0 ? void 0 : bondData.vestingTerm) !== null && _c !== void 0 ? _c : 0) - ((_d = bondData.vestingCliff) !== null && _d !== void 0 ? _d : 0)).days, " days):"] }), isZap && fetchingZapQuote ? (jsx$2(Dots, {})) : isZap && zapError ? ('-') : (jsxs(Flex, { className: "row-container get-val", children: [formatNumber$2(estimatedOutputAmount.toString()), " ", bondData === null || bondData === void 0 ? void 0 : bondData.showcaseTokenName, " = $", ' ', formatUSDNumber(estimatedOutputUSD.toString())] }))] })] }));
 };
 
 // Custom HTML sanitizer
@@ -73694,68 +73686,6 @@ const ProjectDescription = ({ description }) => {
                         }, onClick: () => setIsOpen(true), children: ["View More ", '>'] }))] }), jsx$2(Flex, { sx: { display: ['none', 'none', 'none', 'flex'] }, children: jsx$2(SafeHTMLComponent, { html: description !== null && description !== void 0 ? description : '' }) })] }));
 };
 
-const BondModalHeaderAlt = ({ bondData, onDismiss, showProjectInfoButton, }) => {
-    var _a, _b, _c, _d, _e, _f;
-    const [onOpenSlippageModal] = useModal(jsx$2(SlippageModal, {}));
-    const handleClose = () => {
-        if (typeof window !== 'undefined') {
-            window.history.pushState({}, '', `/bonds`);
-        }
-        onDismiss === null || onDismiss === void 0 ? void 0 : onDismiss();
-    };
-    // const handleProjectViewNavigation = () => {
-    //   window.open(`${window.location.origin}/bonds/${bondData.billAddress}/${bondData.chainId}`, '_self')
-    //   track({
-    //     event: 'projectInfoClick',
-    //     chain: bondData.chainId,
-    //     data: {
-    //       cat: 'Modal',
-    //       bond: bondData.earnToken.symbol,
-    //       bondChain: bondData.chainId,
-    //     },
-    //   })
-    // }
-    return (jsx$2(Flex, { className: "modaltable-container title-container", children: jsx$2(Flex, { className: "slipagge-close-icons", sx: { flexDirection: 'row' }, children: onDismiss ? (jsxs(Fragment$1, { children: [jsx$2(TooltipBubble, { className: "tooltip-bubble", body: jsx$2(BondInfoTooltip, { earnTokenContract: (_c = (_b = (_a = bondData === null || bondData === void 0 ? void 0 : bondData.earnToken) === null || _a === void 0 ? void 0 : _a.address) === null || _b === void 0 ? void 0 : _b[bondData === null || bondData === void 0 ? void 0 : bondData.chainId]) !== null && _c !== void 0 ? _c : '', earnTokenSymbol: (_e = (_d = bondData === null || bondData === void 0 ? void 0 : bondData.earnToken) === null || _d === void 0 ? void 0 : _d.symbol) !== null && _e !== void 0 ? _e : '', bondContract: (_f = bondData.billAddress) !== null && _f !== void 0 ? _f : '', projectLink: bondData === null || bondData === void 0 ? void 0 : bondData.projectLink, twitter: bondData === null || bondData === void 0 ? void 0 : bondData.twitter, audit: bondData === null || bondData === void 0 ? void 0 : bondData.audit, chain: bondData === null || bondData === void 0 ? void 0 : bondData.chainId }), width: "205px", placement: "bottomRight", transformTip: "translate(7%, -2%)", children: jsx$2(Flex, { className: "more-icon", sx: { opacity: 0.8 }, children: jsx$2(Svg, { icon: "more", width: "25px" }) }) }), jsx$2(Flex, { sx: { pr: '10px' }, onClick: onOpenSlippageModal, children: jsx$2(Svg, { icon: "cog", width: "16px" }) }), jsx$2(IconButton, { icon: "close", color: "text", variant: "transparent", onClick: handleClose })] })) : (jsx$2(Flex, { sx: {}, onClick: onOpenSlippageModal, children: jsx$2(Svg, { icon: "cog", width: "16px" }) })) }) }));
-};
-
-const ImageAndShortDescription = ({ bondData, onDismiss }) => {
-    var _a;
-    const SDKConfig = useSDKConfig();
-    // Swiper logic for the alt view
-    const [activeSlide, setActiveSlide] = useState(0);
-    const { swiper, setSwiper } = useSwiper();
-    const imagesLength = 3;
-    const handleSlide = (event) => {
-        const slideNumber = getDotPos(event.activeIndex, imagesLength);
-        setActiveSlide(slideNumber);
-    };
-    const slideTo = (index) => {
-        setActiveSlide(index);
-        swiper === null || swiper === void 0 ? void 0 : swiper.slideTo(index);
-    };
-    return (jsxs(Flex, { sx: { maxWidth: ['unset', 'unset', 'unset', '500px'], flexDirection: 'column', alignItems: 'center' }, children: [jsxs(Flex, { sx: {
-                    flexDirection: 'column',
-                    width: '100%',
-                    alignItems: 'center',
-                    overflow: 'hidden',
-                    position: 'relative',
-                }, children: [jsxs(Swiper, { id: "hotbondsSweper", onSwiper: setSwiper, slidesPerView: "auto", centeredSlides: true, lazy: true, preloadImages: false, onSlideChange: handleSlide, style: { width: '100%', overflow: 'visible' }, children: [jsx$2(SwiperSlide, { style: {
-                                    width: '100%',
-                                    display: 'flex',
-                                    justifyContent: 'center',
-                                }, children: jsx$2("img", { className: "project-image", src: "https://placehold.co/400x200" }) }, 0), jsx$2(SwiperSlide, { style: {
-                                    width: '100%',
-                                    display: 'flex',
-                                    justifyContent: 'center',
-                                }, children: jsx$2("img", { className: "project-image", src: "https://placehold.co/400x200" }) }, 1), jsx$2(SwiperSlide, { style: {
-                                    width: '100%',
-                                    display: 'flex',
-                                    justifyContent: 'center',
-                                }, children: jsx$2("img", { className: "project-image", src: "https://placehold.co/400x200" }) }, 2)] }), jsx$2(Flex, { sx: { position: 'absolute', bottom: ['15px', '15px', '15px', '20px'], left: 'calc(50% - 28,5px)', zIndex: 2 }, children: [...Array(imagesLength)].map((_, i) => {
-                            return jsx$2(SwiperDots, { isActive: i === activeSlide, onClick: () => slideTo(i) }, i);
-                        }) })] }), jsxs(Flex, { sx: { alignItems: 'center', display: ['flex', 'flex', 'flex', 'none'], p: '10px', width: '100%' }, children: [jsxs(Flex, { sx: { width: ['50%', '50%', '50%', '100%'], alignItems: 'center' }, children: [jsx$2(Flex, { sx: { mr: '5px' }, children: jsx$2(TokenImage, { symbol: (_a = bondData.showcaseTokenName) !== null && _a !== void 0 ? _a : bondData.earnToken.symbol, size: 30, chain: bondData.chainId }) }), jsxs("h2", { className: "modal-tokenname-chainicon", sx: { margin: '0px' }, children: [bondData === null || bondData === void 0 ? void 0 : bondData.showcaseTokenName, ' '] })] }), jsx$2(Flex, { className: "modal-marketprice-header", sx: { justifyContent: 'flex-end', alignItems: 'center' }, children: jsxs("span", { className: "modal-marketprice", children: ["Market Price: $", earnTokenPrice(bondData)] }) }), jsx$2(Flex, { className: "bondmodal-header-alt", sx: { mb: '10px' }, children: jsx$2(BondModalHeaderAlt, { bondData: bondData, onDismiss: onDismiss, showProjectInfoButton: (SDKConfig === null || SDKConfig === void 0 ? void 0 : SDKConfig.referenceId) === 'apebond' }) })] }), jsx$2(Flex, { className: "description-container paragraph-spaced", sx: { px: '10px', opacity: 0.7, mt: ['0', '0', '0', '10px'] }, children: jsx$2(ProjectDescription, { description: bondData === null || bondData === void 0 ? void 0 : bondData.shortDescription }) })] }));
-};
-
 // Fetch country code to check if the region is allowed
 const fetchLocation = (apiv2URL) => __awaiter$9(void 0, void 0, void 0, function* () {
     const resp = yield axios.get(`${apiv2URL}/check`);
@@ -73838,13 +73768,10 @@ const NoBonusModal = ({ onAcknowledge, showcaseTokenName }) => {
     return (isOpen && (jsxs(Modal, { className: "nobonus-modal", title: "Warning", onClose: handleAcknowledge, children: [jsxs("p", { children: ["You're buying ", showcaseTokenName, " at a higher price than the market, which will result in receiving fewer tokens compared to swapping via an exchange."] }), jsx$2("p", { children: "You will not receive any bonus tokens when buying this bond." }), jsxs(Flex, { className: "nobonus-checkbox-row", sx: { flexDirection: 'row', gap: '8px', pb: '20px' }, children: [jsx$2(Flex, { className: "nobonus-checkbox", children: jsx$2(Checkbox, { onChange: handleCheckboxChange }) }), jsx$2(Flex, { className: "nobonus-checkbox-text", children: "I understand and want to proceed." })] }), jsxs(Flex, { className: "nobonus-actions", sx: { flexDirection: 'row', gap: '8px' }, children: [jsx$2(Button, { classname: "nobonus-cancel", onClick: handleCancel, sx: { width: '100%', justifyContent: 'center' }, variant: "secondary", children: "Cancel" }), jsx$2(Button, { className: "nobonus-buy", onClick: handleAcknowledge, disabled: !isChecked, sx: { width: '100%', justifyContent: 'center' }, children: "Buy" })] })] })));
 };
 
-const BondModal = ({ onDismiss, bondAddress, bondChain, handlePurchasedBond }) => {
-    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
+const BuyBond = ({ onDismiss, bondAddress, bondChain, handlePurchasedBond }) => {
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
     const SDKConfig = useSDKConfig();
     const { data: geoData } = useGeoFencing();
-    // State
-    const [modalVariant, setModalVariant] = useState(SDKConfig === null || SDKConfig === void 0 ? void 0 : SDKConfig.modalVariant);
-    const [accordionVisible, setAccordionVisible] = useState(false);
     // Hooks
     const userChainId = useChainId();
     const { address: account } = useAccount();
@@ -74077,48 +74004,24 @@ const BondModal = ({ onDismiss, bondAddress, bondChain, handlePurchasedBond }) =
             console.log('change to native');
         }
     }, [inputCurrencyBalance]);
-    return (jsx$2(Modal, { className: "modal", onDismiss: onDismiss, sx: { width: '400px' }, children: modalVariant === 'standard' ? (jsx$2(Fragment$1, { children: bondData && (jsxs(Flex, { className: "modal-content", children: [typeof window !== 'undefined' && window.location.origin === 'http://localhost:5173' && (jsxs(Text, { sx: { borderBottom: '1px solid white', fontSize: '14px', mb: '10px' }, children: ["Dev mode - Current view: \"standard\"", jsx$2(Text, { onClick: () => setModalVariant('alt'), sx: { ml: '15px', textDecoration: 'underline', cursor: 'pointer' }, children: "Switch view" })] })), jsxs(Flex, { className: "modaltable-container", children: [jsx$2(BondModalHeader, { bondData: bondData, onDismiss: onDismiss, showProjectInfoButton: (SDKConfig === null || SDKConfig === void 0 ? void 0 : SDKConfig.referenceId) === 'apebond' }), jsx$2(ProjectDescription, { description: bondData.shortDescription }), jsx$2(BondCards, { bondData: bondData }), jsx$2(Estimations, { depositAmount: depositAmount, bondData: bondData, youSpendString: youSpendString, isZap: isZap, fetchingZapQuote: fetchingZapQuote, zapError: zapError }), jsx$2(TokenSelectorPanel, { typedValue: inputValue, setTypedValue: setInputValue, selectedToken: inputToken, handleValueBtn: () => { var _a; return setInputValue((_a = new BigNumber$1(inputCurrencyBalance !== null && inputCurrencyBalance !== void 0 ? inputCurrencyBalance : '0')) === null || _a === void 0 ? void 0 : _a.toString()); }, handleCurrencySelect: handleCurrencySelect, chainId: bondData === null || bondData === void 0 ? void 0 : bondData.chainId, enableZap: supportedByLIFI.includes(bondData === null || bondData === void 0 ? void 0 : bondData.chainId), bondPrincipalToken: bondData === null || bondData === void 0 ? void 0 : bondData.lpToken, tokenBalance: inputCurrencyBalance, selectedTokenPrice: inputTokenPrice === null || inputTokenPrice === void 0 ? void 0 : inputTokenPrice.price, inputDisabled: minTier !== null && (!userTier || userTier < minTier) ? true : false }), minTier !== null && jsx$2(TagMinTierBond, { userTier: userTier, minTier: minTier }), jsxs(Flex, { className: "modaltable-container button-container", children: [account && (minTier === null || (minTier !== null && userTier !== null && userTier >= minTier)) && (jsx$2(Flex, { className: "button-container get", children: jsxs(Button, { className: "action-button", onClick: () => supportedByLIFI.includes(bondData === null || bondData === void 0 ? void 0 : bondData.chainId) ? handleOpenZapModal() : openExternal(), variant: "secondary", fullWidth: true, children: ["Get ", getSymbol(bondData === null || bondData === void 0 ? void 0 : bondData.lpToken)] }) })), jsx$2(Flex, { className: "button-container buy", children: !account ? (jsx$2(ConnectButton, {})) : minTier !== null && (!userTier || userTier < minTier) ? (jsx$2(Button, { className: "action-button", onClick: () => window.open(`https://www.ape.bond/tier-staking`, '_blank'), children: "GET YOUR TIER" })) : userChainId !== bondData.chainId ? (jsx$2(Button, { className: "action-button", disabled: loadingTx || isConfirming || (bondData === null || bondData === void 0 ? void 0 : bondData.soldOut), onClick: (event) => {
-                                                event.stopPropagation();
-                                                switchChain({ chainId: bondData.chainId });
-                                            }, style: { fontSize: '14px', padding: '6px', marginLeft: '0px' }, children: `Switch to ${NETWORK_LABEL[bondData.chainId]}` })) : approvalState === ApprovalState.APPROVED ? (jsx$2(Button, { className: "action-button", load: load || fetchingZapQuote, disabled: load ||
-                                                (bondData === null || bondData === void 0 ? void 0 : bondData.soldOut) ||
-                                                !account ||
-                                                !inputValue ||
-                                                parseFloat(inputValue) === 0 ||
-                                                fetchingZapQuote ||
-                                                zapError, onClick: handleOpenModal, children: zapError ? 'something went wrong' : `buy` })) : (jsx$2(Button, { className: "action-button", load: approvalState === ApprovalState.PENDING, disabled: approvalState === ApprovalState.PENDING ||
-                                                (bondData === null || bondData === void 0 ? void 0 : bondData.soldOut) ||
-                                                !account ||
-                                                !inputValue ||
-                                                parseFloat(inputValue) === 0, onClick: handleApprove, children: "enable" })) })] })] })] })) })) : (jsx$2(Fragment$1, { children: bondData && (jsxs(Fragment$1, { children: [jsxs(Flex, { className: "modal-content font-small", children: [typeof window !== 'undefined' && window.location.origin === 'http://localhost:5173' && (jsxs(Text, { sx: { borderBottom: '1px solid white' }, children: ["Dev Mode - Current view: \"alt\"", jsx$2(Text, { onClick: () => setModalVariant('standard'), sx: { ml: '15px', textDecoration: 'underline', cursor: 'pointer' }, children: "Switch view" })] })), jsxs(Flex, { className: "modaltable-container", sx: { flexDirection: 'row', gap: ['0px', '0px', '0px', '20px'] }, children: [jsx$2(ImageAndShortDescription, { bondData: bondData, onDismiss: onDismiss }), jsxs(Flex, { sx: { flexDirection: 'column', width: '600px' }, children: [jsxs(Flex, { sx: { alignItems: 'center', display: ['none', 'none', 'none', 'flex'] }, children: [jsx$2(Flex, { sx: { width: ['50%', '50%', '50%', '50%'], ml: ['0px', '0px', '0px', '10px'] }, children: jsxs(Flex, { className: "modal-tokenname-chainicon", sx: { margin: '0px' }, children: [jsx$2(Flex, { sx: { fontSize: '26px', fontWeight: 700, mr: '4px' }, children: bondData === null || bondData === void 0 ? void 0 : bondData.showcaseTokenName }), jsx$2(Svg, { width: 20, height: 20, icon: (_l = NETWORK_ICONS === null || NETWORK_ICONS === void 0 ? void 0 : NETWORK_ICONS[bondData.chainId]) !== null && _l !== void 0 ? _l : 'question' })] }) }), jsxs(Flex, { className: "modal-marketprice-header", sx: { justifyContent: 'space-between', width: '100%', alignItems: 'center' }, children: [jsx$2(TokenImage, { symbol: (_m = bondData.showcaseTokenName) !== null && _m !== void 0 ? _m : bondData.earnToken.symbol, size: 30 }), jsx$2("span", { className: "modal-marketprice-token", children: bondData.earnToken.symbol }), jsx$2("hr", { className: "fading-hr rotate-hr" }), jsxs("span", { className: "modal-marketprice", children: ["Market Price: $", earnTokenPrice(bondData)] }), jsx$2("hr", { className: "fading-hr rotate-hr" })] }), jsx$2(Flex, { className: "bondmodal-header-alt", sx: { mb: '10px' }, children: jsx$2(BondModalHeaderAlt, { bondData: bondData, onDismiss: onDismiss, showProjectInfoButton: (SDKConfig === null || SDKConfig === void 0 ? void 0 : SDKConfig.referenceId) === 'apebond' }) })] }), jsxs(Flex, { sx: { flexDirection: 'column', marginTop: '20px', mx: '10px' }, children: [jsx$2(TokenSelectorPanel, { typedValue: inputValue, setTypedValue: setInputValue, selectedToken: inputToken, handleValueBtn: (value) => setInputValue(value), handleCurrencySelect: handleCurrencySelect, chainId: bondData === null || bondData === void 0 ? void 0 : bondData.chainId, enableZap: true, bondPrincipalToken: bondData === null || bondData === void 0 ? void 0 : bondData.lpToken, tokenBalance: inputCurrencyBalance, selectedTokenPrice: inputTokenPrice === null || inputTokenPrice === void 0 ? void 0 : inputTokenPrice.price, modalVariant: modalVariant }), jsxs(Flex, { className: "modal-youreceive-row", sx: { justifyContent: 'space-between', alignItems: 'center', fontSize: '14px' }, children: [jsxs(Flex, { className: "modal-youreceive-textbox", children: [jsx$2(Flex, { sx: { opacity: 0.8 }, children: "You will receive:" }), jsxs(Flex, { children: [jsx$2(Flex, { className: "modal-youreceive-tokenimage", sx: { marginLeft: '15px', marginRight: '5px' }, children: jsx$2(TokenImage, { symbol: (_o = bondData.showcaseTokenName) !== null && _o !== void 0 ? _o : bondData.earnToken.symbol, size: 20 }) }), jsxs(Flex, { className: "modal-receive-text", sx: { opacity: 0.8 }, children: [formatNumber$2((lodashExports.toNumber(inputValue) / lodashExports.toNumber(earnTokenPrice(bondData))).toFixed(0)), ' ', bondData.earnToken.symbol, " + \u00A0", formatNumber$2((getRawPayoutAmount(bondData, inputValue) -
-                                                                                        lodashExports.toNumber(inputValue) / lodashExports.toNumber(earnTokenPrice(bondData))).toFixed(0))] }), jsx$2("span", { className: "text-highlight", children: "\u00A0Additional" })] })] }), jsx$2(Flex, { className: "button-container buy", sx: { justifyContent: 'end' }, children: !account ? (jsx$2(ConnectButton, {})) : userChainId !== bondData.chainId ? (jsx$2(Button, { className: "action-button", disabled: loadingTx || isConfirming || (bondData === null || bondData === void 0 ? void 0 : bondData.soldOut), onClick: (event) => {
-                                                                        event.stopPropagation();
-                                                                        switchChain({ chainId: bondData.chainId });
-                                                                    }, children: `Switch Chain` })) : approvalState === ApprovalState.APPROVED ? (jsxs(Button, { className: "action-button", load: load, disabled: load || (bondData === null || bondData === void 0 ? void 0 : bondData.soldOut) || !account || !inputValue || parseFloat(inputValue) === 0, onClick: handleBothPurchases, children: ["buy", ' ', isZap ? (jsx$2("span", { style: { marginLeft: '8px' }, children: jsx$2(Svg, { icon: "ZapIcon" }) })) : ('')] })) : (jsx$2(Button, { className: "action-button", load: approvalState === ApprovalState.PENDING, disabled: approvalState === ApprovalState.PENDING ||
-                                                                        (bondData === null || bondData === void 0 ? void 0 : bondData.soldOut) ||
-                                                                        !account ||
-                                                                        !inputValue ||
-                                                                        parseFloat(inputValue) === 0, onClick: handleApprove, children: "enable" })) })] }), jsx$2(Flex, { sx: { width: '100%', margin: ['0', '0', '0', '10px 0'] }, children: jsx$2("hr", { className: "fading-hr" }) }), jsxs(Flex, { sx: { width: '100%', fontSize: '14px', display: ['none', 'none', 'none', 'flex'] }, children: [jsxs(Flex, { sx: { width: '50%', flexDirection: 'column', opacity: 0.8 }, children: ["Market Price: $", formatUSDNumber((getRawPayoutAmount(bondData, inputValue) * lodashExports.toNumber(earnTokenPrice(bondData))).toString()), jsx$2("hr", { className: "fading-hr" }), jsx$2("span", { className: "text-highlight flex-inline", children: "Our price: " }), jsxs("span", { className: "flex-inline", children: ["$", formatUSDNumber((lodashExports.toNumber(inputValue) * lodashExports.toNumber(bondData.principalTokenPrice)).toString()), ' '] }), jsxs("span", { className: "text-highlight flex-inline", children: ["(discount rate ", bondData === null || bondData === void 0 ? void 0 : bondData.discount.toFixed(2), "%)"] })] }), jsx$2(Flex, { sx: { width: '50px', alignItems: 'center', justifyContent: 'center' }, children: "vs." }), jsxs(Flex, { sx: { width: '50%', flexDirection: 'column', opacity: 0.8 }, children: ["If purchased from market:", ' ', formatNumber$2((lodashExports.toNumber(inputValue) / lodashExports.toNumber(earnTokenPrice(bondData))).toFixed(0)), ' ', bondData.earnToken.symbol, jsx$2("hr", { className: "fading-hr" }), jsx$2("span", { className: "text-highlight flex-inline", children: "Amount you will get:" }), ' ', formatNumber$2(getRawPayoutAmount(bondData, inputValue).toFixed(0)), ' ', jsx$2("span", { className: "flex-inline", children: bondData.earnToken.symbol })] })] }), jsxs(Flex, { sx: {
-                                                            width: '100%',
-                                                            fontSize: '14px',
-                                                            display: ['flex', 'flex', 'flex', 'none'],
-                                                            flexDirection: 'column',
-                                                        }, children: [jsxs(Flex, { sx: { opacity: 0.8 }, children: ["Market Price: $", formatUSDNumber((getRawPayoutAmount(bondData, inputValue) * lodashExports.toNumber(earnTokenPrice(bondData))).toString())] }), jsxs(Flex, { sx: { opacity: 0.8 }, children: ["If purchased from market:", ' ', formatNumber$2((lodashExports.toNumber(inputValue) / lodashExports.toNumber(earnTokenPrice(bondData))).toFixed(0)), ' ', bondData.earnToken.symbol] }), jsxs(Flex, { sx: { mt: '10px' }, children: [jsx$2("span", { className: "text-highlight flex-inline", children: "Our price: " }), jsxs("span", { className: "flex-inline", children: ["$", formatUSDNumber((lodashExports.toNumber(inputValue) * lodashExports.toNumber(bondData.principalTokenPrice)).toString()), ' '] }), jsxs("span", { className: "text-highlight flex-inline", children: ["(discount rate ", bondData === null || bondData === void 0 ? void 0 : bondData.discount.toFixed(2), "%)"] })] }), jsxs(Flex, { sx: { mt: '10px' }, children: [jsx$2("span", { className: "text-highlight flex-inline", children: "Amount you will get:" }), ' ', formatNumber$2(getRawPayoutAmount(bondData, inputValue).toFixed(0)), ' ', jsx$2("span", { className: "flex-inline", children: bondData.earnToken.symbol })] })] })] })] })] }), jsxs(Flex, { className: "footer-details", children: [jsxs(Flex, { sx: { width: '100%', flexDirection: 'row', justifyContent: 'space-around' }, children: [jsxs(Flex, { sx: {
-                                                    width: '100%',
-                                                    justifyContent: 'center',
-                                                    flexDirection: ['column', 'column', 'column', 'row'],
-                                                }, children: [jsx$2(Flex, { className: "modal-footer-header", children: "Vesting start Date:\u00A0" }), jsxs(Flex, { children: [' ', new Intl.DateTimeFormat('en-GB', { day: '2-digit', month: 'short', year: 'numeric' }).format(new Date())] })] }), jsxs(Flex, { sx: {
-                                                    width: '100%',
-                                                    justifyContent: 'center',
-                                                    flexDirection: ['column', 'column', 'column', 'row'],
-                                                }, children: [jsx$2(Flex, { className: "modal-footer-header", sx: { justifyContent: ['flex-end', 'flex-end', 'flex-end', 'flex-start'] }, children: "Vesting end Date:\u00A0" }), jsxs(Flex, { sx: { justifyContent: ['flex-end', 'flex-end', 'flex-end', 'flex-start'] }, children: [' ', new Intl.DateTimeFormat('en-GB', { day: '2-digit', month: 'short', year: 'numeric' }).format(new Date(Date.now() + vestingTime((_p = bondData === null || bondData === void 0 ? void 0 : bondData.vestingTerm) !== null && _p !== void 0 ? _p : 0).days * 86400000))] })] })] }), jsx$2("hr", { className: "fading-hr hide-mobile" }), jsxs(Flex, { sx: {
-                                            width: '100%',
-                                            justifyContent: ['space-between', 'space-between', 'space-between', 'space-around'],
-                                        }, children: [jsxs(Flex, { sx: { justifyContent: 'center', flexDirection: ['column', 'column', 'column', 'row'] }, children: [jsx$2(Flex, { className: "modal-footer-header", children: "Vesting type:\u00A0" }), " ", jsx$2(Flex, { children: " Linear" })] }), jsxs(Flex, { sx: {
-                                                    justifyContent: 'center',
-                                                    cursor: 'pointer',
-                                                    alignItems: 'center',
-                                                }, onClick: () => setAccordionVisible(!accordionVisible), className: "modal-expander", children: ["What are bonds? \u00A0 ", jsx$2(Svg, { icon: "caret", direction: accordionVisible ? 'up' : 'down' })] })] })] })] }), accordionVisible && (jsx$2(Flex, { className: "modaltable-container accordion-container", children: jsx$2(AccordionText, { isVisible: accordionVisible }) }))] })) })) }));
+    return bondData ? (jsx$2(Flex, { className: "modal-content", children: jsxs(Flex, { className: "modaltable-container", children: [jsx$2(BondModalHeader, { bondData: bondData, onDismiss: onDismiss, showProjectInfoButton: (SDKConfig === null || SDKConfig === void 0 ? void 0 : SDKConfig.referenceId) === 'apebond' }), jsx$2(ProjectDescription, { description: bondData.shortDescription }), jsx$2(BondCards, { bondData: bondData }), jsx$2(Estimations, { depositAmount: depositAmount, bondData: bondData, youSpendString: youSpendString, isZap: isZap, fetchingZapQuote: fetchingZapQuote, zapError: zapError }), jsx$2(TokenSelectorPanel, { typedValue: inputValue, setTypedValue: setInputValue, selectedToken: inputToken, handleValueBtn: () => { var _a; return setInputValue((_a = new BigNumber$1(inputCurrencyBalance !== null && inputCurrencyBalance !== void 0 ? inputCurrencyBalance : '0')) === null || _a === void 0 ? void 0 : _a.toString()); }, handleCurrencySelect: handleCurrencySelect, chainId: bondData === null || bondData === void 0 ? void 0 : bondData.chainId, enableZap: supportedByLIFI.includes(bondData === null || bondData === void 0 ? void 0 : bondData.chainId), bondPrincipalToken: bondData === null || bondData === void 0 ? void 0 : bondData.lpToken, tokenBalance: inputCurrencyBalance, selectedTokenPrice: inputTokenPrice === null || inputTokenPrice === void 0 ? void 0 : inputTokenPrice.price, inputDisabled: minTier !== null && (!userTier || userTier < minTier) }), minTier !== null && jsx$2(TagMinTierBond, { userTier: userTier, minTier: minTier }), jsxs(Flex, { className: "modaltable-container button-container", children: [account && (minTier === null || (userTier !== null && userTier >= minTier)) && (jsx$2(Flex, { className: "button-container get", children: jsxs(Button, { className: "action-button", onClick: () => (supportedByLIFI.includes(bondData === null || bondData === void 0 ? void 0 : bondData.chainId) ? handleOpenZapModal() : openExternal()), variant: "secondary", fullWidth: true, children: ["Get ", getSymbol(bondData === null || bondData === void 0 ? void 0 : bondData.lpToken)] }) })), jsx$2(Flex, { className: "button-container buy", children: !account ? (jsx$2(ConnectButton, {})) : minTier !== null && (!userTier || userTier < minTier) ? (jsx$2(Button, { className: "action-button", onClick: () => window.open(`https://www.ape.bond/tier-staking`, '_blank'), children: "GET YOUR TIER" })) : userChainId !== bondData.chainId ? (jsx$2(Button, { className: "action-button", disabled: loadingTx || isConfirming || (bondData === null || bondData === void 0 ? void 0 : bondData.soldOut), onClick: (event) => {
+                                    event.stopPropagation();
+                                    switchChain({ chainId: bondData.chainId });
+                                }, style: { fontSize: '14px', padding: '6px', marginLeft: '0px' }, children: `Switch to ${NETWORK_LABEL[bondData.chainId]}` })) : approvalState === ApprovalState.APPROVED ? (jsx$2(Button, { className: "action-button", load: load || fetchingZapQuote, disabled: load ||
+                                    (bondData === null || bondData === void 0 ? void 0 : bondData.soldOut) ||
+                                    !account ||
+                                    !inputValue ||
+                                    parseFloat(inputValue) === 0 ||
+                                    fetchingZapQuote ||
+                                    zapError, onClick: handleOpenModal, children: zapError ? 'something went wrong' : `buy` })) : (jsx$2(Button, { className: "action-button", load: approvalState === ApprovalState.PENDING, disabled: approvalState === ApprovalState.PENDING ||
+                                    (bondData === null || bondData === void 0 ? void 0 : bondData.soldOut) ||
+                                    !account ||
+                                    !inputValue ||
+                                    parseFloat(inputValue) === 0, onClick: handleApprove, children: "enable" })) })] })] }) })) : (jsx$2(Fragment$1, {}));
+};
+
+const BuyBondModal = ({ onDismiss, bondAddress, bondChain, handlePurchasedBond }) => {
+    return (jsx$2(Modal, { className: "modal", onDismiss: onDismiss, sx: { width: '400px' }, children: jsx$2(Flex, { sx: { width: '100%', maxWidth: '700px', mt: '-10px' }, children: jsx$2(BuyBond, { onDismiss: onDismiss, bondAddress: bondAddress, bondChain: bondChain, handlePurchasedBond: handlePurchasedBond }) }) }));
 };
 
 /*
@@ -74159,7 +74062,7 @@ const ModalHandler = ({ onDismiss, bondAddress, bondChain, }) => {
             refetch();
         }
     }, [billId]);
-    return billId ? (jsx$2(YourBondsModal, { userBill: userBill, onDismiss: onDismiss })) : (jsx$2(BondModal, { bondAddress: bondAddress, bondChain: bondChain, handlePurchasedBond: setBuyTxHash, onDismiss: () => {
+    return billId ? (jsx$2(YourBondsModal, { userBill: userBill, onDismiss: onDismiss })) : (jsx$2(BuyBondModal, { bondAddress: bondAddress, bondChain: bondChain, handlePurchasedBond: setBuyTxHash, onDismiss: () => {
             window.history.pushState({}, '', `${locationPath !== '/bonds' ? locationPath : '/bonds'}`);
             onDismiss === null || onDismiss === void 0 ? void 0 : onDismiss();
         } }));
@@ -74303,7 +74206,7 @@ const HotBondCard = ({ bond }) => {
     var _a, _b, _c, _d, _e, _f, _g, _h;
     const { bonus } = bond;
     // Modal
-    const [openBuyModal] = useModal(jsx$2(BondModal, { bondAddress: bond.billAddress, bondChain: bond.chainId }), true, true, `buyBondModal-${bond.billAddress}-${bond.chainId}`);
+    const [openBuyModal] = useModal(jsx$2(BuyBondModal, { bondAddress: bond.billAddress, bondChain: bond.chainId }), true, true, `buyBondModal-${bond.billAddress}-${bond.chainId}`);
     const handleOpenModal = () => {
         openBuyModal();
         track({
@@ -75507,9 +75410,9 @@ const YourBondsWithProviders = (props) => {
     return (jsx$2(Providers, { theme: props.theme, children: jsx$2(YourBonds, {}) }));
 };
 
-const BondModalWithProviders = (props) => {
+const BuyBondModalWithProviders = (props) => {
     useSDKConfig(props);
-    return (jsx$2(Providers, { theme: props.theme, children: jsx$2(BondModal, Object.assign({}, props)) }));
+    return (jsx$2(Providers, { theme: props.theme, children: jsx$2(BuyBondModal, Object.assign({}, props)) }));
 };
 
 const FullBondsViewWithProviders = (props) => {
@@ -91162,7 +91065,7 @@ const ProjectView = ({ bondAddress, bondChain, historicalPrices }) => {
                                         p: '20px',
                                         borderRadius: '10px',
                                         mt: '5px',
-                                    }, className: `project-view`, children: [jsx$2(BondModalHeader, { bondData: bondData }), jsx$2(ProjectDescription, { description: bondData.shortDescription }), jsx$2(Estimations, { depositAmount: depositAmount, bondData: bondData, youSpendString: youSpendString, isZap: isZap, fetchingZapQuote: fetchingZapQuote, zapError: zapError }), jsx$2(TokenSelectorPanel, { typedValue: inputValue, setTypedValue: setInputValue, selectedToken: inputToken, handleValueBtn: () => { var _a; return setInputValue((_a = new BigNumber$1(inputCurrencyBalance !== null && inputCurrencyBalance !== void 0 ? inputCurrencyBalance : '0')) === null || _a === void 0 ? void 0 : _a.toString()); }, handleCurrencySelect: handleCurrencySelect, chainId: bondData === null || bondData === void 0 ? void 0 : bondData.chainId, enableZap: supportedByLIFI.includes(bondData === null || bondData === void 0 ? void 0 : bondData.chainId), bondPrincipalToken: bondData === null || bondData === void 0 ? void 0 : bondData.lpToken, tokenBalance: inputCurrencyBalance, selectedTokenPrice: inputTokenPrice === null || inputTokenPrice === void 0 ? void 0 : inputTokenPrice.price }), minTier && (bondData === null || bondData === void 0 ? void 0 : bondData.minTier) !== undefined && (jsx$2(TagMinTierBond, { userTier: userTier, minTier: bondData === null || bondData === void 0 ? void 0 : bondData.minTier })), jsxs(Flex, { className: "modaltable-container button-container", children: [account &&
+                                    }, className: `project-view`, children: [jsx$2(Flex, { sx: { mt: '-20px' }, children: jsx$2(BondModalHeader, { bondData: bondData }) }), jsx$2(ProjectDescription, { description: bondData.shortDescription }), jsx$2(Estimations, { depositAmount: depositAmount, bondData: bondData, youSpendString: youSpendString, isZap: isZap, fetchingZapQuote: fetchingZapQuote, zapError: zapError }), jsx$2(TokenSelectorPanel, { typedValue: inputValue, setTypedValue: setInputValue, selectedToken: inputToken, handleValueBtn: () => { var _a; return setInputValue((_a = new BigNumber$1(inputCurrencyBalance !== null && inputCurrencyBalance !== void 0 ? inputCurrencyBalance : '0')) === null || _a === void 0 ? void 0 : _a.toString()); }, handleCurrencySelect: handleCurrencySelect, chainId: bondData === null || bondData === void 0 ? void 0 : bondData.chainId, enableZap: supportedByLIFI.includes(bondData === null || bondData === void 0 ? void 0 : bondData.chainId), bondPrincipalToken: bondData === null || bondData === void 0 ? void 0 : bondData.lpToken, tokenBalance: inputCurrencyBalance, selectedTokenPrice: inputTokenPrice === null || inputTokenPrice === void 0 ? void 0 : inputTokenPrice.price }), minTier && (bondData === null || bondData === void 0 ? void 0 : bondData.minTier) !== undefined && (jsx$2(TagMinTierBond, { userTier: userTier, minTier: bondData === null || bondData === void 0 ? void 0 : bondData.minTier })), jsxs(Flex, { className: "modaltable-container button-container", children: [account &&
                                                     (!minTier || (minTier && bondData.minTier && (!userTier || userTier >= bondData.minTier))) && (jsx$2(Flex, { className: "button-container get", children: jsxs(Button, { className: "action-button", onClick: () => supportedByLIFI.includes(bondData === null || bondData === void 0 ? void 0 : bondData.chainId) ? handleOpenZapModal() : openExternal(), variant: "secondary", children: ["Get ", getSymbol(bondData === null || bondData === void 0 ? void 0 : bondData.lpToken)] }) })), jsx$2(Flex, { className: "button-container buy", children: !account ? (jsx$2(ConnectButton, {})) : minTier && bondData.minTier && (!userTier || userTier < bondData.minTier) ? (jsx$2(Button, { className: "action-button", onClick: () => window.open(`https://www.ape.bond/tier-staking`, '_blank'), children: "GET YOUR TIER" })) : userChainId !== bondData.chainId ? (jsx$2(Button, { className: "switch-button", disabled: loadingTx || isConfirming || (bondData === null || bondData === void 0 ? void 0 : bondData.soldOut), onClick: (event) => {
                                                             event.stopPropagation();
                                                             switchChain({ chainId: bondData.chainId });
@@ -91184,14 +91087,123 @@ const ProjectViewWithProviders = (props) => {
     return (jsx$2(Providers, { theme: props.theme, children: jsx$2(ProjectView, Object.assign({}, props)) }));
 };
 
-const SingleBond = () => {
-    return jsx$2(Flex, { children: "asd!" });
+const TabNav = ({ tabOptions, activeTab, onChangeActiveTab }) => {
+    const translateX = activeTab === tabOptions[0] ? '0%' : '100%';
+    return (jsxs(Flex, { sx: {
+            flexDirection: 'row',
+            width: '100%',
+            marginTop: '5px',
+            position: 'relative',
+            justifyContent: 'space-between',
+        }, children: [tabOptions.map((tab, index) => (jsx$2(Flex, { onClick: () => onChangeActiveTab && onChangeActiveTab(tab), sx: {
+                    flexDirection: 'column',
+                    justifyContent: 'center',
+                    alignItems: 'center',
+                    cursor: 'pointer',
+                    fontWeight: activeTab === tab ? 700 : 500,
+                    color: activeTab === tab ? 'text' : 'textDisabled',
+                    transition: 'all 0.3s ease-out',
+                    width: '100%',
+                    my: '10px',
+                }, children: tab }, tab))), jsx$2(Flex, { sx: {
+                    position: 'absolute',
+                    width: '100%',
+                    bottom: 0,
+                    background: 'textDisabled',
+                    height: '3px',
+                    borderRadius: 'normal',
+                } }), jsx$2(Flex, { sx: {
+                    position: 'absolute',
+                    width: '50%', // 50% width
+                    bottom: 0,
+                    background: 'text', // Line color
+                    height: '3px',
+                    borderRadius: 'normal',
+                    transition: 'transform 0.3s ease-out', // Add smooth transition
+                    transform: `translateX(${translateX})`, // Dynamically move left/right
+                } })] }));
+};
+
+const SoldOutBuyBondPlaceholder = ({ bond }) => {
+    var _a, _b, _c, _d, _e, _f;
+    const SDKConfig = useSDKConfig();
+    // Hooks
+    const { address: account } = useAccount();
+    const { data: userEscrowWeight } = useGetUserEscrowWeight(account);
+    const userTier = getUserTier(userEscrowWeight !== null && userEscrowWeight !== void 0 ? userEscrowWeight : '0');
+    // State
+    const bondData = bond;
+    const minTier = (bondData === null || bondData === void 0 ? void 0 : bondData.minTier) !== undefined ? bondData.minTier : null;
+    const [inputValue, setInputValue] = useState('');
+    const [inputTokenString, setInputTokenString] = useState((_b = (_a = bondData === null || bondData === void 0 ? void 0 : bondData.lpToken) === null || _a === void 0 ? void 0 : _a.address) === null || _b === void 0 ? void 0 : _b[bondData.chainId]);
+    // Data
+    const inputToken = useTokenFromZapList(inputTokenString, bondData === null || bondData === void 0 ? void 0 : bondData.chainId, bondData === null || bondData === void 0 ? void 0 : bondData.lpToken);
+    const isZap = (inputTokenString === null || inputTokenString === void 0 ? void 0 : inputTokenString.toLowerCase()) !== ((_e = (_d = (_c = bondData === null || bondData === void 0 ? void 0 : bondData.lpToken) === null || _c === void 0 ? void 0 : _c.address) === null || _d === void 0 ? void 0 : _d[bondData === null || bondData === void 0 ? void 0 : bondData.chainId]) === null || _e === void 0 ? void 0 : _e.toLowerCase());
+    const { data: inputCurrencyBalance } = useCurrencyBalance(inputToken !== null && inputToken !== void 0 ? inputToken : null, account !== null && account !== void 0 ? account : null, (_f = bondData === null || bondData === void 0 ? void 0 : bondData.chainId) !== null && _f !== void 0 ? _f : null);
+    return bondData ? (jsx$2(Flex, { className: "modal-content", children: jsxs(Flex, { className: "modaltable-container", children: [jsxs(Flex, { sx: {
+                        position: 'absolute',
+                        width: 'calc(100% + 40px)',
+                        height: 'calc(100% + 20px)',
+                        top: '0',
+                        left: '-20px',
+                        overflow: 'hidden',
+                        borderRadius: 'normal',
+                    }, children: [jsx$2(Flex, { sx: {
+                                position: 'absolute',
+                                width: '100%',
+                                height: '100%',
+                                zIndex: 999,
+                                backgroundColor: 'rgba(255,255,255,0.1)',
+                                backdropFilter: 'blur(1px)',
+                                WebkitBackdropFilter: 'blur(1px)', // Ensure compatibility with Safari
+                            } }), jsx$2(Flex, { sx: {
+                                position: 'absolute',
+                                top: '50px',
+                                left: '-50px',
+                                backgroundColor: 'error',
+                                color: 'white',
+                                padding: '5px 20px',
+                                fontSize: '14px',
+                                fontWeight: 'bold',
+                                transform: 'rotate(-45deg)',
+                                zIndex: 1000, // Ensure it appears above other elements
+                                boxShadow: '0 2px 4px rgba(0,0,0,0.2)',
+                                width: '220px',
+                                justifyContent: 'center',
+                            }, children: "SOLD OUT" })] }), jsx$2(BondModalHeader, { bondData: bondData, 
+                    // onDismiss={onDismiss}
+                    showProjectInfoButton: (SDKConfig === null || SDKConfig === void 0 ? void 0 : SDKConfig.referenceId) === 'apebond' }), jsx$2(ProjectDescription, { description: bondData.shortDescription }), jsx$2(BondCards, { bondData: Object.assign(Object.assign({}, bondData), { bonusWithFee: -1 }) }), jsx$2(Estimations, { depositAmount: '0', 
+                    /*@ts-ignore*/
+                    bondData: bondData, youSpendString: '0', isZap: isZap, fetchingZapQuote: false, zapError: false }), jsx$2(TokenSelectorPanel, { typedValue: inputValue, setTypedValue: setInputValue, selectedToken: inputToken, handleValueBtn: () => null, handleCurrencySelect: () => null, chainId: bondData === null || bondData === void 0 ? void 0 : bondData.chainId, enableZap: supportedByLIFI.includes(bondData === null || bondData === void 0 ? void 0 : bondData.chainId), bondPrincipalToken: bondData === null || bondData === void 0 ? void 0 : bondData.lpToken, tokenBalance: inputCurrencyBalance, selectedTokenPrice: 0, inputDisabled: true }), minTier !== null && jsx$2(TagMinTierBond, { userTier: userTier, minTier: minTier }), jsxs(Flex, { className: "modaltable-container button-container", children: [account && (minTier === null || (userTier !== null && userTier >= minTier)) && (jsx$2(Flex, { className: "button-container get", children: jsxs(Button, { className: "action-button", variant: "secondary", fullWidth: true, disabled: true, children: ["Get ", getSymbol(bondData === null || bondData === void 0 ? void 0 : bondData.lpToken)] }) })), jsx$2(Flex, { className: "button-container buy", children: jsx$2(Button, { className: "action-button", fullWidth: true, disabled: true, children: "Buy" }) })] })] }) })) : (jsx$2(Fragment$1, {}));
+};
+
+const SingleBond = ({ tokenSymbol }) => {
+    // Data Hooks
+    const { data: bonds, isFetched } = useBondsData();
+    const { data: allBonds } = useBondsList();
+    // State
+    const [activeTab, setActiveTab] = useState('Buy Bond');
+    // Data
+    const filteredBonds = bonds === null || bonds === void 0 ? void 0 : bonds.filter((bond) => tokenSymbol === null || tokenSymbol === void 0 ? void 0 : tokenSymbol.some((symbol) => { var _a; return ((_a = bond.earnToken.symbol) === null || _a === void 0 ? void 0 : _a.toLowerCase()) === symbol.toLowerCase(); }));
+    const soldOutBonds = allBonds === null || allBonds === void 0 ? void 0 : allBonds.filter((bond) => tokenSymbol === null || tokenSymbol === void 0 ? void 0 : tokenSymbol.some((symbol) => { var _a; return ((_a = bond.earnToken.symbol) === null || _a === void 0 ? void 0 : _a.toLowerCase()) === symbol.toLowerCase(); }));
+    const activeBond = filteredBonds === null || filteredBonds === void 0 ? void 0 : filteredBonds[0];
+    const soldOutBond = soldOutBonds === null || soldOutBonds === void 0 ? void 0 : soldOutBonds[0];
+    const bondAddress = activeBond === null || activeBond === void 0 ? void 0 : activeBond.billAddress;
+    const bondChain = activeBond === null || activeBond === void 0 ? void 0 : activeBond.chainId;
+    return (jsx$2(Flex, { sx: { flexDirection: 'column' }, children: jsxs(Flex, { sx: {
+                flexDirection: 'column',
+            }, children: [jsx$2(Flex, { sx: { width: '100%', justifyContent: 'center', mb: '15px' }, children: jsx$2(TabNav, { activeTab: activeTab, tabOptions: ['Buy Bond', 'Your Bonds'], onChangeActiveTab: (newValue) => setActiveTab(newValue) }) }), activeTab === 'Buy Bond' ? (jsx$2(Flex, { sx: {
+                        background: activeTab === 'Buy Bond' && 'white2',
+                        borderRadius: 'normal',
+                        p: '0 20px 20px 20px',
+                        mx: '10px',
+                    }, children: activeBond ? (jsx$2(BuyBond, { bondAddress: bondAddress, bondChain: bondChain })) : soldOutBond && isFetched ? (jsx$2(SoldOutBuyBondPlaceholder, { bond: soldOutBond })) : isFetched ? (jsx$2(Flex, { sx: { justifyContent: 'center', width: '100%', pt: '20px' }, children: "No bond" })) : (jsx$2(Flex, { className: "yourbonds-spinner", children: jsx$2(Spinner, { size: 100 }) })) })) : (jsx$2(YourBonds, { showOnly: tokenSymbol === null || tokenSymbol === void 0 ? void 0 : tokenSymbol[0] }))] }) }));
 };
 
 const SingleBondWithProviders = (props) => {
     useSDKConfig(props);
-    return (jsx$2(Providers, { theme: props.theme, children: jsx$2(SingleBond, {}) }));
+    return (jsx$2(Providers, { theme: props.theme, children: jsx$2(SingleBond, Object.assign({}, props)) }));
 };
 
 var ChainId = types.ChainId;
-export { BondModalWithProviders as BondModal, BondsWithProviders as Bonds, ChainId, FullBondsViewWithProviders as FullBondsView, ProjectViewWithProviders as ProjectView, SingleBondWithProviders as SingleBond, YourBondsWithProviders as YourBonds, generateImageFromTemplate };
+export { BondsWithProviders as Bonds, BuyBondModalWithProviders as BuyBondModal, ChainId, FullBondsViewWithProviders as FullBondsView, ProjectViewWithProviders as ProjectView, SingleBondWithProviders as SingleBond, YourBondsWithProviders as YourBonds, generateImageFromTemplate };

package/dist/styles.css

@@ -141,9 +141,7 @@
   border-radius: 10px;
   background-color: var(--theme-ui-colors-white2);
   border-radius: 10px;
-  z-index: 1001;
   width: 100%;
-  max-width: 700px;
 }
 
 .modaltable-container {

package/dist/views/{BondModal/BondModal.d.ts → BuyBond/BuyBond.d.ts}

@@ -1,9 +1,9 @@
 import React from 'react';
-export interface BondModalProps {
+export interface BuyBondProps {
     onDismiss?: () => void;
     bondAddress?: string;
     bondChain?: number;
     handlePurchasedBond?: (hash: string) => void;
 }
-declare const BondModal: React.FC<BondModalProps>;
-export default BondModal;
+declare const BuyBond: React.FC<BuyBondProps>;
+export default BuyBond;

package/dist/views/BuyBond/BuyBondModal.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { BuyBondProps } from './BuyBond';
+declare const BuyBondModal: React.FC<BuyBondProps>;
+export default BuyBondModal;

package/dist/views/BuyBond/index.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import { BuyBondProps } from './BuyBond';
+import { SDKProps } from '../../state/useSDKConfig';
+interface Props extends SDKProps, BuyBondProps {
+}
+declare const BuyBondModalWithProviders: React.FC<Props>;
+export default BuyBondModalWithProviders;

package/dist/views/SingleBond/SingleBond.d.ts

@@ -1,3 +1,6 @@
 import React from 'react';
-declare const SingleBond: () => React.JSX.Element;
+export interface SingleBondProps {
+    tokenSymbol?: string[];
+}
+declare const SingleBond: React.FC<SingleBondProps>;
 export default SingleBond;

package/dist/views/SingleBond/SoldOutBuyBondPlaceholder.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import { BillsConfig } from '@ape.swap/apeswap-lists';
+export interface SoldOutProps {
+    onDismiss?: () => void;
+    bond: BillsConfig;
+}
+declare const SoldOutBuyBondPlaceholder: React.FC<SoldOutProps>;
+export default SoldOutBuyBondPlaceholder;

package/dist/views/SingleBond/index.d.ts

@@ -1,4 +1,7 @@
 import React from 'react';
 import { SDKProps } from '../../state/useSDKConfig';
-declare const SingleBondWithProviders: React.FC<SDKProps>;
+import { SingleBondProps } from './SingleBond';
+interface Props extends SDKProps, SingleBondProps {
+}
+declare const SingleBondWithProviders: React.FC<Props>;
 export default SingleBondWithProviders;

package/dist/views/YourBonds/YourBonds.d.ts

@@ -1,4 +1,6 @@
 import React from 'react';
 export type SortableKeys = 'claimable' | 'pending' | 'terms';
-declare const YourBonds: () => React.JSX.Element;
+declare const YourBonds: ({ showOnly }: {
+    showOnly?: string;
+}) => React.JSX.Element;
 export default YourBonds;

package/package.json

@@ -3,7 +3,7 @@
   "description": "Ape Bond SDK",
   "author": "Ape Bond",
   "license": "MIT",
-  "version": "3.0.11",
+  "version": "3.0.12",
   "module": "dist/main.js",
   "type": "module",
   "types": "dist/main.d.ts",

package/dist/views/BondModal/index.d.ts

@@ -1,7 +0,0 @@
-import React from 'react';
-import { BondModalProps } from './BondModal';
-import { SDKProps } from '../../state/useSDKConfig';
-interface Props extends SDKProps, BondModalProps {
-}
-declare const BondModalWithProviders: React.FC<Props>;
-export default BondModalWithProviders;