@ape.swap/bonds-sdk 1.0.114 → 1.0.116

package/dist/components/BondModal/BondModal.js

@@ -12,7 +12,7 @@ var __assign = (this && this.__assign) || function () {
 import { jsxs as _jsxs, jsx as _jsx } from "theme-ui/jsx-runtime";
 /** @jsxImportSource theme-ui */
 import React, { useEffect, useState } from 'react';
-import { Flex, ThemeUIProvider, Input } from 'theme-ui';
+import { Flex, ThemeUIProvider } from 'theme-ui';
 import { useWeb3React } from '@web3-react/core';
 import { defaultTheme } from '../../theme';
 import '../../scss/bondmodal.scss';
@@ -22,6 +22,7 @@ import Svg from '../uikit/Svg';
 import axios from 'axios';
 import { BigNumber } from 'bignumber.js';
 import { getFirstNonZeroDigits } from '../../utils/roundNumber';
+import { NumericInput } from '../uikit';
 var BondModal = function (_a) {
     var isOpen = _a.isOpen, onClose = _a.onClose, bondAddress = _a.bondAddress;
     if (!isOpen)
@@ -58,9 +59,17 @@ var BondModal = function (_a) {
         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.payoutTokenDecimals) !== null && _d !== void 0 ? _d : 18));
         return !available ? 0 : (singlePurchaseLimit.lt(safeAvailable) ? singlePurchaseLimit : safeAvailable);
     };
