@ape.swap/bonds-sdk 2.0.4-testseed.1 → 2.0.4-testseed.10
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.
- package/dist/main.js +23 -16
- package/dist/state/useSDKConfig.d.ts +6 -0
- package/dist/styles.css +4 -3
- package/dist/views/Bonds/utils.d.ts +1 -1
- package/package.json +1 -1
package/dist/main.js
CHANGED
|
@@ -71557,10 +71557,10 @@ const remainingPercentage = (bond) => {
|
|
|
71557
71557
|
const remainingTokens = new BigNumber$1((_d = bond.tokensRemaining) !== null && _d !== void 0 ? _d : '0');
|
|
71558
71558
|
return remainingTokens.div(totalMaxPayout).times(100).toNumber();
|
|
71559
71559
|
};
|
|
71560
|
-
const getDiscountColor = (discount) => {
|
|
71560
|
+
const getDiscountColor = (discount, greenAlt = false) => {
|
|
71561
71561
|
if (!discount)
|
|
71562
71562
|
return 'white';
|
|
71563
|
-
return discount < 0 ? '#DF4141' : '#38A611';
|
|
71563
|
+
return discount < 0 ? '#DF4141' : (greenAlt ? '#34B96D' : '#38A611');
|
|
71564
71564
|
};
|
|
71565
71565
|
const calculateARR = (bond) => {
|
|
71566
71566
|
const discount2 = 'discount' in bond ? bond.discount : undefined;
|
|
@@ -73091,10 +73091,14 @@ const BondModalHeaderAlt = ({ bondData, onDismiss, showProjectInfoButton, }) =>
|
|
|
73091
73091
|
const BondModal = ({ onDismiss, bondAddress, bondChain, handlePurchasedBond,
|
|
73092
73092
|
// ??
|
|
73093
73093
|
accordionTitle = 'What are Bonds?', accordionBody = 'Body', accordionVisible = false, }) => {
|
|
73094
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
|
|
73094
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q;
|
|
73095
73095
|
const SDKConfig = useSDKConfig();
|
|
73096
73096
|
// State
|
|
73097
73097
|
const [modalVariant, setModalVariant] = useState(SDKConfig === null || SDKConfig === void 0 ? void 0 : SDKConfig.modalVariant);
|
|
73098
|
+
// Set accordion for alt modal
|
|
73099
|
+
accordionVisible = (SDKConfig === null || SDKConfig === void 0 ? void 0 : SDKConfig.modalVariant) === 'alt' ? true : false;
|
|
73100
|
+
accordionBody = (_a = SDKConfig === null || SDKConfig === void 0 ? void 0 : SDKConfig.accordionBody) !== null && _a !== void 0 ? _a : '';
|
|
73101
|
+
accordionTitle = (_b = SDKConfig === null || SDKConfig === void 0 ? void 0 : SDKConfig.accordionTitle) !== null && _b !== void 0 ? _b : 'What are Bonds?';
|
|
73098
73102
|
// Hooks
|
|
73099
73103
|
const userChainId = useChainId();
|
|
73100
73104
|
const { address: account } = useAccount();
|
|
@@ -73107,13 +73111,13 @@ accordionTitle = 'What are Bonds?', accordionBody = 'Body', accordionVisible = f
|
|
|
73107
73111
|
const bondData = useMemo(() => bonds === null || bonds === void 0 ? void 0 : bonds.find((bond) => { var _a; return ((_a = bond === null || bond === void 0 ? void 0 : bond.billAddress) === null || _a === void 0 ? void 0 : _a.toLowerCase()) === (bondAddress === null || bondAddress === void 0 ? void 0 : bondAddress.toLowerCase()); }), [bondAddress]);
|
|
73108
73112
|
const [buyTxHash, setBuyTxHash] = useState();
|
|
73109
73113
|
const [inputValue, setInputValue] = useState('');
|
|
73110
|
-
const [inputTokenString, setInputTokenString] = useState((
|
|
73114
|
+
const [inputTokenString, setInputTokenString] = useState((_e = (_d = (_c = bondData === null || bondData === void 0 ? void 0 : bondData.lpToken) === null || _c === void 0 ? void 0 : _c.address) === null || _d === void 0 ? void 0 : _d[bondData.chainId]) !== null && _e !== void 0 ? _e : 'NATIVE');
|
|
73111
73115
|
// Data
|
|
73112
73116
|
const inputToken = useTokenFromZapList(inputTokenString, bondData === null || bondData === void 0 ? void 0 : bondData.chainId, bondData === null || bondData === void 0 ? void 0 : bondData.lpToken);
|
|
73113
|
-
const isZap = (inputTokenString === null || inputTokenString === void 0 ? void 0 : inputTokenString.toLowerCase()) !== ((
|
|
73117
|
+
const isZap = (inputTokenString === null || inputTokenString === void 0 ? void 0 : inputTokenString.toLowerCase()) !== ((_h = (_g = (_f = bondData === null || bondData === void 0 ? void 0 : bondData.lpToken) === null || _f === void 0 ? void 0 : _f.address) === null || _g === void 0 ? void 0 : _g[bondData === null || bondData === void 0 ? void 0 : bondData.chainId]) === null || _h === void 0 ? void 0 : _h.toLowerCase());
|
|
73114
73118
|
const [fetchingZapQuote, zapData, zapEstimatedOutput, zapError] = useSoulZapBondQuote(inputValue, inputToken, bondData, account);
|
|
73115
73119
|
const inputTokenPrice = useCurrencyPrice(inputToken !== null && inputToken !== void 0 ? inputToken : null, bondChain);
|
|
73116
|
-
const { data: inputCurrencyBalance } = useCurrencyBalance(inputToken !== null && inputToken !== void 0 ? inputToken : null, account !== null && account !== void 0 ? account : null, (
|
|
73120
|
+
const { data: inputCurrencyBalance } = useCurrencyBalance(inputToken !== null && inputToken !== void 0 ? inputToken : null, account !== null && account !== void 0 ? account : null, (_j = bondData === null || bondData === void 0 ? void 0 : bondData.chainId) !== null && _j !== void 0 ? _j : null);
|
|
73117
73121
|
// Estimations
|
|
73118
73122
|
const normalEstimatedOutput = youGet(bondData, inputValue);
|
|
73119
73123
|
const estimatedOutput = isZap ? zapEstimatedOutput : normalEstimatedOutput;
|
|
@@ -73142,7 +73146,7 @@ accordionTitle = 'What are Bonds?', accordionBody = 'Body', accordionVisible = f
|
|
|
73142
73146
|
});
|
|
73143
73147
|
};
|
|
73144
73148
|
// Approve & Purchase Functions
|
|
73145
|
-
const [approvalState, approveCallback] = useApproval(inputValue, inputToken !== null && inputToken !== void 0 ? inputToken : null, (
|
|
73149
|
+
const [approvalState, approveCallback] = useApproval(inputValue, inputToken !== null && inputToken !== void 0 ? inputToken : null, (_k = (isZap ? SoulZapTokenManager === null || SoulZapTokenManager === void 0 ? void 0 : SoulZapTokenManager[bondData === null || bondData === void 0 ? void 0 : bondData.chainId] : bondData === null || bondData === void 0 ? void 0 : bondData.billAddress)) !== null && _k !== void 0 ? _k : null, account !== null && account !== void 0 ? account : null, (_l = bondData === null || bondData === void 0 ? void 0 : bondData.chainId) !== null && _l !== void 0 ? _l : null);
|
|
73146
73150
|
const handleApprove = () => {
|
|
73147
73151
|
approveCallback().then(() => {
|
|
73148
73152
|
track({
|
|
@@ -73279,7 +73283,7 @@ accordionTitle = 'What are Bonds?', accordionBody = 'Body', accordionVisible = f
|
|
|
73279
73283
|
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
73284
|
}
|
|
73281
73285
|
};
|
|
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:
|
|
73286
|
+
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, handleMaxBtn: () => { var _a; return setInputValue((_a = new BigNumber$1(inputCurrencyBalance !== null && inputCurrencyBalance !== void 0 ? inputCurrencyBalance : '0')) === null || _a === void 0 ? void 0 : _a.toString()); }, handleCurrencySelect: handleCurrencySelect, chainId: bondData === null || bondData === void 0 ? void 0 : bondData.chainId, enableZap: supportedByLIFI.includes(bondData === null || bondData === void 0 ? void 0 : bondData.chainId), bondPrincipalToken: bondData === null || bondData === void 0 ? void 0 : bondData.lpToken, tokenBalance: inputCurrencyBalance, selectedTokenPrice: inputTokenPrice === null || inputTokenPrice === void 0 ? void 0 : inputTokenPrice.price }), 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
73287
|
event.stopPropagation();
|
|
73284
73288
|
switchChain({ chainId: bondData.chainId });
|
|
73285
73289
|
}, 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 +73296,16 @@ accordionTitle = 'What are Bonds?', accordionBody = 'Body', accordionVisible = f
|
|
|
73292
73296
|
(bondData === null || bondData === void 0 ? void 0 : bondData.soldOut) ||
|
|
73293
73297
|
!account ||
|
|
73294
73298
|
!inputValue ||
|
|
73295
|
-
parseFloat(inputValue) === 0, onClick: handleApprove, children: "enable" })) })] }), accordionVisible && (jsx$2(Flex, { className: "modaltable-container accordion-container", children: jsx$2(AccordionText, { title: accordionTitle, body: accordionBody, isVisible: accordionVisible }) }))] })] })) })) : (jsx$2(Fragment$1, { children: bondData && (jsxs(Flex, { className: "modal-content font-small gpt", children: [typeof window !== 'undefined' && window.location.origin === 'http://localhost:
|
|
73296
|
-
|
|
73299
|
+
parseFloat(inputValue) === 0, onClick: handleApprove, children: "enable" })) })] }), accordionVisible && (jsx$2(Flex, { className: "modaltable-container accordion-container", children: jsx$2(AccordionText, { title: accordionTitle, body: accordionBody, isVisible: accordionVisible }) }))] })] })) })) : (jsx$2(Fragment$1, { children: bondData && (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" })] })), jsx$2(Flex, { className: "bondmodal-header-alt", sx: { mb: '20px' }, children: jsx$2(BondModalHeaderAlt, { bondData: bondData, onDismiss: onDismiss, showProjectInfoButton: (SDKConfig === null || SDKConfig === void 0 ? void 0 : SDKConfig.referenceId) === 'apebond' }) }), jsxs(Flex, { className: "modaltable-container", sx: { flexDirection: 'row', gap: '20px' }, children: [jsxs(Flex, { sx: { width: '500px', flexDirection: 'column' }, children: [jsx$2("img", { 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", { sx: { margin: '0px' }, children: [bondData === null || bondData === void 0 ? void 0 : bondData.showcaseTokenName, ' ', jsx$2(Svg, { width: 20, height: 20, icon: (_m = NETWORK_ICONS === null || NETWORK_ICONS === void 0 ? void 0 : NETWORK_ICONS[bondData.chainId]) !== null && _m !== void 0 ? _m : 'question' })] }) }), jsxs(Flex, { sx: { justifyContent: 'space-between', flexGrow: 1 }, children: [jsx$2(TokenImage, { symbol: (_o = bondData.showcaseTokenName) !== null && _o !== void 0 ? _o : bondData.earnToken.symbol, size: 20 }), jsx$2("span", { children: bondData.earnToken.symbol }), " ", jsx$2("span", { children: "|" }), ' ', jsxs("span", { children: ["Market Price: $", earnTokenPrice(bondData)] })] })] }), jsxs(Flex, { sx: { flexDirection: 'column', marginTop: '20px' }, children: [jsx$2(TokenSelectorPanel, { typedValue: inputValue, setTypedValue: setInputValue, selectedToken: inputToken, handleMaxBtn: () => { var _a; return setInputValue((_a = new BigNumber$1(inputCurrencyBalance !== null && inputCurrencyBalance !== void 0 ? inputCurrencyBalance : '0')) === null || _a === void 0 ? void 0 : _a.toString()); }, handleCurrencySelect: handleCurrencySelect, chainId: bondData === null || bondData === void 0 ? void 0 : bondData.chainId, enableZap: 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: "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: (_p = bondData.showcaseTokenName) !== null && _p !== void 0 ? _p : 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) -
|
|
73300
|
+
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) => {
|
|
73297
73301
|
event.stopPropagation();
|
|
73298
73302
|
switchChain({ chainId: bondData.chainId });
|
|
73299
|
-
}, 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 ?
|
|
73303
|
+
}, 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" }) })
|
|
73304
|
+
: ''] })) : (jsx$2(Button, { className: "action-button", load: approvalState === ApprovalState.PENDING, disabled: approvalState === ApprovalState.PENDING ||
|
|
73300
73305
|
(bondData === null || bondData === void 0 ? void 0 : bondData.soldOut) ||
|
|
73301
73306
|
!account ||
|
|
73302
73307
|
!inputValue ||
|
|
73303
|
-
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((
|
|
73308
|
+
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((_q = bondData === null || bondData === void 0 ? void 0 : bondData.vestingTerm) !== null && _q !== void 0 ? _q : 0).days * 86400000))] }), jsx$2(Flex, { sx: { width: '25%', justifyContent: 'center' }, children: "Vesting type: Linear" }), jsx$2(Flex, { sx: { width: '25%', justifyContent: 'center' }, children: "What are bonds?" })] }), accordionVisible && (jsx$2(Flex, { className: "modaltable-container accordion-container", children: jsx$2(AccordionText, { title: accordionTitle, body: accordionBody, isVisible: accordionVisible }) }))] })) })) }));
|
|
73304
73309
|
};
|
|
73305
73310
|
|
|
73306
73311
|
/*
|
|
@@ -73489,9 +73494,11 @@ const ProgressBarWrapper = ({ title, value, style, showTooltip, toolTipPlacement
|
|
|
73489
73494
|
var ProgressBarWrapper$1 = React__default.memo(ProgressBarWrapper);
|
|
73490
73495
|
|
|
73491
73496
|
const BondRow = ({ bond }) => {
|
|
73492
|
-
var _a, _b, _c, _d, _e, _f, _g;
|
|
73497
|
+
var _a, _b, _c, _d, _e, _f, _g, _h;
|
|
73493
73498
|
const billAddress = 'billAddress' in bond ? bond.billAddress : undefined;
|
|
73494
73499
|
const discount = 'discount' in bond ? bond.discount : undefined;
|
|
73500
|
+
const SDKConfig = useSDKConfig();
|
|
73501
|
+
let greenAlt = (_a = SDKConfig === null || SDKConfig === void 0 ? void 0 : SDKConfig.greenAlt) !== null && _a !== void 0 ? _a : false;
|
|
73495
73502
|
// Modal
|
|
73496
73503
|
const [openBuyModal] = useModal(jsx$2(ModalHandler, { bondAddress: billAddress, bondChain: bond.chainId }), true, true, `buyBondModal-${billAddress}-${bond.chainId}`);
|
|
73497
73504
|
const handleOpenModal = () => {
|
|
@@ -73529,7 +73536,7 @@ const BondRow = ({ bond }) => {
|
|
|
73529
73536
|
const tokens = new BigNumber$1(tokensRemaining);
|
|
73530
73537
|
return tokens.times(payoutTokenPrice);
|
|
73531
73538
|
};
|
|
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: "discount-column", style: { color: 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: ((
|
|
73539
|
+
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", style: { color: getDiscountColor(discount, greenAlt) }, 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: ((_b = vestingTime(bond === null || bond === void 0 ? void 0 : bond.vestingTerm)) === null || _b === void 0 ? void 0 : _b.days) ? `${(_c = vestingTime(bond === null || bond === void 0 ? void 0 : bond.vestingTerm)) === null || _c === void 0 ? void 0 : _c.days} D` : '-' }), jsx$2("div", { className: "tokens-remaining-column", children: jsx$2(ProgressBarWrapper$1, { title: '', value: jsx$2(ProgressBar, { value: remainingPercentage(bond) }), style: {
|
|
73533
73540
|
width: '127px',
|
|
73534
73541
|
height: '25px',
|
|
73535
73542
|
flexDirection: 'column',
|
|
@@ -73538,7 +73545,7 @@ const BondRow = ({ bond }) => {
|
|
|
73538
73545
|
}, showTooltip: true, toolTip: `${remainingTokensFormat(bond)} ${bond.earnToken.symbol} (${formatDollar({
|
|
73539
73546
|
num: remainingTokensUsd(bond).toNumber(),
|
|
73540
73547
|
isPrice: true,
|
|
73541
|
-
})})` }) }), jsx$2("div", { className: "tooltip-column", children: jsx$2(TooltipBubble, { className: "tooltip-bubble", body: jsx$2(BondInfoTooltip, { earnTokenContract: (
|
|
73548
|
+
})})` }) }), jsx$2("div", { className: "tooltip-column", children: jsx$2(TooltipBubble, { className: "tooltip-bubble", body: jsx$2(BondInfoTooltip, { earnTokenContract: (_f = (_e = (_d = bond === null || bond === void 0 ? void 0 : bond.earnToken) === null || _d === void 0 ? void 0 : _d.address) === null || _e === void 0 ? void 0 : _e[bond === null || bond === void 0 ? void 0 : bond.chainId]) !== null && _f !== void 0 ? _f : '', earnTokenSymbol: (_h = (_g = bond === null || bond === void 0 ? void 0 : bond.earnToken) === null || _g === void 0 ? void 0 : _g.symbol) !== null && _h !== void 0 ? _h : '', bondContract: billAddress !== null && billAddress !== void 0 ? billAddress : '', projectLink: bond === null || bond === void 0 ? void 0 : bond.projectLink, twitter: bond === null || bond === void 0 ? void 0 : bond.twitter, audit: bond === null || bond === void 0 ? void 0 : bond.audit, chain: bond === null || bond === void 0 ? void 0 : bond.chainId }), width: "205px", placement: "bottomRight", transformTip: "translate(7%, -2%)", children: jsx$2(Flex, { sx: { opacity: 0.8 }, children: jsx$2(Svg, { icon: "more", width: "25px" }) }) }) })] })] }, billAddress));
|
|
73542
73549
|
};
|
|
73543
73550
|
|
|
73544
73551
|
const HotBondCard = ({ bond }) => {
|
|
@@ -73745,7 +73752,7 @@ const styles$7 = {
|
|
|
73745
73752
|
const SmallRecommendationCard = ({ recommendation }) => {
|
|
73746
73753
|
var _a;
|
|
73747
73754
|
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
|
|
73755
|
+
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
73756
|
};
|
|
73750
73757
|
|
|
73751
73758
|
const RecommendationCards$1 = () => {
|
|
@@ -5,6 +5,9 @@ export interface SDKProps {
|
|
|
5
5
|
chains: number[];
|
|
6
6
|
useRainbowKit: boolean;
|
|
7
7
|
modalVariant: 'alt' | 'standard';
|
|
8
|
+
accordionTitle?: string;
|
|
9
|
+
accordionBody?: string;
|
|
10
|
+
greenAlt: boolean;
|
|
8
11
|
};
|
|
9
12
|
}
|
|
10
13
|
export declare const useSDKConfig: (config?: SDKProps) => {
|
|
@@ -13,6 +16,9 @@ export declare const useSDKConfig: (config?: SDKProps) => {
|
|
|
13
16
|
chains: number[];
|
|
14
17
|
useRainbowKit: boolean;
|
|
15
18
|
modalVariant: "alt" | "standard";
|
|
19
|
+
accordionTitle?: string;
|
|
20
|
+
accordionBody?: string;
|
|
21
|
+
greenAlt: boolean;
|
|
16
22
|
} | undefined;
|
|
17
23
|
export type URLKeys = 'apiV2' | 'realTimeApi' | 'apeswap-lists';
|
|
18
24
|
export declare const useURLByEnvironment: (key: URLKeys) => string;
|
package/dist/styles.css
CHANGED
|
@@ -580,9 +580,6 @@ span.flex-inline {
|
|
|
580
580
|
}
|
|
581
581
|
|
|
582
582
|
.footer-details {
|
|
583
|
-
margin-left: -10px !important;
|
|
584
|
-
margin-right: -10px !important;
|
|
585
|
-
margin-bottom: -10px !important;
|
|
586
583
|
margin-top: 20px !important;
|
|
587
584
|
height: 50px;
|
|
588
585
|
align-items: center;
|
|
@@ -594,6 +591,10 @@ span.flex-inline {
|
|
|
594
591
|
fill: #38A611;
|
|
595
592
|
}
|
|
596
593
|
|
|
594
|
+
.modal-receive-text {
|
|
595
|
+
padding-left: 5px;
|
|
596
|
+
}
|
|
597
|
+
|
|
597
598
|
.bond-row {
|
|
598
599
|
display: flex;
|
|
599
600
|
flex-direction: row;
|
|
@@ -13,5 +13,5 @@ export declare const vestingTime: (vestingTerm?: number) => {
|
|
|
13
13
|
};
|
|
14
14
|
export declare const remainingPercentage: (bond: BondsData) => number;
|
|
15
15
|
export declare const getBillContractURL: (bond: BondsData | BillsConfig) => string;
|
|
16
|
-
export declare const getDiscountColor: (discount?: number) => string;
|
|
16
|
+
export declare const getDiscountColor: (discount?: number, greenAlt?: boolean) => string;
|
|
17
17
|
export declare const calculateARR: (bond: BondsData | BillsConfig) => string;
|