@ape.swap/bonds-sdk 1.0.780 → 1.1.0-seedify

package/dist/views/BondModal/BondModal.js

@@ -1,300 +0,0 @@
-var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-};
-var __generator = (this && this.__generator) || function (thisArg, body) {
-    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g = Object.create((typeof Iterator === "function" ? Iterator : Object).prototype);
-    return g.next = verb(0), g["throw"] = verb(1), g["return"] = verb(2), typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
-    function verb(n) { return function (v) { return step([n, v]); }; }
-    function step(op) {
-        if (f) throw new TypeError("Generator is already executing.");
-        while (g && (g = 0, op[0] && (_ = 0)), _) try {
-            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
-            if (y = 0, t) op = [op[0] & 2, t.value];
-            switch (op[0]) {
-                case 0: case 1: t = op; break;
-                case 4: _.label++; return { value: op[1], done: false };
-                case 5: _.label++; y = op[1]; op = [0]; continue;
-                case 7: op = _.ops.pop(); _.trys.pop(); continue;
-                default:
-                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
-                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
-                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
-                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
-                    if (t[2]) _.ops.pop();
-                    _.trys.pop(); continue;
-            }
-            op = body.call(thisArg, _);
-        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
-        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
-    }
-};
-var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
-    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
-        if (ar || !(i in from)) {
-            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
-            ar[i] = from[i];
-        }
-    }
-    return to.concat(ar || Array.prototype.slice.call(from));
-};
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "theme-ui/jsx-runtime";
-/** @jsxImportSource theme-ui */
-import { useCallback, useEffect, useState } from 'react';
-import { Flex } from 'theme-ui';
-import getTimePeriods from '../../utils/getTimePeriods';
-import axios from 'axios';
-import { BigNumber } from 'bignumber.js';
-import { getFirstNonZeroDigits } from '../../utils/roundNumber';
-import { TooltipBubble, Button, Svg, ListTag } from '../../components/uikit-sdk';
-import { TooltipText } from '../../enum/tooltips';
-import { adjustDecimals } from '../../utils/convertToTokenValue';
-import TokenImage from '../../components/uikit-sdk/TokenImage';
-import BOND_ABI from '../../config/abi/bond.json';
-import { NETWORK_ICONS, NETWORK_LABEL } from '../../config/constants/chains';
-import { formatUSDNumber, getPremiumColor, premium, youGet, youGetUSD, youSpend, youSpendUSD } from './helper';
-import '../../scss/BondModal.scss';
-import { useChainId, useSendTransaction, useSwitchChain, useWaitForTransactionReceipt, useWriteContract } from 'wagmi';
-import useModal from '../../hooks/useModal';
-import ZapModal from '../ZapModal';
-import AccordionText from '../../components/AccordionText';
-import moment from 'moment';
-import { toNumber } from 'lodash';
-import TokenSelectorPanel from '../../components/TokenSelectorPanel';
-import { zapInputTokens } from '../../config/constants/zapInputTokens';
-import useCurrencyPrice from '../../state/price/useCurrencyPrice';
-import useCurrencyBalance from '../../state/balance/useCurrencyBalance';
-import { ApprovalState, useApproval } from '../../state/allowance/useAllowance';
-import { SoulZapTokenManager } from '../../config/constants/addresses';
-import useSoulZapBondQuote from '../../state/zap/useSoulZapBondQuote';
-import { parseEther } from 'viem';
-var BondModal = function (_a) {
-    var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y;
-    var account = _a.account, isActive = _a.isActive, isOpen = _a.isOpen, accountChainId = _a.accountChainId, onClose = _a.onClose, bondAddress = _a.bondAddress, _z = _a.accordionTitle, accordionTitle = _z === void 0 ? 'What are Bonds?' : _z, _0 = _a.accordionBody, accordionBody = _0 === void 0 ? 'Body' : _0, _1 = _a.accordionVisible, accordionVisible = _1 === void 0 ? false : _1, _2 = _a.style, style = _2 === void 0 ? 'standard' : _2;
-    if (!isOpen)
-        return null;
-    // Hooks
-    var chainId = useChainId();
-    var _3 = useSwitchChain(), chains = _3.chains, switchChain = _3.switchChain;
-    var _4 = useWriteContract(), hash = _4.data, isPending = _4.isPending, writeContract = _4.writeContract, writeContractAsync = _4.writeContractAsync;
-    // State
-    var _5 = useState(false), loadingTx = _5[0], setLoadingTx = _5[1];
-    var _6 = useState(), bondData = _6[0], setBondData = _6[1];
-    var _7 = useState(null), toastMessage = _7[0], setToastMessage = _7[1];
-    var _8 = useState(null), buyTx = _8[0], setBuyTx = _8[1];
-    var _9 = useState(''), inputValue = _9[0], setInputValue = _9[1];
-    var _10 = useState('NATIVE'), inputTokenString = _10[0], setInputTokenString = _10[1];
-    var _11 = useWaitForTransactionReceipt({
-        confirmations: 4,
-        chainId: chainId !== null && chainId !== void 0 ? chainId : accountChainId,
-        hash: hash,
-    }), isConfirming = _11.isLoading, isConfirmed = _11.isSuccess;
-    var handleBuy = function () { return __awaiter(void 0, void 0, void 0, function () {
-        var billAddress, decimals, maxPrice, rawAmount, amount, tx, data, response, error_1;
-        var _a, _b;
-        return __generator(this, function (_c) {
-            switch (_c.label) {
-                case 0:
-                    billAddress = bondData === null || bondData === void 0 ? void 0 : bondData.billAddress;
-                    decimals = (_a = bondData === null || bondData === void 0 ? void 0 : bondData.lpToken.decimals[bondData === null || bondData === void 0 ? void 0 : bondData.chainId]) !== null && _a !== void 0 ? _a : 18;
-                    _c.label = 1;
-                case 1:
-                    _c.trys.push([1, 5, , 6]);
-                    maxPrice = new BigNumber((_b = bondData === null || bondData === void 0 ? void 0 : bondData.trueBillPrice) !== null && _b !== void 0 ? _b : '0').times(102).div(100).toFixed(0);
-                    rawAmount = adjustDecimals(inputValue);
-                    amount = new BigNumber(rawAmount).times(new BigNumber(10).pow(decimals !== null && decimals !== void 0 ? decimals : 18)).toString();
-                    return [4 /*yield*/, writeContractAsync({
-                            address: billAddress,
-                            abi: BOND_ABI,
-                            functionName: 'deposit',
-                            args: [amount, maxPrice, account],
-                        })];
-                case 2:
-                    tx = _c.sent();
-                    if (!tx) return [3 /*break*/, 4];
-                    setBuyTx(tx);
-                    data = {
-                        chainId: chainId,
-                        transactionHash: tx,
-                        referenceId: 'cgpt-sdk',
-                        billContract: billAddress,
-                    };
-                    return [4 /*yield*/, axios.post("https://api-v2.apeswap.finance/bills/widget", data)];
-                case 3:
-                    response = _c.sent();
-                    console.log(response);
-                    _c.label = 4;
-                case 4: return [3 /*break*/, 6];
-                case 5:
-                    error_1 = _c.sent();
-                    console.error('Buy error', error_1);
-                    return [3 /*break*/, 6];
-                case 6: return [2 /*return*/];
-            }
-        });
-    }); };
-    // Functions for calculations
-    var getDiscountColor = function (discount) {
-        return discount < 0 ? 'discount-negative' : 'discount-positive';
-    };
-    var discountEarnTokenPrice = function (bond) {
-        var _a, _b;
-        var earnTokenPrice = parseFloat((_a = bond === null || bond === void 0 ? void 0 : bond.payoutTokenPrice) !== null && _a !== void 0 ? _a : '0');
-        return getFirstNonZeroDigits(earnTokenPrice - earnTokenPrice * (((_b = bond === null || bond === void 0 ? void 0 : bond.discount) !== null && _b !== void 0 ? _b : 0) / 100));
-    };
-    var earnTokenPrice = function (bond) {
-        var _a;
-        return getFirstNonZeroDigits(parseFloat((_a = bond === null || bond === void 0 ? void 0 : bond.payoutTokenPrice) !== null && _a !== void 0 ? _a : '0'));
-    };
-    var vestingTime = function (vestingTerm) { return getTimePeriods(vestingTerm !== null && vestingTerm !== void 0 ? vestingTerm : 0, true); };
-    var maxBuy = function (bond) {
-        var _a, _b, _c, _d;
-        var available = new BigNumber((_a = bond === null || bond === void 0 ? void 0 : bond.tokensRemaining) !== null && _a !== void 0 ? _a : '0');
-        var threshold = 5;
-        var thresholdToShow = new BigNumber(threshold).div((_b = bond === null || bond === void 0 ? void 0 : bond.payoutTokenPrice) !== null && _b !== void 0 ? _b : 0);
-        var safeAvailable = available.minus(thresholdToShow);
-        var singlePurchaseLimit = new BigNumber((_c = bond === null || bond === void 0 ? void 0 : bond.maxPayout) !== null && _c !== void 0 ? _c : 0).div(new BigNumber(10).pow((_d = bond === null || bond === void 0 ? void 0 : bond.earnToken.decimals[chainId]) !== null && _d !== void 0 ? _d : 18));
-        return !available ? 0 : singlePurchaseLimit.lt(safeAvailable) ? singlePurchaseLimit : safeAvailable;
-    };
-    // Effects
-    useEffect(function () {
-        if (isConfirmed) {
-            setToastMessage("Transaction Complete.");
-            setTimeout(function () { return setToastMessage(null); }, 10000);
-        }
-    }, [buyTx, isConfirmed]);
-    // Fetch data
-    useEffect(function () {
-        axios.get('https://realtime-api.ape.bond/bonds').then(function (response) {
-            var bond = response.data.bonds.find(function (x) { return x.billAddress.toLowerCase() === (bondAddress === null || bondAddress === void 0 ? void 0 : bondAddress.toLowerCase()); });
-            setBondData(bond);
-            setInputTokenString(bond === null || bond === void 0 ? void 0 : bond.lpToken.address[bond.chainId]);
-        });
-    }, [bondAddress]);
-    // Modals
-    var onOpenZapModal = useModal(_jsx(ZapModal, { outputToken: bondData === null || bondData === void 0 ? void 0 : bondData.lpToken, account: account, chainId: bondData === null || bondData === void 0 ? void 0 : bondData.chainId }), true, true, 'zapModal')[0];
-    var tokenList = (_b = zapInputTokens[bondData === null || bondData === void 0 ? void 0 : bondData.chainId]) !== null && _b !== void 0 ? _b : [];
-    var inputToken = inputTokenString === 'NATIVE'
-        ? 'NATIVE'
-        : (_c = __spreadArray(__spreadArray([], tokenList, true), [bondData === null || bondData === void 0 ? void 0 : bondData.lpToken], false)) === null || _c === void 0 ? void 0 : _c.find(function (token) { var _a, _b; return ((_b = (_a = token === null || token === void 0 ? void 0 : token.address) === null || _a === void 0 ? void 0 : _a[bondData === null || bondData === void 0 ? void 0 : bondData.chainId]) === null || _b === void 0 ? void 0 : _b.toLowerCase()) === (inputTokenString === null || inputTokenString === void 0 ? void 0 : inputTokenString.toLowerCase()); });
-    var inputTokenPrice = useCurrencyPrice(inputToken !== null && inputToken !== void 0 ? inputToken : null, chainId).data;
-    var inputCurrencyBalance = useCurrencyBalance(inputToken !== null && inputToken !== void 0 ? inputToken : null, account !== null && account !== void 0 ? account : null, (_d = bondData === null || bondData === void 0 ? void 0 : bondData.chainId) !== null && _d !== void 0 ? _d : null).data;
-    var handleCurrencySelect = useCallback(function (newInputToken) {
-        setInputValue('');
-        setInputTokenString(newInputToken); // why two states?
-    }, []);
-    var isZap = (inputTokenString === null || inputTokenString === void 0 ? void 0 : inputTokenString.toLowerCase()) !== ((_g = (_f = (_e = bondData === null || bondData === void 0 ? void 0 : bondData.lpToken) === null || _e === void 0 ? void 0 : _e.address) === null || _f === void 0 ? void 0 : _f[bondData === null || bondData === void 0 ? void 0 : bondData.chainId]) === null || _g === void 0 ? void 0 : _g.toLowerCase());
-    var _12 = useApproval(inputValue, inputToken !== null && inputToken !== void 0 ? inputToken : null, (_h = (isZap ? SoulZapTokenManager[bondData === null || bondData === void 0 ? void 0 : bondData.chainId] : bondData === null || bondData === void 0 ? void 0 : bondData.billAddress)) !== null && _h !== void 0 ? _h : null, account !== null && account !== void 0 ? account : null, (_j = bondData === null || bondData === void 0 ? void 0 : bondData.chainId) !== null && _j !== void 0 ? _j : null), approvalState = _12[0], approveCallback = _12[1];
-    var handleApproveCallback = function () { return __awaiter(void 0, void 0, void 0, function () {
-        return __generator(this, function (_a) {
-            switch (_a.label) {
-                case 0:
-                    setLoadingTx(true);
-                    return [4 /*yield*/, approveCallback().finally(function () { return setLoadingTx(false); })];
-                case 1:
-                    _a.sent();
-                    return [2 /*return*/];
-            }
-        });
-    }); };
-    var _13 = useSoulZapBondQuote(inputValue, inputToken, bondData, account), loading = _13[0], zapData = _13[1], outputValue = _13[2];
-    var _14 = useSendTransaction(), zapHash = _14.data, sendTransactionAsync = _14.sendTransactionAsync;
-    var isZapConfirming = useWaitForTransactionReceipt({
-        confirmations: 1,
-        chainId: chainId,
-        hash: zapHash,
-    }).isLoading;
-    var soulZapCallback = useCallback(function () { return __awaiter(void 0, void 0, void 0, function () {
-        var validated18DecimalAmount, parsedValue, e_1;
-        var _a, _b;
-        return __generator(this, function (_c) {
-            switch (_c.label) {
-                case 0:
-                    if (!(zapData && ((_a = zapData === null || zapData === void 0 ? void 0 : zapData.txData) === null || _a === void 0 ? void 0 : _a.to) && ((_b = zapData === null || zapData === void 0 ? void 0 : zapData.txData) === null || _b === void 0 ? void 0 : _b.data))) return [3 /*break*/, 4];
-                    console.log('Attempting zap tx');
-                    _c.label = 1;
-                case 1:
-                    _c.trys.push([1, 3, , 4]);
-                    console.log(zapData);
-                    validated18DecimalAmount = new BigNumber(inputValue !== null && inputValue !== void 0 ? inputValue : '0').toFixed(18, 5);
-                    parsedValue = parseEther(validated18DecimalAmount);
-                    return [4 /*yield*/, sendTransactionAsync({
-                            to: zapData.txData.to,
-                            data: zapData.txData.data,
-                            value: inputToken === 'NATIVE' ? parsedValue : undefined,
-                        })];
-                case 2:
-                    _c.sent();
-                    return [3 /*break*/, 4];
-                case 3:
-                    e_1 = _c.sent();
-                    console.log(e_1);
-                    return [3 /*break*/, 4];
-                case 4: return [2 /*return*/];
-            }
-        });
-    }); }, [zapData, inputTokenPrice, account]);
-    var getActionButtonText = function (bond) {
-        if (!account) {
-            return 'Connect Wallet';
-        }
-        if (chainId !== bond.chainId) {
-            return "Switch to ".concat(NETWORK_LABEL[bond.chainId]);
-        }
-        if (isConfirming) {
-            return 'Confirming...';
-        }
-        if (bond === null || bond === void 0 ? void 0 : bond.soldOut) {
-            return 'Sold Out';
-        }
-        if (isConfirmed) {
-            return "Buy ".concat(bond === null || bond === void 0 ? void 0 : bond.showcaseTokenName);
-        }
-        return 'Approve';
-    };
-    return (_jsx(_Fragment, { children: bondData && (_jsx(_Fragment, { children: style === 'standard' ? (_jsx(Flex, { className: "modal-backdrop", onClick: onClose, children: _jsxs(Flex, { className: "modal-content", onClick: function (event) { return event.stopPropagation(); }, children: [toastMessage && _jsx(Flex, { className: "toast", children: toastMessage }), _jsx(Flex, { className: "modal-header", children: _jsx(Flex, { className: "svg-close", onClick: onClose, children: _jsx(Svg, { icon: "close" }) }) }), _jsxs(Flex, { className: "modaltable-container", children: [_jsxs(Flex, { className: "modaltable-container title-container", children: [_jsx(Flex, { className: "title-container bondicon", children: _jsx(TokenImage, { symbol: (_k = bondData.showcaseTokenName) !== null && _k !== void 0 ? _k : bondData.earnToken.symbol, size: 50, chain: bondData.chainId }) }), _jsx(Flex, { className: "title-container bondname", children: bondData === null || bondData === void 0 ? void 0 : bondData.showcaseTokenName }), _jsxs(Flex, { className: "title-container price-container", children: [_jsxs(Flex, { className: "price-container price", children: ["$", earnTokenPrice(bondData)] }), _jsxs(Flex, { className: "price-container discounted", children: ["$", discountEarnTokenPrice(bondData)] })] }), _jsx(Flex, { className: "title-container tokentags", children: _jsx(ListTag, { text: (_l = bondData === null || bondData === void 0 ? void 0 : bondData.tags) === null || _l === void 0 ? void 0 : _l[0], variant: ((_m = bondData === null || bondData === void 0 ? void 0 : bondData.tags) === null || _m === void 0 ? void 0 : _m[0]) === 'Cex Fund' ? 'cex_fund' : 'liquidity' }) })] }), _jsx(Flex, { className: "modaltable-container description-container", children: bondData === null || bondData === void 0 ? void 0 : bondData.shortDescription }), _jsxs(Flex, { className: "modaltable-container blocks-container", children: [_jsxs(Flex, { className: "modal-block block-discount ".concat(getDiscountColor(bondData === null || bondData === void 0 ? void 0 : bondData.discount)), children: [_jsxs(Flex, { className: "block-header", children: ["Discount", _jsx(TooltipBubble, { className: "tooltip-bubble", body: _jsx(Flex, { children: TooltipText.Discount }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, -5%)", children: _jsx(Flex, { className: "header-icon", children: _jsx(Svg, { icon: "questionCircle", width: "12px" }) }) })] }), _jsx(Flex, { className: "block-content", children: "".concat((_o = bondData === null || bondData === void 0 ? void 0 : bondData.discount) === null || _o === void 0 ? void 0 : _o.toFixed(2), "%") })] }), _jsxs(Flex, { className: "modal-block block-arr", children: [_jsxs(Flex, { className: "block-header", children: ["ARR", _jsx(TooltipBubble, { className: "tooltip-bubble", body: _jsx(Flex, { children: TooltipText.ARR }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, -5%)", children: _jsx(Flex, { className: "header-icon", children: _jsx(Svg, { icon: "questionCircle", width: "12px" }) }) })] }), _jsx(Flex, { className: "block-content", children: "".concat(((((_p = bondData === null || bondData === void 0 ? void 0 : bondData.discount) !== null && _p !== void 0 ? _p : 0) * 365) / vestingTime((_q = bondData === null || bondData === void 0 ? void 0 : bondData.vestingTerm) !== null && _q !== void 0 ? _q : 0).days).toFixed(2), "%") })] }), _jsxs(Flex, { className: "modal-block block-term", children: [_jsxs(Flex, { className: "block-header", children: ["Terms", _jsx(TooltipBubble, { className: "tooltip-bubble", body: _jsx(Flex, { children: TooltipText.Terms }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, -5%)", children: _jsx(Flex, { className: "header-icon", children: _jsx(Svg, { icon: "questionCircle", width: "12px" }) }) })] }), _jsx(Flex, { className: "block-content", children: vestingTime((_r = bondData === null || bondData === void 0 ? void 0 : bondData.vestingTerm) !== null && _r !== void 0 ? _r : 0).days
-                                                        ? "".concat(vestingTime((_s = bondData === null || bondData === void 0 ? void 0 : bondData.vestingTerm) !== null && _s !== void 0 ? _s : 0).days, " D")
-                                                        : '-' })] }), _jsxs(Flex, { className: "modal-block block-maxbuy", children: [_jsxs(Flex, { className: "block-header", children: ["Max Buy", _jsx(TooltipBubble, { className: "tooltip-bubble", body: _jsx(Flex, { children: TooltipText.MaxBuy(bondData.earnToken.symbol) }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, -5%)", children: _jsx(Flex, { className: "header-icon", children: _jsx(Svg, { icon: "questionCircle", width: "12px" }) }) })] }), _jsx(Flex, { className: "block-content", children: (_t = parseFloat(maxBuy(bondData).toFixed(0))) === null || _t === void 0 ? void 0 : _t.toLocaleString('en-US') })] })] }), _jsxs(Flex, { className: "modaltable-container text-container", children: [_jsxs(Flex, { className: "text-container row", children: [_jsx(Flex, { className: "row-container spend", children: "You spend:" }), _jsxs(Flex, { className: "row-container spend-val", children: [youSpend(inputValue), " ", bondData.lpToken.symbol, " = $", ' ', formatUSDNumber(youSpendUSD(bondData, inputValue))] })] }), _jsxs(Flex, { className: "text-container row", children: [_jsxs(Flex, { className: "row-container premium", children: ["Premium:", _jsx(TooltipBubble, { className: "tooltip-bubble", body: _jsx(Flex, { children: TooltipText.Premium }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, -5%)", children: _jsx(Flex, { className: "row-container premium-icon", children: _jsx(Svg, { icon: "questionCircle", width: "12px" }) }) })] }), _jsxs(Flex, { className: "row-container premium-val ".concat(getPremiumColor(bondData, inputValue)), children: ["$ ", premium(bondData, inputValue)] })] }), _jsxs(Flex, { className: "text-container row", children: [_jsxs(Flex, { className: "row-container get", children: ["You get (over ", vestingTime((_u = bondData === null || bondData === void 0 ? void 0 : bondData.vestingTerm) !== null && _u !== void 0 ? _u : 0).days, " days):"] }), _jsxs(Flex, { className: "row-container get-val", children: [youGet(bondData, inputValue), " ", bondData === null || bondData === void 0 ? void 0 : bondData.showcaseTokenName, " = $", ' ', formatUSDNumber(youGetUSD(bondData, inputValue))] })] })] }), _jsx(TokenSelectorPanel, { typedValue: inputValue, setTypedValue: setInputValue, selectedToken: inputToken, handleMaxBtn: function () { var _a; return setInputValue((_a = new BigNumber(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: true, bondPrincipalToken: bondData === null || bondData === void 0 ? void 0 : bondData.lpToken, tokenBalance: inputCurrencyBalance, selectedTokenPrice: inputTokenPrice === null || inputTokenPrice === void 0 ? void 0 : inputTokenPrice.price }), _jsxs(Flex, { className: "modaltable-container button-container", children: [_jsx(Flex, { className: "button-container get", children: _jsxs(Button, { className: "action-button", onClick: onOpenZapModal, children: ["Get ", bondData === null || bondData === void 0 ? void 0 : bondData.lpToken.symbol] }) }), _jsx(Flex, { className: "button-container buy", children: chainId !== bondData.chainId ? (_jsx(Button, { className: "switch-button", disabled: isPending || isConfirming || (bondData === null || bondData === void 0 ? void 0 : bondData.soldOut) || !account, onClick: function (event) {
-                                                    event.stopPropagation();
-                                                    switchChain({ chainId: bondData.chainId });
-                                                }, children: !account ? 'Connect Wallet' : "Switch to ".concat(NETWORK_LABEL[bondData.chainId]) })) : approvalState === ApprovalState.APPROVED ? (_jsx(Button, { className: "action-button", disabled: isPending ||
-                                                    isConfirming ||
-                                                    (bondData === null || bondData === void 0 ? void 0 : bondData.soldOut) ||
-                                                    !account ||
-                                                    !inputValue ||
-                                                    parseFloat(inputValue) === 0, onClick: function () {
-                                                    setLoadingTx(true);
-                                                    //TODO: probably we should add handlers
-                                                    if (isZap) {
-                                                        soulZapCallback().finally(function () { return setLoadingTx(false); });
-                                                    }
-                                                    else {
-                                                        handleBuy().finally(function () { return setLoadingTx(false); });
-                                                    }
-                                                }, children: isZap ? 'zap' : 'buy' })) : (_jsxs(Button, { className: "action-button", load: loadingTx, disabled: loadingTx ||
-                                                    isPending ||
-                                                    isConfirming ||
-                                                    (bondData === null || bondData === void 0 ? void 0 : bondData.soldOut) ||
-                                                    !account ||
-                                                    !inputValue ||
-                                                    parseFloat(inputValue) === 0, onClick: handleApproveCallback, children: ["approve ", isZap ? 'zap' : 'normal'] })) })] }), accordionVisible && (_jsx(Flex, { className: "modaltable-container accordion-container", children: _jsx(AccordionText, { title: accordionTitle, body: accordionBody, isVisible: accordionVisible }) }))] })] }) })) : (
-            //
-            //
-            // ALTERNATIVE VIEW!!
-            //
-            //
-            _jsx(Flex, { className: "modal-backdrop", onClick: onClose, children: _jsxs(Flex, { className: "modal-content font-small", onClick: function (event) { return event.stopPropagation(); }, children: [toastMessage && _jsx(Flex, { className: "toast", children: toastMessage }), _jsx(Flex, { className: "modal-header", children: _jsx(Flex, { className: "svg-close", onClick: onClose, children: _jsx(Svg, { icon: "close" }) }) }), _jsxs(Flex, { className: "modaltable-container", sx: { flexDirection: 'row', gap: '20px' }, children: [_jsxs(Flex, { sx: { width: '500px', flexDirection: 'column' }, children: [_jsx("img", { src: "https://placehold.co/400x200" }), _jsx(Flex, { className: "modaltable-container description-container paragraph-spaced", sx: { marginTop: '20px' }, children: bondData === null || bondData === void 0 ? void 0 : bondData.shortDescription })] }), _jsxs(Flex, { sx: { flexDirection: 'column', width: '600px' }, children: [_jsxs(Flex, { sx: { alignItems: 'center' }, children: [_jsx(Flex, { sx: { minWidth: '300px' }, children: _jsxs("h2", { sx: { margin: '0px' }, children: [bondData === null || bondData === void 0 ? void 0 : bondData.showcaseTokenName, ' ', _jsx(Svg, { width: 20, height: 20, icon: (_v = NETWORK_ICONS === null || NETWORK_ICONS === void 0 ? void 0 : NETWORK_ICONS[bondData.chainId]) !== null && _v !== void 0 ? _v : 'question' })] }) }), _jsxs(Flex, { sx: { justifyContent: 'space-between', flexGrow: 1 }, children: [_jsx(TokenImage, { symbol: (_w = bondData.showcaseTokenName) !== null && _w !== void 0 ? _w : bondData.earnToken.symbol, size: 20 }), _jsx("span", { children: bondData.earnToken.symbol }), " ", _jsx("span", { children: "|" }), ' ', _jsxs("span", { children: ["Market Price: $", earnTokenPrice(bondData)] })] })] }), _jsxs(Flex, { sx: { flexDirection: 'column', marginTop: '20px' }, children: [_jsx(TokenSelectorPanel, { typedValue: inputValue, setTypedValue: setInputValue, selectedToken: inputToken, handleMaxBtn: function () { var _a; return setInputValue((_a = new BigNumber(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: true, bondPrincipalToken: bondData === null || bondData === void 0 ? void 0 : bondData.lpToken, tokenBalance: inputCurrencyBalance, selectedTokenPrice: inputTokenPrice === null || inputTokenPrice === void 0 ? void 0 : inputTokenPrice.price }), _jsxs(Flex, { sx: { justifyContent: 'space-between', alignItems: 'center' }, children: [_jsxs(Flex, { children: ["You will receive:", _jsx(Flex, { sx: { marginLeft: '15px', marginRight: '5px' }, children: _jsx(TokenImage, { symbol: (_x = bondData.showcaseTokenName) !== null && _x !== void 0 ? _x : bondData.earnToken.symbol, size: 20 }) }), (toNumber(inputValue) / toNumber(earnTokenPrice(bondData))).toFixed(2), ' ', bondData.earnToken.symbol, " + \u00A0", (toNumber(youGet(bondData, inputValue)) -
-                                                                    toNumber(inputValue) / toNumber(earnTokenPrice(bondData))).toFixed(2), _jsx("span", { className: "text-highlight", children: "\u00A0additional" })] }), _jsx(Flex, { className: "button-container buy", sx: { justifyContent: 'end' }, children: chainId !== bondData.chainId ? (_jsx(Button, { className: "switch-button button-narrow", disabled: isPending || isConfirming || (bondData === null || bondData === void 0 ? void 0 : bondData.soldOut) || !account, onClick: function (event) {
-                                                                    event.stopPropagation();
-                                                                    switchChain({ chainId: bondData.chainId });
-                                                                }, children: !account ? 'Connect Wallet' : "Switch to ".concat(NETWORK_LABEL[bondData.chainId]) })) : approvalState === ApprovalState.NOT_APPROVED ||
-                                                                approvalState === ApprovalState.PENDING ? (_jsx(Button, { className: "action-button", disabled: isPending || isConfirming || (bondData === null || bondData === void 0 ? void 0 : bondData.soldOut) || !account, onClick: approveCallback, children: "approve" })) : (_jsx(Button, { className: "action-button", disabled: isPending || isConfirming || (bondData === null || bondData === void 0 ? void 0 : bondData.soldOut) || !account, onClick: handleBuy, children: "buy" })) })] }), _jsx(Flex, { sx: { width: '100%', marginTop: '10px', marginBottom: '10px' }, children: _jsx("hr", { className: "fading-hr" }) }), _jsxs(Flex, { sx: { width: '100%' }, children: [_jsxs(Flex, { sx: { width: '50%', flexDirection: 'column' }, children: ["Market Price: $", formatUSDNumber((toNumber(youGet(bondData, inputValue)) * toNumber(earnTokenPrice(bondData))).toString()), _jsx("hr", { className: "fading-hr" }), _jsx("span", { className: "text-highlight flex-inline", children: "Our price: " }), _jsxs("span", { className: "flex-inline", children: ["$", formatUSDNumber((toNumber(inputValue) * 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(Flex, { sx: { width: '50px', alignItems: 'center', justifyContent: 'center' }, children: "vs." }), _jsxs(Flex, { sx: { width: '50%', flexDirection: 'column' }, children: ["If purchased from market:", ' ', (toNumber(inputValue) / toNumber(earnTokenPrice(bondData))).toFixed(0), ' ', bondData.earnToken.symbol, _jsx("hr", { className: "fading-hr" }), _jsx("span", { className: "text-highlight flex-inline", children: "Amount you will get:" }), ' ', youGet(bondData, inputValue), ' ', _jsx("span", { className: "flex-inline", children: bondData.earnToken.symbol })] })] })] })] })] }), _jsxs(Flex, { className: "footer-details", children: [_jsxs(Flex, { sx: { width: '25%', justifyContent: 'center' }, children: ["Vesting start date: ", moment().format('DD-MMM-YYYY')] }), _jsxs(Flex, { sx: { width: '25%', justifyContent: 'center' }, children: ["Vesting end date:", ' ', moment()
-                                            .add(vestingTime((_y = bondData === null || bondData === void 0 ? void 0 : bondData.vestingTerm) !== null && _y !== void 0 ? _y : 0).days, 'days')
-                                            .format('DD-MMM-YYYY')] }), _jsx(Flex, { sx: { width: '25%', justifyContent: 'center' }, children: "Vesting type: Linear" }), _jsx(Flex, { sx: { width: '25%', justifyContent: 'center' }, children: "What are bonds?" })] }), accordionVisible && (_jsx(Flex, { className: "modaltable-container accordion-container", children: _jsx(AccordionText, { title: accordionTitle, body: accordionBody, isVisible: accordionVisible }) }))] }) })) })) }));
-};
-export default BondModal;

package/dist/views/BondModal/helper.js

@@ -1,54 +0,0 @@
-import BigNumber from "bignumber.js";
-import { formatNumberSI } from "../../utils/formatNumber";
-function formatNumber(input) {
-    var number = new BigNumber(input);
-    if (number.isNaN())
-        return '0';
-    return number.gt(1000000)
-        ? formatNumberSI(number.toNumber())
-        : number.gt(1000)
-            ? number.toNumber().toLocaleString(undefined, { maximumFractionDigits: 0 })
-            : number.gt(0.01)
-                ? parseFloat(number.toFixed(2)).toLocaleString(undefined)
-                : parseFloat(number.toPrecision(5)).toLocaleString(undefined);
-}
-function formatUSDNumber(input) {
-    var number = new BigNumber(input);
-    if (number.isNaN())
-        return '0';
-    // If the number is greater than 0 but less than 0.01
-    if (number.gt(0) && number.lt(0.01)) {
-        return '< 0.01';
-    }
-    // If the number is greater than 1k, round to no decimals.
-    if (number.gt(1000)) {
-        return number.toNumber().toLocaleString(undefined, { maximumFractionDigits: 0 });
-    }
-    // Note: Between 1k and 0.01 show 2 decimals
-    return parseFloat(number.toFixed(2)).toLocaleString(undefined);
-}
-var youSpend = function (inputValue) { return formatNumber(inputValue); };
-var youSpendUSD = function (bond, inputValue) {
-    return (parseFloat(inputValue) * parseFloat(bond.principalTokenPrice)).toString();
-};
-var youGet = function (bond, inputValue) {
-    var _a;
-    var bigValue = new BigNumber(inputValue).times(new BigNumber(10).pow(18));
-    var billValue = bigValue.div(new BigNumber((_a = bond.trueBillPrice) !== null && _a !== void 0 ? _a : 0));
-    return formatNumber(billValue.toString());
-};
-var youGetUSD = function (bond, inputValue) {
-    var _a;
-    var bigValue = new BigNumber(inputValue).times(new BigNumber(10).pow(18));
-    var billValue = bigValue.div(new BigNumber((_a = bond.trueBillPrice) !== null && _a !== void 0 ? _a : 0));
-    return (billValue.toNumber() * parseFloat(bond.payoutTokenPrice)).toString();
-};
-var premium = function (bond, inputValue) {
-    var premiumUSD = parseFloat(youGetUSD(bond, inputValue)) - parseFloat(youSpendUSD(bond, inputValue));
-    return formatUSDNumber(premiumUSD.toString());
-};
-var getPremiumColor = function (bond, inputValue) {
-    var getPremium = premium(bond, inputValue);
-    return parseFloat(getPremium) < 0 ? 'premium-negative' : 'premium-positive';
-};
-export { formatNumber, formatUSDNumber, youSpend, youSpendUSD, youGet, youGetUSD, premium, getPremiumColor };

package/dist/views/BondModal/index.js

@@ -1,18 +0,0 @@
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-import { jsx as _jsx } from "theme-ui/jsx-runtime";
-import Providers from "../../providers";
-import BondModal from "./BondModal";
-var BondModalWithProviders = function (props) {
-    return (_jsx(Providers, { children: _jsx(BondModal, __assign({}, props)) }));
-};
-export default BondModalWithProviders;

package/dist/views/Bonds/Bonds.js

@@ -1,174 +0,0 @@
-var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
-    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
-        if (ar || !(i in from)) {
-            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
-            ar[i] = from[i];
-        }
-    }
-    return to.concat(ar || Array.prototype.slice.call(from));
-};
-import { jsx as _jsx, jsxs as _jsxs } from "theme-ui/jsx-runtime";
-/** @jsxImportSource theme-ui */
-import { useCallback, useEffect, useMemo, useState } from 'react';
-import { Flex, Spinner, ThemeUIProvider } from 'theme-ui';
-import axios from 'axios';
-import getTimePeriods from '../../utils/getTimePeriods';
-import { defaultTheme } from '../../theme';
-import { BigNumber } from 'bignumber.js';
-import { ChainId } from '../../enum/apeswaplists';
-import '../../scss/Bonds.scss';
-import BondRowHeader from '../../components/BondRows/BondRowHeader';
-import BondRowsByChain from '../../components/BondRows/BondRowsByChain';
-import { useTopTags } from '../../hooks/useTopThreeTags';
-import useChainFilterOption from '../../components/BondMenu/useChainFilterOption';
-var Bonds = function (_a) {
-    // const navigate = useNavigate();
-    var account = _a.account, accountChainId = _a.accountChainId, isActive = _a.isActive, _b = _a.chains, chains = _b === void 0 ? [] : _b;
-    // Fetch data
-    var _c = useState([]), bondData = _c[0], setBondData = _c[1];
-    var _d = useState([]), hotBonds = _d[0], setHotBonds = _d[1];
-    var isSoldOut = useCallback(function (bond) {
-        var _a, _b;
-        var thresholdToHide = new BigNumber(100).div((_a = bond.payoutTokenPrice) !== null && _a !== void 0 ? _a : 0);
-        if (bond.soldOut)
-            return true;
-        if (bond.discount == null)
-            return true;
-        if (!bond.tokensRemaining)
-            return false;
-        if (bond.discount && bond.discount > 25 && bond.chainId === ChainId.BASE /*BASE*/)
-            return true;
-        return ((_b = new BigNumber(bond.tokensRemaining)) === null || _b === void 0 ? void 0 : _b.lte(thresholdToHide)) || bond.discount === 100;
-    }, []);
-    useEffect(function () {
-        axios.get('https://realtime-api.ape.bond/bonds').then(function (response) {
-            var bonds = response.data.bonds;
-            setBondData(bonds);
-        });
-    }, []);
-    useEffect(function () {
-        axios.get('https://apeswap-strapi.herokuapp.com/hot-bonds').then(function (response) {
-            var hotBondAddresses = response.data.map(function (bond) {
-                return bond.BondAddress.toLowerCase();
-            });
-            setHotBonds(hotBondAddresses);
-        });
-    }, [bondData]);
-    // Sort functions
-    var sortedHotBonds = bondData.sort(function (a, b) {
-        var _a, _b;
-        var aIsHot = hotBonds.includes(a.billAddress.toLowerCase()) && ((_a = a.discount) !== null && _a !== void 0 ? _a : 0) > 0;
-        var bIsHot = hotBonds.includes(b.billAddress.toLowerCase()) && ((_b = b.discount) !== null && _b !== void 0 ? _b : 0) > 0;
-        if (aIsHot && !bIsHot) {
-            return -1;
-        }
-        else if (!aIsHot && bIsHot) {
-            return 1;
-        }
-        else {
-            return b.discount - a.discount;
-        }
-    });
-    var _e = useState(null), sortConfig = _e[0], setSortConfig = _e[1];
-    var _f = useState(sortedHotBonds), sortedBonds = _f[0], setSortedBonds = _f[1];
-    var handleSort = function (key) {
-        var direction = 'asc';
-        if ((sortConfig === null || sortConfig === void 0 ? void 0 : sortConfig.key) === key && (sortConfig === null || sortConfig === void 0 ? void 0 : sortConfig.direction) === 'asc') {
-            direction = 'desc';
-        }
-        setSortConfig({ key: key, direction: direction });
-    };
-    useEffect(function () {
-        if (sortConfig === null) {
-            setSortedBonds(sortedHotBonds);
-            return;
-        }
-        var sorted = __spreadArray([], bondData, true).sort(function (a, b) {
-            var aValue, bValue;
-            if (sortConfig.key === 'arr') {
-                aValue = calculateARR(a);
-                bValue = calculateARR(b);
-            }
-            else if (sortConfig.key === 'tokensRemaining') {
-                aValue = remainingPercentage(a);
-                bValue = remainingPercentage(b);
-            }
-            else if (sortConfig.key === 'terms') {
-                aValue = vestingTime(a.vestingTerm).days;
-                bValue = vestingTime(b.vestingTerm).days;
-            }
-            else {
-                aValue = a[sortConfig.key];
-                bValue = b[sortConfig.key];
-            }
-            if (aValue < bValue) {
-                return sortConfig.direction === 'asc' ? -1 : 1;
-            }
-            if (aValue > bValue) {
-                return sortConfig.direction === 'asc' ? 1 : -1;
-            }
-            return 0;
-        });
-        setSortedBonds(sorted);
-    }, [sortConfig, bondData]);
-    // Functions for calcuations
-    var vestingTime = function (vestingTerm) {
-        return getTimePeriods(vestingTerm !== null && vestingTerm !== void 0 ? vestingTerm : 0, true);
-    };
-    var remainingPercentage = function (bond) {
-        var _a, _b;
-        var totalMaxPayout = new BigNumber((_a = bond.maxTotalPayout) !== null && _a !== void 0 ? _a : '0').div(new BigNumber(10).pow(bond.earnToken.decimals[bond.chainId]));
-        var remainingTokens = new BigNumber((_b = bond.tokensRemaining) !== null && _b !== void 0 ? _b : '0');
-        return remainingTokens.div(totalMaxPayout).times(100).toNumber();
-    };
-    var calculateARR = function (bond) {
-        var _a;
-        var discount = (_a = bond === null || bond === void 0 ? void 0 : bond.discount) !== null && _a !== void 0 ? _a : 0;
-        var vestingDays = vestingTime(bond.vestingTerm).days;
-        return parseFloat((((discount * 365) / vestingDays).toFixed(2)));
-    };
-    // Search logic
-    var _g = useState(''), inputValue = _g[0], setInputValue = _g[1];
-    var topTags = useTopTags(sortedBonds);
-    var filterOptions = __spreadArray(__spreadArray(['ALL'], topTags, true), ['SOLD OUT'], false);
-    var _h = useState(filterOptions[0]), filterOption = _h[0], setFilterOption = _h[1];
-    var _j = useChainFilterOption(), chainFilterOption = _j.data, setChainFilterOption = _j.setChainFilterOption;
-    var billstoRender = useMemo(function () {
-        var billsToReturn = sortedBonds !== null && sortedBonds !== void 0 ? sortedBonds : [];
-        if (inputValue) {
-            billsToReturn = billsToReturn === null || billsToReturn === void 0 ? void 0 : billsToReturn.filter(function (bill) {
-                var _a;
-                return "".concat(bill.earnToken.symbol.toUpperCase(), ",\n                ").concat(bill.lpToken.symbol.toUpperCase(), ",\n                ").concat((_a = bill === null || bill === void 0 ? void 0 : bill.showcaseTokenName) === null || _a === void 0 ? void 0 : _a.toUpperCase()).includes(inputValue.toUpperCase());
-            });
-        }
-        if (topTags.includes(filterOption)) {
-            billsToReturn = billsToReturn === null || billsToReturn === void 0 ? void 0 : billsToReturn.filter(function (bill) { var _a; return (_a = bill === null || bill === void 0 ? void 0 : bill.tags) === null || _a === void 0 ? void 0 : _a.includes(filterOption); });
-        }
-        if (!(chainFilterOption === null || chainFilterOption === void 0 ? void 0 : chainFilterOption.includes('All Chains'))) {
-            billsToReturn = billsToReturn === null || billsToReturn === void 0 ? void 0 : billsToReturn.filter(function (bill) { return chainFilterOption === null || chainFilterOption === void 0 ? void 0 : chainFilterOption.includes(bill.chainId.toString()); });
-        }
-        if (filterOption !== 'SOLD OUT') {
-            billsToReturn = billsToReturn === null || billsToReturn === void 0 ? void 0 : billsToReturn.filter(function (bond) { return !isSoldOut(bond); });
-        }
-        else {
-            billsToReturn = billsToReturn === null || billsToReturn === void 0 ? void 0 : billsToReturn.filter(function (bond) { return bond.soldOut; });
-        }
-        return billsToReturn;
-    }, [filterOption, bondData, inputValue, chainFilterOption, topTags]);
-    var handleChangeFilterOption = useCallback(function (newOption) {
-        setFilterOption(newOption);
-    }, []);
-    var handleInputChange = function (event) {
-        setInputValue(event.target.value);
-    };
-    // Page render logic
-    var _k = useState(false), bondsRendered = _k[0], setBondsRendered = _k[1];
-    useEffect(function () {
-        if (billstoRender.length > 0) {
-            setBondsRendered(true);
-        }
-    }, [billstoRender]);
-    return (_jsx(ThemeUIProvider, { theme: defaultTheme, children: !bondsRendered ? (_jsxs(Flex, { className: "bonds-spinner", children: [" ", _jsx(Spinner, { size: 100 }), " "] }))
-            : (_jsxs(Flex, { className: "bonds-container table-container", children: [_jsx(BondRowHeader, { inputValue: inputValue, setChainFilterOption: setChainFilterOption, chainFilterOption: chainFilterOption !== null && chainFilterOption !== void 0 ? chainFilterOption : ['All Chains'], filterOptions: filterOptions, filterOption: filterOption, setFilterOption: handleChangeFilterOption, onInputChange: handleInputChange, onHandleQueryChange: setInputValue, onSort: handleSort }), _jsx(BondRowsByChain, { chains: chains, bonds: billstoRender, hotBonds: hotBonds, hideTitles: inputValue !== '' })] })) }));
-};
-export default Bonds;

package/dist/views/Bonds/index.js

@@ -1,18 +0,0 @@
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-import { jsx as _jsx } from "theme-ui/jsx-runtime";
-import Providers from "../../providers";
-import Bonds from "./Bonds";
-var BondsWithProviders = function (props) {
-    return (_jsx(Providers, { children: _jsx(Bonds, __assign({}, props)) }));
-};
-export default BondsWithProviders;