+    var _d = useState(''), inputValue = _d[0], setInputValue = _d[1];
+    var handleInputChange = function (event) {
+        setInputValue(event.target.value);
+    };
+    var calculateResult = function () {
+        var result = Number(inputValue) * 2;
+        return result.toFixed(2);
+    };
     return (_jsx(ThemeUIProvider, __assign({ theme: defaultTheme }, { children: bondData.map(function (bond) {
             var _a, _b, _c, _d, _e, _f;
-            return (_jsx(React.Fragment, { children: _jsx(Flex, __assign({ className: "modal modal-backdrop" }, { children: _jsxs(Flex, __assign({ className: "modal modal-content" }, { children: [isActive && account && (_jsxs("p", { children: ["Wallet Address: ", account] })), _jsxs(Flex, __assign({ className: "modal modal-header" }, { children: [_jsx(Flex, __assign({ className: "new" }, { children: "NEW" })), _jsxs(Flex, __assign({ className: "project-info" }, { children: ["Project Info", _jsx(Flex, __assign({ className: "project-info icon" }, { children: _jsx(Svg, { icon: "expand" }) }))] })), _jsx(Flex, __assign({ className: "svg-close", onClick: onClose }, { children: _jsx(Svg, { icon: "close" }) }))] })), _jsxs(Flex, __assign({ className: "modal-container table-container" }, { children: [_jsxs(Flex, __assign({ className: "modal-container title-container" }, { children: [_jsx(Flex, __assign({ className: "title-container bond" }, { children: bond === null || bond === void 0 ? void 0 : bond.showcaseTokenName })), _jsxs(Flex, __assign({ className: "title-container bond-price" }, { children: [_jsxs(Flex, __assign({ className: "bond-price price" }, { children: ["$", earnTokenPrice(bond)] })), _jsxs(Flex, __assign({ className: "bond-price discounted" }, { children: ["$", discountEarnTokenPrice(bond)] }))] }))] })), _jsx(Flex, __assign({ className: "modal-container description-container" }, { children: bond === null || bond === void 0 ? void 0 : bond.shortDescription })), _jsxs(Flex, __assign({ className: "modal-container blocks-container" }, { children: [_jsxs(Flex, __assign({ className: "modal-block column-discount ".concat(getDiscountColor(bond === null || bond === void 0 ? void 0 : bond.discount)) }, { children: [_jsxs(Flex, __assign({ className: "block-header header" }, { children: ["Discount", _jsx(Flex, __assign({ className: "block-header icon" }, { children: _jsx(Svg, { icon: "questionFill", width: "15px" }) }))] })), "".concat((_a = bond === null || bond === void 0 ? void 0 : bond.discount) === null || _a === void 0 ? void 0 : _a.toFixed(2), "%")] })), _jsxs(Flex, __assign({ className: "modal-block column-arr" }, { children: [_jsxs(Flex, __assign({ className: "block-header header" }, { children: ["ARR", _jsx(Flex, __assign({ className: "block-header icon" }, { children: _jsx(Svg, { icon: "questionFill", width: "15px" }) }))] })), "".concat(((((_b = bond === null || bond === void 0 ? void 0 : bond.discount) !== null && _b !== void 0 ? _b : 0) * 365) / vestingTime((_c = bond === null || bond === void 0 ? void 0 : bond.vestingTerm) !== null && _c !== void 0 ? _c : 0).days).toFixed(2), "%")] })), _jsxs(Flex, __assign({ className: "modal-block column-term" }, { children: [_jsxs(Flex, __assign({ className: "block-header header" }, { children: ["Terms", _jsx(Flex, __assign({ className: "block-header icon" }, { children: _jsx(Svg, { icon: "questionFill", width: "15px" }) }))] })), vestingTime((_d = bond === null || bond === void 0 ? void 0 : bond.vestingTerm) !== null && _d !== void 0 ? _d : 0).days ? "".concat(vestingTime((_e = bond === null || bond === void 0 ? void 0 : bond.vestingTerm) !== null && _e !== void 0 ? _e : 0).days, " D") : '-'] })), _jsxs(Flex, __assign({ className: "modal-block column-maxbuy" }, { children: [_jsxs(Flex, __assign({ className: "block-header header" }, { children: ["Max Buy", _jsx(Flex, __assign({ className: "block-header icon" }, { children: _jsx(Svg, { icon: "questionFill", width: "15px" }) }))] })), (_f = parseFloat(maxBuy(bond).toFixed(0))) === null || _f === void 0 ? void 0 : _f.toLocaleString('en-US')] }))] })), _jsxs(Flex, __assign({ className: "modal-container text-container" }, { children: [_jsxs(Flex, __assign({ className: "text-container row" }, { children: [_jsx("div", { children: "You spend:" }), _jsxs("div", { children: ["0 ", bond === null || bond === void 0 ? void 0 : bond.principalTokenName, " = $ 0"] })] })), _jsxs(Flex, __assign({ className: "text-container row" }, { children: [_jsxs("div", { children: ["Premium: ", _jsx(Svg, { icon: "questionFill", width: "15px" })] }), _jsx("div", { children: "$ 0" })] })), _jsxs(Flex, __assign({ className: "text-container row" }, { children: [_jsx("div", { children: "You get (over 90 days):" }), _jsxs("div", { children: ["0 ", bond === null || bond === void 0 ? void 0 : bond.showcaseTokenName, " = $ 0"] })] }))] })), _jsxs(Flex, __assign({ className: "modal-container input-container" }, { children: [_jsx(Flex, __assign({ className: "input-container input" }, { children: _jsx(Input, { type: "number", className: "number-input", placeholder: "0.0" }) })), _jsx(Flex, __assign({ className: "input-container token" }, { children: bond === null || bond === void 0 ? void 0 : bond.principalTokenName }))] })), _jsxs(Flex, __assign({ className: "modal-container button-container" }, { children: [_jsx(Flex, __assign({ className: "button-container get" }, { children: _jsxs(Button, { children: ["Get ", bond === null || bond === void 0 ? void 0 : bond.principalTokenName] }) })), _jsx(Flex, __assign({ className: "button-container buy" }, { children: _jsxs(Button, { children: ["Buy ", bond === null || bond === void 0 ? void 0 : bond.showcaseTokenName] }) }))] }))] }))] })) })) }, bond.billAddress));
+            return (_jsx(React.Fragment, { children: _jsx(Flex, __assign({ className: "modal modal-backdrop" }, { children: _jsxs(Flex, __assign({ className: "modal modal-content" }, { children: [isActive && account && (_jsxs("p", { children: ["Wallet Address: ", account] })), _jsxs(Flex, __assign({ className: "modal modal-header" }, { children: [_jsx(Flex, __assign({ className: "new" }, { children: "NEW" })), _jsxs(Flex, __assign({ className: "project-info" }, { children: ["Project Info", _jsx(Flex, __assign({ className: "project-info icon" }, { children: _jsx(Svg, { icon: "expand" }) }))] })), _jsx(Flex, __assign({ className: "svg-close", onClick: onClose }, { children: _jsx(Svg, { icon: "close" }) }))] })), _jsxs(Flex, __assign({ className: "modal-container table-container" }, { children: [_jsxs(Flex, __assign({ className: "modal-container title-container" }, { children: [_jsx(Flex, __assign({ className: "title-container bond" }, { children: bond === null || bond === void 0 ? void 0 : bond.showcaseTokenName })), _jsxs(Flex, __assign({ className: "title-container bond-price" }, { children: [_jsxs(Flex, __assign({ className: "bond-price price" }, { children: ["$", earnTokenPrice(bond)] })), _jsxs(Flex, __assign({ className: "bond-price discounted" }, { children: ["$", discountEarnTokenPrice(bond)] }))] }))] })), _jsx(Flex, __assign({ className: "modal-container description-container" }, { children: bond === null || bond === void 0 ? void 0 : bond.shortDescription })), _jsxs(Flex, __assign({ className: "modal-container blocks-container" }, { children: [_jsxs(Flex, __assign({ className: "modal-block column-discount ".concat(getDiscountColor(bond === null || bond === void 0 ? void 0 : bond.discount)) }, { children: [_jsxs(Flex, __assign({ className: "block-header header" }, { children: ["Discount", _jsx(Flex, __assign({ className: "block-header icon" }, { children: _jsx(Svg, { icon: "questionFill", width: "15px" }) }))] })), "".concat((_a = bond === null || bond === void 0 ? void 0 : bond.discount) === null || _a === void 0 ? void 0 : _a.toFixed(2), "%")] })), _jsxs(Flex, __assign({ className: "modal-block column-arr" }, { children: [_jsxs(Flex, __assign({ className: "block-header header" }, { children: ["ARR", _jsx(Flex, __assign({ className: "block-header icon" }, { children: _jsx(Svg, { icon: "questionFill", width: "15px" }) }))] })), "".concat(((((_b = bond === null || bond === void 0 ? void 0 : bond.discount) !== null && _b !== void 0 ? _b : 0) * 365) / vestingTime((_c = bond === null || bond === void 0 ? void 0 : bond.vestingTerm) !== null && _c !== void 0 ? _c : 0).days).toFixed(2), "%")] })), _jsxs(Flex, __assign({ className: "modal-block column-term" }, { children: [_jsxs(Flex, __assign({ className: "block-header header" }, { children: ["Terms", _jsx(Flex, __assign({ className: "block-header icon" }, { children: _jsx(Svg, { icon: "questionFill", width: "15px" }) }))] })), vestingTime((_d = bond === null || bond === void 0 ? void 0 : bond.vestingTerm) !== null && _d !== void 0 ? _d : 0).days ? "".concat(vestingTime((_e = bond === null || bond === void 0 ? void 0 : bond.vestingTerm) !== null && _e !== void 0 ? _e : 0).days, " D") : '-'] })), _jsxs(Flex, __assign({ className: "modal-block column-maxbuy" }, { children: [_jsxs(Flex, __assign({ className: "block-header header" }, { children: ["Max Buy", _jsx(Flex, __assign({ className: "block-header icon" }, { children: _jsx(Svg, { icon: "questionFill", width: "15px" }) }))] })), (_f = parseFloat(maxBuy(bond).toFixed(0))) === null || _f === void 0 ? void 0 : _f.toLocaleString('en-US')] }))] })), _jsxs(Flex, __assign({ className: "modal-container text-container" }, { children: [_jsxs(Flex, __assign({ className: "text-container row" }, { children: [_jsx("div", { children: "You spend:" }), _jsxs("div", { children: ["0 ", bond === null || bond === void 0 ? void 0 : bond.principalTokenName, " = $ 0"] })] })), _jsxs(Flex, __assign({ className: "text-container row" }, { children: [_jsxs("div", { children: ["Premium: ", _jsx(Svg, { icon: "questionFill", width: "15px" })] }), _jsx("div", { children: "$ 0" })] })), _jsxs(Flex, __assign({ className: "text-container row" }, { children: [_jsx("div", { children: "You get (over 90 days):" }), _jsxs("div", { children: ["0 ", bond === null || bond === void 0 ? void 0 : bond.showcaseTokenName, " = $ 0"] })] }))] })), _jsxs(Flex, __assign({ className: "modal-container input-container" }, { children: [_jsx(Flex, __assign({ className: "input-container input" }, { children: _jsx(NumericInput, { disabled: false, onUserInput: setInputValue, value: inputValue }) })), _jsxs(Flex, __assign({ className: "input-container token" }, { children: [bond === null || bond === void 0 ? void 0 : bond.principalTokenName, " ", calculateResult()] }))] })), _jsxs(Flex, __assign({ className: "modal-container button-container" }, { children: [_jsx(Flex, __assign({ className: "button-container get" }, { children: _jsxs(Button, { children: ["Get ", bond === null || bond === void 0 ? void 0 : bond.principalTokenName] }) })), _jsx(Flex, __assign({ className: "button-container buy" }, { children: _jsxs(Button, { children: ["Buy ", bond === null || bond === void 0 ? void 0 : bond.showcaseTokenName] }) }))] }))] }))] })) })) }, bond.billAddress));
         }) })));
 };
 export default BondModal;

