@ape.swap/bonds-sdk 1.0.125 → 1.0.127

package/dist/components/BondModal/BondModal.d.ts

@@ -1,6 +1,6 @@
 /** @jsxImportSource theme-ui */
 import React from 'react';
-import '../../scss/bondmodal.scss';
+import '../../scss/BondModal.scss';
 declare const BondModal: ({ isOpen, onClose, bondAddress }: {
     isOpen: boolean;
     onClose: () => void;

package/dist/components/BondModal/BondModal.js

@@ -15,7 +15,7 @@ import React, { useEffect, useState } from 'react';
 import { Flex, ThemeUIProvider, Input } from 'theme-ui';
 import { useWeb3React } from '@web3-react/core';
 import { defaultTheme } from '../../theme';
-import '../../scss/bondmodal.scss';
+import '../../scss/BondModal.scss';
 import getTimePeriods from '../../utils/getTimePeriods';
 import { Button } from '../uikit/Button';
 import Svg from '../uikit/Svg';

package/dist/components/BondSingle/BondSingle.d.ts

@@ -1,5 +1,5 @@
 /** @jsxImportSource theme-ui */
 import React from 'react';
-import '../../scss/bondmodal.scss';
+import '../../scss/BondSingle.scss';
 declare const BondSingle: React.FC;
 export default BondSingle;

package/dist/components/BondSingle/BondSingle.js

@@ -15,7 +15,7 @@ import { useEffect, useState } from 'react';
 import { Flex, ThemeUIProvider, Input } from 'theme-ui';
 import { useWeb3React } from '@web3-react/core';
 import { defaultTheme } from '../../theme';
-import '../../scss/bondmodal.scss';
+import '../../scss/BondSingle.scss';
 import getTimePeriods from '../../utils/getTimePeriods';
 import { Button } from '../uikit/Button';
 import Svg from '../uikit/Svg';
@@ -66,8 +66,8 @@ var BondSingle = function (_a) {
         setInputValue(event.target.value);
     };
     return (_jsxs(ThemeUIProvider, __assign({ theme: defaultTheme }, { children: [_jsxs("div", { children: ["Bond Single Page", _jsx("p", { children: billAddress })] }), isActive && account && (_jsx("p", { children: account })), _jsx(Flex, __assign({ className: "container page-container" }, { children: bondData.map(function (bond) {
-                    var _a, _b, _c, _d, _e, _f;
-                    return (_jsxs(_Fragment, { children: [_jsxs(Flex, __assign({ className: "container blocks-container" }, { children: [_jsxs(Flex, __assign({ className: "block-container discount ".concat(getDiscountColor(bond === null || bond === void 0 ? void 0 : bond.discount)) }, { children: [_jsxs(Flex, __assign({ className: "block-container header" }, { children: ["Discount", _jsx(Flex, __assign({ className: "block-container 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: "block-container arr" }, { children: [_jsxs(Flex, __assign({ className: "block-container header" }, { children: ["ARR", _jsx(Flex, __assign({ className: "block-container 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: "block-container term" }, { children: [_jsxs(Flex, __assign({ className: "block-container header" }, { children: ["Terms", _jsx(Flex, __assign({ className: "block-container 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: "block-container maxbuy" }, { children: [_jsxs(Flex, __assign({ className: "block-container header" }, { children: ["Max Buy", _jsx(Flex, __assign({ className: "block-container 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: "container bondinfo-container" }, { children: [_jsxs(Flex, __assign({ className: "bondinfo-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: "price-container 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: "bondinfo-container description-container" }, { children: bond === null || bond === void 0 ? void 0 : bond.shortDescription })), _jsxs(Flex, __assign({ className: "bondinfo-container input-container" }, { children: [_jsx(Flex, __assign({ className: "input-container input" }, { children: _jsx(Input, { type: "number", className: "number-input", placeholder: "0.0", value: inputValue, onChange: handleInputChange }) })), _jsx(Flex, __assign({ className: "input-container token" }, { children: bond === null || bond === void 0 ? void 0 : bond.principalTokenName }))] })), _jsxs(Flex, __assign({ className: "bondinfo-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] }) }))] }))] }))] }));
+                    var _a, _b, _c, _d, _e, _f, _g;
+                    return (_jsxs(_Fragment, { children: [_jsxs(Flex, __assign({ className: "container blocks-container" }, { children: [_jsxs(Flex, __assign({ className: "block-container discount ".concat(getDiscountColor(bond === null || bond === void 0 ? void 0 : bond.discount)) }, { children: [_jsxs(Flex, __assign({ className: "block-container header" }, { children: ["Discount", _jsx(Flex, __assign({ className: "block-container 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: "block-container arr" }, { children: [_jsxs(Flex, __assign({ className: "block-container header" }, { children: ["ARR", _jsx(Flex, __assign({ className: "block-container 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: "block-container term" }, { children: [_jsxs(Flex, __assign({ className: "block-container header" }, { children: ["Terms", _jsx(Flex, __assign({ className: "block-container 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: "block-container maxbuy" }, { children: [_jsxs(Flex, __assign({ className: "block-container header" }, { children: ["Max Buy", _jsx(Flex, __assign({ className: "block-container 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: "container bondinfo-graph-container" }, { children: [_jsxs(Flex, __assign({ className: "container bondinfo-container" }, { children: [_jsxs(Flex, __assign({ className: "bondinfo-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 price-container" }, { children: [_jsxs(Flex, __assign({ className: "price-container price" }, { children: ["$", earnTokenPrice(bond)] })), _jsxs(Flex, __assign({ className: "price-container discounted" }, { children: ["$", discountEarnTokenPrice(bond)] }))] }))] })), _jsx(Flex, __assign({ className: "bondinfo-container description-container" }, { children: bond === null || bond === void 0 ? void 0 : bond.shortDescription })), _jsxs(Flex, __assign({ className: "bondinfo-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: [_jsxs("div", { children: ["You get (over ", vestingTime((_g = bond === null || bond === void 0 ? void 0 : bond.vestingTerm) !== null && _g !== void 0 ? _g : 0).days, " days):"] }), _jsxs("div", { children: ["0 ", bond === null || bond === void 0 ? void 0 : bond.showcaseTokenName, " = $ 0"] })] }))] })), _jsxs(Flex, __assign({ className: "bondinfo-container input-container" }, { children: [_jsx(Flex, __assign({ className: "input-container input" }, { children: _jsx(Input, { type: "number", className: "number-input", placeholder: "0.0", value: inputValue, onChange: handleInputChange }) })), _jsx(Flex, __assign({ className: "input-container token" }, { children: bond === null || bond === void 0 ? void 0 : bond.principalTokenName }))] })), _jsxs(Flex, __assign({ className: "bondinfo-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] }) }))] }))] })), _jsx(Flex, __assign({ className: "container graph-container" }, { children: _jsx("div", { children: "Graph" }) }))] }))] }));
                 }) }))] })));
 };
 export default BondSingle;

package/dist/components/Bonds/Bonds.d.ts

@@ -1,6 +1,6 @@
 /** @jsxImportSource theme-ui */
 import React from 'react';
-import '../../scss/bonds.scss';
+import '../../scss/Bonds.scss';
 declare global {
     interface Window {
         ethereum?: any;

package/dist/components/Bonds/Bonds.js

@@ -56,7 +56,7 @@ import { useSearchParams, useNavigate } from 'react-router-dom';
 import getTimePeriods from '../../utils/getTimePeriods';
 import { defaultTheme } from '../../theme';
 import Svg from '../uikit/Svg';
-import '../../scss/bonds.scss';
+import '../../scss/Bonds.scss';
 var Bonds = function (_a) {
     var connectionString = _a.connectionString;
     var _b = useWeb3React(), account = _b.account, isActive = _b.isActive;

package/dist/scss/{bondsingle.scss → BondSingle.scss}

@@ -2,9 +2,9 @@
     width: 100%;
     display: flex;
     flex-direction: column; 
-    padding-left: 10px;
-    padding-right: 10px;
-    padding-bottom: 10px;
+    padding-left: 100px;
+    padding-right: 100px;
+    padding-bottom: 100px;
 }
 
 .container.blocks-container {
@@ -17,8 +17,7 @@
     margin-top: 5px;
 }
 
-.modal-block {
-    min-width: 0px;
+.block-container {
     display: flex;
     flex-direction: column;
     align-items: center;
@@ -31,58 +30,22 @@
     padding-bottom: 10px;
 }
 
-.modal-container.title-container {
-    font-weight: bold;
-    font-size: 1.5rem;
+.block-container.header {
     display: flex;
     flex-direction: row;
-    align-items: center;
-    padding-top: 5px;
-    padding-bottom: 5px;
-}
-
-.title-container.bond {
-    display: flex;
-}
-
-.title-container.bond-price {
-    display: flex;
-    flex-direction: column;
-    padding-left: 10px;
-}
-
-.bond-price.price {
-    font-size: 14px;
-    color: var(--theme-ui-colors-gray);
-    text-decoration: line-through;
-}
-
-.bond-price.discounted {
-    display: flex;
-}
-
-.modal-container.description-container {
-    display: flex;
-    align-items: start;
-    padding-top: 10px;
-    padding-bottom: 10px;
-    font-weight: normal;
-}
-
-.block-header.header {
     color: white;
     font-weight: bold;
     font-size: 12px;
     padding-bottom: 10px;
 }
 
-.block-header.icon {
+.block-container.icon {
     padding-left: 5px;
     align-items: start;
     cursor: pointer;
 }
 
-.modal-block.column-discount {
+.block-container.discount {
     margin: 0px 10px 0px 0px;
     width: 350px;
 }
@@ -95,21 +58,82 @@
     color: #DF4141;
 }
 
-.modal-block.column-arr {
+.block-container.arr {
     margin: 0px 10px 0px 0px;
     width: 350px;
 }
 
-.modal-block.column-term {
+.block-container.term {
     margin: 0px 10px 0px 0px;
     width: 350px;
 }
 
-.modal-block.column-maxbuy {
+.block-container.maxbuy {
     width: 350px;
 }
 
-.modal-container.text-container {
+.container.bondinfo-graph-container {
+    display: flex;
+    flex-direction: row;
+    padding: 50px;
+}
+
+.container.graph-container {
+    display: flex;
+}
+
+.container.bondinfo-container {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    background: var(--theme-ui-colors-white3);
+    font-weight: 900;
+    font-size: 16px;
+    border-radius: 10px;
+    height: 100%;
+    padding-top: 10px;
+    padding-bottom: 10px;
+}
+
+.bondinfo-container.title-container {
+    font-weight: bold;
+    font-size: 1.5rem;
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    padding-top: 5px;
+    padding-bottom: 5px;
+}
+
+.title-container.bond {
+    display: flex;
+}
+
+.title-container.price-container {
+    display: flex;
+    flex-direction: column;
+    padding-left: 10px;
+}
+
+.price-container.price {
+    font-size: 14px;
+    color: var(--theme-ui-colors-gray);
+    text-decoration: line-through;
+}
+
+.price-container.discounted {
+    display: flex;
+}
+
+.bondinfo-container.description-container {
+    display: flex;
+    align-items: start;
+    padding-top: 10px;
+    padding-bottom: 10px;
+    font-weight: normal;
+}
+
+.bondinfo-container.text-container {
     display: flex;
     flex-direction: column;
     justify-content: center;
@@ -132,7 +156,7 @@
     color: #DF4141;
 }
 
-.modal-container.input-container {
+.bondinfo-container.input-container {
     display: flex;
     flex-direction: row;
     background: var(--theme-ui-colors-white3);
@@ -167,7 +191,7 @@
   cursor: unset;
 }
 
-.modal-container.button-container {
+.bondinfo-container.button-container {
     width: 100%;
     padding-top: 10px;
     display: flex;

package/package.json

@@ -3,7 +3,7 @@
   "description": "Ape Bond SDK",
   "author": "Ape Bond",
   "license": "MIT",
-  "version": "1.0.125",
+  "version": "1.0.127",
   "main": "dist/index.js",
   "module": "dist/index.es.js",
   "types": "dist/index.d.ts",