@ape.swap/bonds-sdk 2.0.4-testseed.2 → 2.0.4-testseed.22
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -1,16 +1,17 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { ChainId, Token } from '@ape.swap/apeswap-lists';
|
|
3
|
-
declare const TokenSelectorPanel: ({ typedValue, setTypedValue, selectedToken, chainId,
|
|
3
|
+
declare const TokenSelectorPanel: ({ typedValue, setTypedValue, selectedToken, chainId, handleValueBtn, handleCurrencySelect, enableZap, tokenBalance, selectedTokenPrice, bondPrincipalToken, bondEarnToken, modalVariant, }: {
|
|
4
4
|
typedValue: string;
|
|
5
5
|
setTypedValue: (value: React.SetStateAction<string>) => void;
|
|
6
6
|
selectedToken?: "NATIVE" | Token;
|
|
7
7
|
chainId: ChainId;
|
|
8
|
-
|
|
8
|
+
handleValueBtn?: (value: string) => void;
|
|
9
9
|
handleCurrencySelect: (value: string) => void;
|
|
10
10
|
enableZap?: boolean;
|
|
11
11
|
tokenBalance?: string;
|
|
12
12
|
selectedTokenPrice?: number;
|
|
13
13
|
bondPrincipalToken?: Token;
|
|
14
14
|
bondEarnToken?: Token;
|
|
15
|
+
modalVariant?: "alt" | "standard";
|
|
15
16
|
}) => React.JSX.Element;
|
|
16
17
|
export default TokenSelectorPanel;
|
package/dist/main.js
CHANGED
|
@@ -71559,8 +71559,8 @@ const remainingPercentage = (bond) => {
|
|
|
71559
71559
|
};
|
|
71560
71560
|
const getDiscountColor = (discount) => {
|
|
71561
71561
|
if (!discount)
|
|
71562
|
-
return '
|
|
71563
|
-
return discount < 0 ? '
|
|
71562
|
+
return '';
|
|
71563
|
+
return discount < 0 ? 'discount-negative' : 'discount-positive';
|
|
71564
71564
|
};
|
|
71565
71565
|
const calculateARR = (bond) => {
|
|
71566
71566
|
const discount2 = 'discount' in bond ? bond.discount : undefined;
|
|
@@ -72210,7 +72210,7 @@ const TokenSelectorModal = ({ bondPrincipalToken, bondEarnToken, handleCurrencyS
|
|
|
72210
72210
|
}) })] }) }) }));
|
|
72211
72211
|
};
|
|
72212
72212
|
|
|
72213
|
-
const TokenSelectorPanel = ({ typedValue, setTypedValue, selectedToken, chainId,
|
|
72213
|
+
const TokenSelectorPanel = ({ typedValue, setTypedValue, selectedToken, chainId, handleValueBtn, handleCurrencySelect, enableZap, tokenBalance, selectedTokenPrice, bondPrincipalToken, bondEarnToken, modalVariant, }) => {
|
|
72214
72214
|
var _a, _b;
|
|
72215
72215
|
const tokenBalanceString = tokenBalance ? new BigNumber$1(tokenBalance).toPrecision(5) : 'loading';
|
|
72216
72216
|
const splited = typeof selectedToken !== 'string' ? (_a = selectedToken === null || selectedToken === void 0 ? void 0 : selectedToken.symbol) === null || _a === void 0 ? void 0 : _a.split('-') : undefined;
|
|
@@ -72232,7 +72232,7 @@ const TokenSelectorPanel = ({ typedValue, setTypedValue, selectedToken, chainId,
|
|
|
72232
72232
|
!!v.currentTarget.value && isNumber$1(v.currentTarget.value) && parseFloat(v.currentTarget.value) >= 0
|
|
72233
72233
|
? v.currentTarget.value
|
|
72234
72234
|
: v.currentTarget.value.slice(0, v.currentTarget.value.length - 1);
|
|
72235
|
-
} }) }), jsxs(Flex$1, { className: "input-container token", onClick: () => (enableZap ? onTokenSelectorModal() : null), sx: { cursor: enableZap ? 'pointer' : 'default' }, children: [jsxs(Flex$1, { children: [jsx$2(Flex$1, { className: "input-container bondicon", children: lodashExports.isArray(splited) ? (jsx$2(TokenImage, { symbol: splited[0], symbol2: splited[1], size: 28, chain: chainId })) : (jsx$2(TokenImage, { symbol: getSymbol(selectedToken, chainId), size: 28, chain: chainId })) }), jsx$2(Flex$1, { className: "title-container tokenname", children: getSymbol(selectedToken, chainId) })] }), enableZap && (jsx$2(Flex$1, { sx: { mr: '8px' }, children: jsx$2(Svg, { icon: "caret" }) }))] })] }), tokenBalance && (jsxs(Flex$1, { className: "input-container balancerow", children: [jsx$2(Flex$1, { children: selectedTokenPrice && typedValue ? `$${(selectedTokenPrice * parseFloat(typedValue)).toFixed(2)}` : '' }), jsxs(Flex$1, { children: [jsxs(Flex$1, { className: "balancerow text", children: ["Balance: ", tokenBalanceString] }),
|
|
72235
|
+
} }) }), jsxs(Flex$1, { className: "input-container token", onClick: () => (enableZap ? onTokenSelectorModal() : null), sx: { cursor: enableZap ? 'pointer' : 'default' }, children: [jsxs(Flex$1, { children: [jsx$2(Flex$1, { className: "input-container bondicon", children: lodashExports.isArray(splited) ? (jsx$2(TokenImage, { symbol: splited[0], symbol2: splited[1], size: 28, chain: chainId })) : (jsx$2(TokenImage, { symbol: getSymbol(selectedToken, chainId), size: 28, chain: chainId })) }), jsx$2(Flex$1, { className: "title-container tokenname", children: getSymbol(selectedToken, chainId) })] }), enableZap && (jsx$2(Flex$1, { sx: { mr: '8px' }, children: jsx$2(Svg, { icon: "caret" }) }))] })] }), tokenBalance && (jsxs(Flex$1, { className: "input-container balancerow", children: [jsx$2(Flex$1, { children: selectedTokenPrice && typedValue ? `$${(selectedTokenPrice * parseFloat(typedValue)).toFixed(2)}` : '' }), jsxs(Flex$1, { children: [jsxs(Flex$1, { className: "balancerow text", children: ["Balance: ", tokenBalanceString] }), jsxs(Flex$1, { className: "balancerow max", children: [tokenBalance !== '0' && handleValueBtn && modalVariant !== 'alt' && (jsx$2(Fragment$1, { children: jsx$2(Button, { className: "max-button", onClick: () => { var _a; return handleValueBtn((_a = new BigNumber$1(tokenBalance !== null && tokenBalance !== void 0 ? tokenBalance : '0')) === null || _a === void 0 ? void 0 : _a.toString()); }, children: "Max" }) })), tokenBalance !== '0' && handleValueBtn && modalVariant === 'alt' && (jsxs(Fragment$1, { children: [jsx$2(Button, { className: "max-button", onClick: () => handleValueBtn((parseFloat(tokenBalance) / 4).toString()), children: "25%" }), jsx$2(Button, { className: "max-button", onClick: () => handleValueBtn((parseFloat(tokenBalance) / 2).toString()), children: "50%" }), jsx$2(Button, { className: "max-button", onClick: () => handleValueBtn((parseFloat(tokenBalance) * .75).toString()), children: "75%" }), jsx$2(Button, { className: "max-button", onClick: () => { var _a; return handleValueBtn((_a = new BigNumber$1(tokenBalance !== null && tokenBalance !== void 0 ? tokenBalance : '0')) === null || _a === void 0 ? void 0 : _a.toString()); }, children: "Max" })] }))] })] })] }))] }));
|
|
72236
72236
|
};
|
|
72237
72237
|
|
|
72238
72238
|
var NetworkNames;
|
|
@@ -72838,15 +72838,11 @@ const ZapModal = ({ onDismiss, outputToken, account, chainId }) => {
|
|
|
72838
72838
|
: '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", '>'] }) }) })] })] }));
|
|
72839
72839
|
};
|
|
72840
72840
|
|
|
72841
|
-
const AccordionText = ({
|
|
72842
|
-
const [isDropdownExpanded, setIsDropdownExpanded] = useState(false);
|
|
72843
|
-
const toggleDropdown = () => {
|
|
72844
|
-
setIsDropdownExpanded(!isDropdownExpanded);
|
|
72845
|
-
};
|
|
72841
|
+
const AccordionText = ({ isVisible = false }) => {
|
|
72846
72842
|
if (!isVisible) {
|
|
72847
72843
|
return null;
|
|
72848
72844
|
}
|
|
72849
|
-
return (jsxs(Fragment$1, { children: [
|
|
72845
|
+
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("p", { 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("p", { 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("p", { 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." })] }) }) })] }));
|
|
72850
72846
|
};
|
|
72851
72847
|
|
|
72852
72848
|
const useSoulZapBondQuote = (typedValue, inputCurrency, bond, account) => {
|
|
@@ -73088,13 +73084,12 @@ const BondModalHeaderAlt = ({ bondData, onDismiss, showProjectInfoButton, }) =>
|
|
|
73088
73084
|
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(Flex, { sx: { mb: '-5px', 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" }) })) }) }));
|
|
73089
73085
|
};
|
|
73090
73086
|
|
|
73091
|
-
const BondModal = ({ onDismiss, bondAddress, bondChain, handlePurchasedBond
|
|
73092
|
-
// ??
|
|
73093
|
-
accordionTitle = 'What are Bonds?', accordionBody = 'Body', accordionVisible = false, }) => {
|
|
73087
|
+
const BondModal = ({ onDismiss, bondAddress, bondChain, handlePurchasedBond }) => {
|
|
73094
73088
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
|
|
73095
73089
|
const SDKConfig = useSDKConfig();
|
|
73096
73090
|
// State
|
|
73097
73091
|
const [modalVariant, setModalVariant] = useState(SDKConfig === null || SDKConfig === void 0 ? void 0 : SDKConfig.modalVariant);
|
|
73092
|
+
const [accordionVisible, setAccordionVisible] = useState(true);
|
|
73098
73093
|
// Hooks
|
|
73099
73094
|
const userChainId = useChainId();
|
|
73100
73095
|
const { address: account } = useAccount();
|
|
@@ -73279,7 +73274,7 @@ accordionTitle = 'What are Bonds?', accordionBody = 'Body', accordionVisible = f
|
|
|
73279
73274
|
window.open(`https://ape.bond/swap?outputcurrency=${bondData === null || bondData === void 0 ? void 0 : bondData.lpToken.address[bondData === null || bondData === void 0 ? void 0 : bondData.chainId]}&outputChain=${bondData === null || bondData === void 0 ? void 0 : bondData.chainId}`, '_blank');
|
|
73280
73275
|
}
|
|
73281
73276
|
};
|
|
73282
|
-
return (jsx$2(Modal, { className: "modal", onDismiss: onDismiss, 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, { bondData: bondData, inputValue: inputValue, inputToken: inputToken, estimatedOutput: estimatedOutput, inputTokenPrice: inputTokenPrice === null || inputTokenPrice === void 0 ? void 0 : inputTokenPrice.price, isZap: isZap, fetchingZapQuote: fetchingZapQuote, zapError: zapError }), jsx$2(TokenSelectorPanel, { typedValue: inputValue, setTypedValue: setInputValue, selectedToken: inputToken,
|
|
73277
|
+
return (jsx$2(Modal, { className: "modal", onDismiss: onDismiss, 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, { bondData: bondData, inputValue: inputValue, inputToken: inputToken, estimatedOutput: estimatedOutput, inputTokenPrice: inputTokenPrice === null || inputTokenPrice === void 0 ? void 0 : inputTokenPrice.price, isZap: isZap, fetchingZapQuote: fetchingZapQuote, zapError: zapError }), 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: 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 }), jsxs(Flex, { className: "modaltable-container button-container", children: [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, {})) : userChainId !== bondData.chainId ? (jsx$2(Button, { className: "switch-button", disabled: loadingTx || isConfirming || (bondData === null || bondData === void 0 ? void 0 : bondData.soldOut), onClick: (event) => {
|
|
73283
73278
|
event.stopPropagation();
|
|
73284
73279
|
switchChain({ chainId: bondData.chainId });
|
|
73285
73280
|
}, 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 ||
|
|
@@ -73292,15 +73287,15 @@ accordionTitle = 'What are Bonds?', accordionBody = 'Body', accordionVisible = f
|
|
|
73292
73287
|
(bondData === null || bondData === void 0 ? void 0 : bondData.soldOut) ||
|
|
73293
73288
|
!account ||
|
|
73294
73289
|
!inputValue ||
|
|
73295
|
-
parseFloat(inputValue) === 0, onClick: handleApprove, children: "enable" })) })] })
|
|
73296
|
-
|
|
73297
|
-
|
|
73298
|
-
|
|
73299
|
-
|
|
73300
|
-
|
|
73301
|
-
|
|
73302
|
-
|
|
73303
|
-
|
|
73290
|
+
parseFloat(inputValue) === 0, onClick: handleApprove, children: "enable" })) })] })] })] })) })) : (jsx$2(Fragment$1, { children: bondData && (jsxs(Fragment$1, { children: [jsxs(Flex, { className: "modal-content font-small gpt", 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: '20px' }, children: [jsxs(Flex, { sx: { width: '500px', flexDirection: 'column' }, children: [jsx$2("img", { className: "project-image", src: "https://placehold.co/400x200" }), jsx$2(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$2(Flex, { sx: { minWidth: '300px' }, children: jsxs("h2", { className: "modal-tokenname-chainicon", sx: { margin: '0px' }, children: [bondData === null || bondData === void 0 ? void 0 : bondData.showcaseTokenName, ' ', jsx$2(Svg, { width: 20, height: 20, icon: (_k = NETWORK_ICONS === null || NETWORK_ICONS === void 0 ? void 0 : NETWORK_ICONS[bondData.chainId]) !== null && _k !== void 0 ? _k : 'question' })] }) }), jsxs(Flex, { className: "modal-marketprice-header", sx: { justifyContent: 'space-between', flexGrow: 1 }, children: [jsx$2(TokenImage, { symbol: (_l = bondData.showcaseTokenName) !== null && _l !== void 0 ? _l : bondData.earnToken.symbol, size: 20 }), jsx$2("span", { className: "modal-marketprice-token", children: bondData.earnToken.symbol }), jsx$2("span", { 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' }) })] }), jsxs(Flex, { sx: { flexDirection: 'column', marginTop: '20px' }, 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' }, children: [jsxs(Flex, { className: "modal-youreceive-textbox", children: ["You will receive:", jsx$2(Flex, { className: "modal-youreceive-tokenimage", sx: { marginLeft: '15px', marginRight: '5px' }, children: jsx$2(TokenImage, { symbol: (_m = bondData.showcaseTokenName) !== null && _m !== void 0 ? _m : bondData.earnToken.symbol, size: 20 }) }), jsxs("span", { className: "modal-receive-text", children: [(lodashExports.toNumber(inputValue) / lodashExports.toNumber(earnTokenPrice(bondData))).toFixed(0), ' ', bondData.earnToken.symbol, " + \u00A0", (youGet(bondData, inputValue) -
|
|
73291
|
+
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: "switch-button button-narrow", disabled: loadingTx || isConfirming || (bondData === null || bondData === void 0 ? void 0 : bondData.soldOut), onClick: (event) => {
|
|
73292
|
+
event.stopPropagation();
|
|
73293
|
+
switchChain({ chainId: bondData.chainId });
|
|
73294
|
+
}, children: `Switch to ${NETWORK_LABEL[bondData.chainId]}` })) : 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 ||
|
|
73295
|
+
(bondData === null || bondData === void 0 ? void 0 : bondData.soldOut) ||
|
|
73296
|
+
!account ||
|
|
73297
|
+
!inputValue ||
|
|
73298
|
+
parseFloat(inputValue) === 0, onClick: handleApprove, children: "enable" })) })] }), jsx$2(Flex, { sx: { width: '100%', marginTop: '10px', marginBottom: '10px' }, children: jsx$2("hr", { className: "fading-hr" }) }), jsxs(Flex, { sx: { width: '100%' }, children: [jsxs(Flex, { sx: { width: '50%', flexDirection: 'column' }, children: ["Market Price: $", formatUSDNumber((youGet(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' }, children: ["If purchased from market:", ' ', (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:" }), ' ', youGet(bondData, inputValue).toFixed(0), ' ', jsx$2("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:", ' ', new Intl.DateTimeFormat('en-GB', { day: '2-digit', month: 'short', year: 'numeric' }).format(new Date())] }), jsxs(Flex, { sx: { width: '25%', justifyContent: 'center' }, children: ["Vesting end date:", ' ', new Intl.DateTimeFormat('en-GB', { day: '2-digit', month: 'short', year: 'numeric' }).format(new Date(Date.now() + vestingTime((_o = bondData === null || bondData === void 0 ? void 0 : bondData.vestingTerm) !== null && _o !== void 0 ? _o : 0).days * 86400000))] }), jsx$2(Flex, { sx: { width: '25%', justifyContent: 'center' }, children: "Vesting type: Linear" }), jsxs(Flex, { sx: { width: '25%', justifyContent: 'center', cursor: 'pointer' }, 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 }) }))] })) })) }));
|
|
73304
73299
|
};
|
|
73305
73300
|
|
|
73306
73301
|
/*
|
|
@@ -73529,7 +73524,7 @@ const BondRow = ({ bond }) => {
|
|
|
73529
73524
|
const tokens = new BigNumber$1(tokensRemaining);
|
|
73530
73525
|
return tokens.times(payoutTokenPrice);
|
|
73531
73526
|
};
|
|
73532
|
-
return (jsxs("div", { className: "bond-row", onClick: handleOpenModal, children: [jsx$2("div", { className: "token-info-container", children: jsx$2(TokenInfoAndName, { bill: bond }) }), jsxs("div", { className: "bond-info-columns", children: [jsx$2("div", { className:
|
|
73527
|
+
return (jsxs("div", { className: "bond-row", onClick: handleOpenModal, children: [jsx$2("div", { className: "token-info-container", children: jsx$2(TokenInfoAndName, { bill: bond }) }), jsxs("div", { className: "bond-info-columns", children: [jsx$2("div", { className: `discount-column ${getDiscountColor(discount)}`, children: discount !== undefined ? `${discount === null || discount === void 0 ? void 0 : discount.toFixed(2)}%` : '-' }), jsx$2("div", { className: "arr-column", children: calculateARR(bond) !== undefined ? calculateARR(bond) : '-' }), jsx$2("div", { className: "terms-column", children: ((_a = vestingTime(bond === null || bond === void 0 ? void 0 : bond.vestingTerm)) === null || _a === void 0 ? void 0 : _a.days) ? `${(_b = vestingTime(bond === null || bond === void 0 ? void 0 : bond.vestingTerm)) === null || _b === void 0 ? void 0 : _b.days} D` : '-' }), jsx$2("div", { className: "tokens-remaining-column", children: jsx$2(ProgressBarWrapper$1, { title: '', value: jsx$2(ProgressBar, { value: remainingPercentage(bond) }), style: {
|
|
73533
73528
|
width: '127px',
|
|
73534
73529
|
height: '25px',
|
|
73535
73530
|
flexDirection: 'column',
|
|
@@ -73608,7 +73603,7 @@ const HotBondCards = () => {
|
|
|
73608
73603
|
setActiveSlide(index);
|
|
73609
73604
|
swiper === null || swiper === void 0 ? void 0 : swiper.slideTo(index);
|
|
73610
73605
|
};
|
|
73611
|
-
return (jsxs(Flex, { sx: styles$a.mainComponent, children: [jsx$2(Flex, { sx: styles$a.hotBondTitle, children: "HOT BONDS" }), jsx$2(Flex, { sx: styles$a.desktopCards, children: filteredBonds === null || filteredBonds === void 0 ? void 0 : filteredBonds.slice(0, 3).map((bond, index) => {
|
|
73606
|
+
return (jsxs(Flex, { sx: styles$a.mainComponent, children: [jsx$2(Flex, { sx: styles$a.hotBondTitle, children: "HOT BONDS" }), jsx$2(Flex, { sx: styles$a.desktopCards, className: "hot-bond-card", children: filteredBonds === null || filteredBonds === void 0 ? void 0 : filteredBonds.slice(0, 3).map((bond, index) => {
|
|
73612
73607
|
return jsx$2(HotBondCard, { bond: bond }, `${bond.billAddress}-${index}`);
|
|
73613
73608
|
}) }), jsxs(Flex, { sx: {
|
|
73614
73609
|
flexDirection: 'column',
|
|
@@ -73745,7 +73740,7 @@ const styles$7 = {
|
|
|
73745
73740
|
const SmallRecommendationCard = ({ recommendation }) => {
|
|
73746
73741
|
var _a;
|
|
73747
73742
|
const vestingTime = getTimePeriods((_a = recommendation.vestingTerm) !== null && _a !== void 0 ? _a : 0, true);
|
|
73748
|
-
return (jsxs(Flex, { sx: styles$7.smallCardContainer, onClick: () => window.open(`${window.location.origin}/bonds
|
|
73743
|
+
return (jsxs(Flex, { sx: styles$7.smallCardContainer, onClick: () => window.open(`${window.location.origin}/bonds?bondAddress=${recommendation.contractAddress}&bondChain=${recommendation.chainId}`, '_self'), children: [jsxs(Flex, { sx: { alignItems: 'center' }, children: [jsx$2(TokenImage, { symbol: recommendation.payoutTokenName, size: 32, chain: recommendation.chainId }), jsxs(Flex, { sx: { mx: '10px', alignItems: 'center' }, children: [jsx$2(Flex, { sx: { fontSize: '14px', px: '6px' }, children: recommendation.payoutTokenName }), jsxs(Flex, { sx: styles$7.subTitle, children: [vestingTime.days, "D"] })] })] }), jsxs(Flex, { sx: { alignItems: 'center' }, children: [jsx$2(Flex, { sx: styles$7.subTitle, children: "Discount" }), jsxs(Flex, { sx: { fontSize: '12px', color: recommendation.discount > 0 ? 'success' : 'error', ml: '6px' }, children: [recommendation.discount.toFixed(2), "%"] })] })] }));
|
|
73749
73744
|
};
|
|
73750
73745
|
|
|
73751
73746
|
const RecommendationCards$1 = () => {
|
package/dist/styles.css
CHANGED
|
@@ -135,6 +135,10 @@
|
|
|
135
135
|
width: fit-content !important;
|
|
136
136
|
}
|
|
137
137
|
|
|
138
|
+
.project-image {
|
|
139
|
+
border-radius: 6px;
|
|
140
|
+
}
|
|
141
|
+
|
|
138
142
|
.modal-content {
|
|
139
143
|
display: flex;
|
|
140
144
|
flex-direction: column;
|
|
@@ -252,7 +256,6 @@
|
|
|
252
256
|
display: flex;
|
|
253
257
|
align-items: flex-start;
|
|
254
258
|
padding-top: 10px;
|
|
255
|
-
padding-bottom: 10px;
|
|
256
259
|
font-weight: 400;
|
|
257
260
|
font-size: 14px;
|
|
258
261
|
line-height: 21px;
|
|
@@ -498,8 +501,11 @@
|
|
|
498
501
|
|
|
499
502
|
.modaltable-container.accordion-container {
|
|
500
503
|
display: flex;
|
|
501
|
-
|
|
502
|
-
|
|
504
|
+
position: absolute;
|
|
505
|
+
width: 90%;
|
|
506
|
+
left: 5%;
|
|
507
|
+
padding: 10px 20px;
|
|
508
|
+
background: #12131A;
|
|
503
509
|
}
|
|
504
510
|
|
|
505
511
|
.toast {
|
|
@@ -580,9 +586,6 @@ span.flex-inline {
|
|
|
580
586
|
}
|
|
581
587
|
|
|
582
588
|
.footer-details {
|
|
583
|
-
margin-left: -20px !important;
|
|
584
|
-
margin-right: -20px !important;
|
|
585
|
-
margin-bottom: -20px !important;
|
|
586
589
|
margin-top: 20px !important;
|
|
587
590
|
height: 50px;
|
|
588
591
|
align-items: center;
|
|
@@ -594,6 +597,15 @@ span.flex-inline {
|
|
|
594
597
|
fill: #38A611;
|
|
595
598
|
}
|
|
596
599
|
|
|
600
|
+
.modal-receive-text {
|
|
601
|
+
padding-left: 5px;
|
|
602
|
+
}
|
|
603
|
+
|
|
604
|
+
.bondmodal-header-alt {
|
|
605
|
+
padding-left: 50px;
|
|
606
|
+
margin: 0px 0px 10px 0px !important;
|
|
607
|
+
}
|
|
608
|
+
|
|
597
609
|
.bond-row {
|
|
598
610
|
display: flex;
|
|
599
611
|
flex-direction: row;
|
|
@@ -4,9 +4,6 @@ export interface BondModalProps {
|
|
|
4
4
|
bondAddress?: string;
|
|
5
5
|
bondChain?: number;
|
|
6
6
|
handlePurchasedBond?: (hash: string) => void;
|
|
7
|
-
accordionTitle?: string;
|
|
8
|
-
accordionBody?: string;
|
|
9
|
-
accordionVisible?: boolean;
|
|
10
7
|
}
|
|
11
8
|
declare const BondModal: React.FC<BondModalProps>;
|
|
12
9
|
export default BondModal;
|
package/package.json
CHANGED
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
"description": "Ape Bond SDK",
|
|
4
4
|
"author": "Ape Bond",
|
|
5
5
|
"license": "MIT",
|
|
6
|
-
"version": "2.0.4-testseed.
|
|
6
|
+
"version": "2.0.4-testseed.22",
|
|
7
7
|
"module": "dist/main.js",
|
|
8
8
|
"type": "module",
|
|
9
9
|
"types": "dist/main.d.ts",
|
|
@@ -13,7 +13,7 @@
|
|
|
13
13
|
"scripts": {
|
|
14
14
|
"prepublishOnly": "npm run build",
|
|
15
15
|
"build": "rimraf dist/ && rollup -c && npm run compile-scss",
|
|
16
|
-
"dev": "vite",
|
|
16
|
+
"dev": "vite --port 5173",
|
|
17
17
|
"compile-scss": "sass src/scss/index.scss dist/styles.css --no-source-map",
|
|
18
18
|
"format:write": "prettier --write \"**/*.{js,jsx,ts,tsx,json}\" --config .prettierrc",
|
|
19
19
|
"format:check": "prettier --check \"**/*.{js,jsx,ts,tsx,json}\" --config .prettierrc",
|