package/dist/utils/formatNumber.d.ts

@@ -0,0 +1,2 @@
+export declare const formatNumber: (number: number, minPrecision?: number, maxPrecision?: number) => string;
+export declare const formatNumberSI: (number: number, digits?: number) => string;

package/dist/utils/formatNumber.js

@@ -0,0 +1,34 @@
+export var formatNumber = function (number, minPrecision, maxPrecision) {
+    if (minPrecision === void 0) { minPrecision = 2; }
+    if (maxPrecision === void 0) { maxPrecision = 2; }
+    var options = {
+        minimumFractionDigits: minPrecision,
+        maximumFractionDigits: maxPrecision,
+    };
+    return number.toLocaleString('en-US', options);
+};
+// Formats a number with SI (International System of Units) sufixes
+export var formatNumberSI = function (number, digits) {
+    if (digits === void 0) { digits = 2; }
+    var lookupSI = [
+        { value: 1, symbol: '' },
+        { value: 1e6, symbol: 'M' },
+        { value: 1e9, symbol: 'B' },
+        { value: 1e12, symbol: 'T' },
+    ];
+    var regEx = /\.0+$|(\.[0-9]*[1-9])0+$/;
+    var formatted;
+    if (number >= 1e18) {
+        formatted = '∞';
+    }
+    else {
+        var i = void 0;
+        for (i = lookupSI.length - 1; i > 0; i--) {
+            if (number >= lookupSI[i].value) {
+                break;
+            }
+        }
+        formatted = formatNumber(number / lookupSI[i].value, digits, digits).replace(regEx, '$1') + lookupSI[i].symbol;
+    }
+    return formatted;
+};

