@ape.swap/bonds-sdk 2.0.4-testseed.12 → 2.0.4-testseed.16
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 +11 -13
- package/dist/styles.css +6 -3
- package/dist/views/BondModal/BondModal.d.ts +0 -2
- package/package.json +1 -1
package/dist/main.js
CHANGED
|
@@ -73084,14 +73084,12 @@ const BondModalHeaderAlt = ({ bondData, onDismiss, showProjectInfoButton, }) =>
|
|
|
73084
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" }) })) }) }));
|
|
73085
73085
|
};
|
|
73086
73086
|
|
|
73087
|
-
const BondModal = ({ onDismiss, bondAddress, bondChain, handlePurchasedBond
|
|
73088
|
-
// ??
|
|
73089
|
-
accordionTitle = 'What are Bonds?', accordionBody = 'Body', }) => {
|
|
73087
|
+
const BondModal = ({ onDismiss, bondAddress, bondChain, handlePurchasedBond }) => {
|
|
73090
73088
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
|
|
73091
73089
|
const SDKConfig = useSDKConfig();
|
|
73092
73090
|
// State
|
|
73093
73091
|
const [modalVariant, setModalVariant] = useState(SDKConfig === null || SDKConfig === void 0 ? void 0 : SDKConfig.modalVariant);
|
|
73094
|
-
const [accordionVisible, setAccordionVisible] = useState(
|
|
73092
|
+
const [accordionVisible, setAccordionVisible] = useState(true);
|
|
73095
73093
|
// Hooks
|
|
73096
73094
|
const userChainId = useChainId();
|
|
73097
73095
|
const { address: account } = useAccount();
|
|
@@ -73289,15 +73287,15 @@ accordionTitle = 'What are Bonds?', accordionBody = 'Body', }) => {
|
|
|
73289
73287
|
(bondData === null || bondData === void 0 ? void 0 : bondData.soldOut) ||
|
|
73290
73288
|
!account ||
|
|
73291
73289
|
!inputValue ||
|
|
73292
|
-
parseFloat(inputValue) === 0, onClick: handleApprove, children: "enable" })) })] })] })] })) })) : (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: (_k = NETWORK_ICONS === null || NETWORK_ICONS === void 0 ? void 0 : NETWORK_ICONS[bondData.chainId]) !== null && _k !== void 0 ? _k : 'question' })] }) }), jsxs(Flex, { 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", { 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: (_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) -
|
|
73293
|
-
|
|
73294
|
-
|
|
73295
|
-
|
|
73296
|
-
|
|
73297
|
-
|
|
73298
|
-
|
|
73299
|
-
|
|
73300
|
-
|
|
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" })] })), 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: (_k = NETWORK_ICONS === null || NETWORK_ICONS === void 0 ? void 0 : NETWORK_ICONS[bondData.chainId]) !== null && _k !== void 0 ? _k : 'question' })] }) }), jsxs(Flex, { 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", { 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: (_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), 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 }) }))] })) })) }));
|
|
73301
73299
|
};
|
|
73302
73300
|
|
|
73303
73301
|
/*
|
package/dist/styles.css
CHANGED
|
@@ -133,6 +133,7 @@
|
|
|
133
133
|
|
|
134
134
|
.modal {
|
|
135
135
|
width: fit-content !important;
|
|
136
|
+
padding: 20px 20px 0px 20px !important;
|
|
136
137
|
}
|
|
137
138
|
|
|
138
139
|
.modal-content {
|
|
@@ -252,7 +253,6 @@
|
|
|
252
253
|
display: flex;
|
|
253
254
|
align-items: flex-start;
|
|
254
255
|
padding-top: 10px;
|
|
255
|
-
padding-bottom: 10px;
|
|
256
256
|
font-weight: 400;
|
|
257
257
|
font-size: 14px;
|
|
258
258
|
line-height: 21px;
|
|
@@ -498,8 +498,11 @@
|
|
|
498
498
|
|
|
499
499
|
.modaltable-container.accordion-container {
|
|
500
500
|
display: flex;
|
|
501
|
-
|
|
502
|
-
|
|
501
|
+
position: absolute;
|
|
502
|
+
width: 90%;
|
|
503
|
+
left: 5%;
|
|
504
|
+
padding: 10px 20px;
|
|
505
|
+
background: #12131A;
|
|
503
506
|
}
|
|
504
507
|
|
|
505
508
|
.toast {
|