package/dist/utils/formatNumbers.d.ts

@@ -0,0 +1,36 @@
+import { Currency, CurrencyAmount, Price } from '@ape.swap/sdk-core';
+export declare const currencyAmountToPreciseFloat: (currencyAmount: CurrencyAmount<Currency> | undefined) => number | undefined;
+export declare const priceToPreciseFloat: (price: Price<Currency, Currency> | undefined) => number | undefined;
+interface FormatDollarArgs {
+    num: number | undefined | null;
+    isPrice?: boolean;
+    lessPreciseStablecoinValues?: boolean;
+    digits?: number;
+    round?: boolean;
+}
+/**
+ * Returns a USD dollar or equivalent denominated numerical value formatted
+ * in human readable string for use in template.
+ *
+ * Adheres to guidelines for prices and other numbers defined here:
+ * https://www.notion.so/uniswaplabs/Number-standards-fbb9f533f10e4e22820722c2f66d23c0
+ * @param num numerical value denominated in USD or USD equivalent
+ * @param isPrice whether the amount represents a price or not
+ * @param lessPreciseStablecoinValues whether or not we should show less precise values for
+ * stablecoins (around 1$ in value always) for the sake of readability
+ * @param digits number of digits after the decimal for non-price amounts
+ * @param round whether or not to round up non-price amounts
+ */
+export declare const formatDollar: ({ num, isPrice, lessPreciseStablecoinValues, digits, round, }: FormatDollarArgs) => string;
+export declare const formatValue: ({ num, digits, round }: any) => string;
+/**
+ * Returns a numerical amount of any token formatted in human readable string for use in template.
+ *
+ * For transaction review numbers, such as token quantities, NFT price (token-denominated),
+ *  network fees, transaction history items. Adheres to guidelines defined here:
+ * https://www.notion.so/uniswaplabs/Number-standards-fbb9f533f10e4e22820722c2f66d23c0
+ * @param num numerical value denominated in any token
+ * @param maxDigits the maximum number of digits that should be shown for the quantity
+ */
+export declare const formatTransactionAmount: (num: number | undefined | null, maxDigits?: number) => string;
+export {};

package/dist/utils/formatNumbers.js

@@ -0,0 +1,148 @@
+import numbro from 'numbro';
+// Convert [CurrencyAmount] to number with necessary precision for price formatting.
+export var currencyAmountToPreciseFloat = function (currencyAmount) {
+    if (!currencyAmount)
+        return undefined;
+    var floatForLargerNumbers = parseFloat(currencyAmount.toExact());
+    if (floatForLargerNumbers < 0.1) {
+        return parseFloat(currencyAmount.toSignificant(6));
+    }
+    return floatForLargerNumbers;
+};
+// Convert [Price] to number with necessary precision for price formatting.
+export var priceToPreciseFloat = function (price) {
+    if (!price)
+        return undefined;
+    var floatForLargerNumbers = parseFloat(price.toFixed(9));
+    if (floatForLargerNumbers < 0.1) {
+        return parseFloat(price.toSignificant(6));
+    }
+    return floatForLargerNumbers;
+};
+/**
+ * Returns a USD dollar or equivalent denominated numerical value formatted
+ * in human readable string for use in template.
+ *
+ * Adheres to guidelines for prices and other numbers defined here:
+ * https://www.notion.so/uniswaplabs/Number-standards-fbb9f533f10e4e22820722c2f66d23c0
+ * @param num numerical value denominated in USD or USD equivalent
+ * @param isPrice whether the amount represents a price or not
+ * @param lessPreciseStablecoinValues whether or not we should show less precise values for
+ * stablecoins (around 1$ in value always) for the sake of readability
+ * @param digits number of digits after the decimal for non-price amounts
+ * @param round whether or not to round up non-price amounts
+ */
+export var formatDollar = function (_a) {
+    var num = _a.num, _b = _a.isPrice, isPrice = _b === void 0 ? false : _b, _c = _a.lessPreciseStablecoinValues, lessPreciseStablecoinValues = _c === void 0 ? false : _c, _d = _a.digits, digits = _d === void 0 ? 2 : _d, _e = _a.round, round = _e === void 0 ? true : _e;
+    // For USD dollar denominated prices.
+    if (isPrice) {
+        if (num === 0)
+            return '$0.00';
+        if (!num)
+            return '-';
+        if (num < 0.000001) {
+            return "$".concat(num.toExponential(2));
+        }
+        if ((num >= 0.000001 && num < 0.1) || num > 1000000) {
+            return "$".concat(Number(num).toPrecision(3));
+        }
+        // We only show 2 decimal places in explore table for stablecoin value ranges
+        // for the sake of readability (as opposed to the usual 3 elsewhere).
+        if (num >= 0.1 && num < (lessPreciseStablecoinValues ? 0.9995 : 1.05)) {
+            return "$".concat(num.toFixed(3));
+        }
+        return "$".concat(Number(num.toFixed(2)).toLocaleString('en-US', { minimumFractionDigits: 2 }));
+    }
+    // For volume dollar amounts, like market cap, total value locked, etc.
+    else {
+        if (num === 0)
+            return '$0.00';
+        if (!num)
+            return '-';
+        if (num < 0.000001) {
+            return '$<0.000001';
+        }
+        if (num >= 0.000001 && num < 0.1) {
+            return "$".concat(Number(num).toPrecision(3));
+        }
+        if (num >= 0.1 && num < 1.05) {
+            return "$".concat(num.toFixed(3));
+        }
+        return numbro(num)
+            .formatCurrency({
+            average: round,
+            mantissa: num > 1000 ? 2 : digits,
+            abbreviations: {
+                million: 'M',
+                billion: 'B',
+            },
+        })
+            .toUpperCase();
+    }
+};
+export var formatValue = function (_a) {
+    var num = _a.num, _b = _a.digits, digits = _b === void 0 ? 2 : _b, _c = _a.round, round = _c === void 0 ? true : _c;
+    if (num === 0)
+        return '0.00';
+    if (!num)
+        return '-';
+    if (num < 0.000001) {
+        return '<0.000001';
+    }
+    if (num >= 0.000001 && num < 0.1) {
+        return "".concat(Number(num).toPrecision(3));
+    }
+    if (num >= 0.1 && num < 1.05) {
+        return "".concat(num.toFixed(3));
+    }
+    return numbro(num)
+        .format({
+        average: round,
+        mantissa: num > 1000 ? 2 : digits,
+        abbreviations: {
+            million: 'M',
+            billion: 'B',
+        },
+    })
+        .toUpperCase();
+};
+/**
+ * Returns a numerical amount of any token formatted in human readable string for use in template.
+ *
+ * For transaction review numbers, such as token quantities, NFT price (token-denominated),
+ *  network fees, transaction history items. Adheres to guidelines defined here:
+ * https://www.notion.so/uniswaplabs/Number-standards-fbb9f533f10e4e22820722c2f66d23c0
+ * @param num numerical value denominated in any token
+ * @param maxDigits the maximum number of digits that should be shown for the quantity
+ */
+export var formatTransactionAmount = function (num, maxDigits) {
+    if (maxDigits === void 0) { maxDigits = 9; }
+    if (num === 0)
+        return '0.00';
+    if (!num)
+        return '';
+    if (num < 0.00001) {
+        return '<0.00001';
+    }
+    if (num >= 0.00001 && num < 1) {
+        return "".concat(Number(num.toFixed(5)).toLocaleString('en-US', {
+            minimumFractionDigits: 2,
+            maximumFractionDigits: 5,
+        }));
+    }
+    if (num >= 1 && num < 10000) {
+        return "".concat(Number(num.toPrecision(6)).toLocaleString('en-US', {
+            minimumFractionDigits: 2,
+            maximumFractionDigits: 6,
+        }));
+    }
+    if (num >= 10000 && num < 1000000) {
+        return "".concat(Number(num.toFixed(2)).toLocaleString('en-US', { minimumFractionDigits: 2 }));
+    }
+    // For very large numbers, switch to scientific notation and show as much precision
+    // as permissible by maxDigits param.
+    if (num >= Math.pow(10, maxDigits - 1)) {
+        return "".concat(num.toExponential(maxDigits - 3));
+    }
+    return "".concat(Number(num.toFixed(2)).toLocaleString('en-US', { minimumFractionDigits: 2 }));
+};

package/package.json

@@ -3,7 +3,7 @@
   "description": "Ape Bond SDK",
   "author": "Ape Bond",
   "license": "MIT",
-  "version": "1.0.114",
+  "version": "1.0.116",
   "main": "dist/index.js",
   "module": "dist/index.es.js",
   "types": "dist/index.d.ts",
@@ -50,6 +50,7 @@
   },
   "dependencies": {
     "@ape.swap/apeswap-lists": "^2.0.9",
+    "@ape.swap/sdk-core": "^1.0.2",
     "@emotion/react": "^11.11.4",
     "@emotion/styled": "^11.11.5",
     "@types/node": "^20.14.10",