npm - @ape.swap/bonds-sdk - Versions diffs - 6.1.14 → 6.1.15-test.0 - Mend

@ape.swap/bonds-sdk 6.1.14 → 6.1.15-test.0

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.

Files changed (212) hide show

package/dist/views/YourBondsModal/YourBondsModal.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"YourBondsModal.js","sources":["../../../src/views/YourBondsModal/YourBondsModal.tsx"],"sourcesContent":["import React, { useState } from 'react'\nimport { UserBill } from '../../types/yourbonds'\nimport TokenImage from '../../components/uikit-sdk/TokenImage'\nimport { formatNumberSI } from '../../utils/formatNumber'\nimport { UserBillTooltipText } from '../../config/constants/tooltips'\nimport Recommendations from './components/Recommendations/Recommendations'\nimport {\n claimable,\n claimableUSD,\n claimed,\n claimedUSD,\n getPendingVestingString,\n getPercentageVested,\n getTimeLeftForFullyVested,\n pending,\n pendingUSD,\n} from '../../utils/displayHelpers'\nimport { getTimePeriods } from '../../utils/getTimePeriods'\nimport SafeHTMLComponent from '../../components/SafeHTMLComponent'\nimport ProgressBar from '../../components/ProgressBar/ProgressBar'\nimport ProgressBarWrapper from '../../components/ProgressBar/ProgressBarWrapper'\nimport NFTImage from './components/NFTImage/NFTImage'\nimport YourBondModalHeader from './components/YourBondModalHeader/YourBondModalHeader'\nimport Actions from './components/Actions/Actions'\nimport { ChainId } from '@ape.swap/apeswap-lists'\nimport ActionsSolana from './components/Actions/ActionsSolana'\nimport ActionsAptos from './components/Actions/ActionsAptos'\nimport ActionsSui from './components/Actions/ActionsSui'\nimport Modal from '../../components/uikit-sdk/Modal'\nimport Flex from '../../components/uikit-sdk/Flex'\nimport Svg from '../../components/uikit-sdk/Svg'\nimport Button from '../../components/uikit-sdk/Button/Button'\nimport TooltipBubble from '../../components/uikit-sdk/TooltipBubble'\nimport Text from '../../components/uikit-sdk/Text'\nimport { useSDKConfig } from '../../state/useSDKConfig'\n\nconst YourBondsModal = ({\n userBill,\n lostProfit,\n onDismiss,\n}: {\n userBill?: UserBill\n lostProfit?: string\n onDismiss?: () => void\n}) => {\n // Hooks\n const SDKConfig = useSDKConfig()\n\n // State\n const [showNFTImg, setShowNFTImg] = useState(false)\n\n // Static Data\n const depositUSD = userBill?.nftData?.data?.dollarValue\n const payout = userBill?.nftData?.data?.payout\n const payoutTokenPrice = parseFloat(userBill?.bond?.payoutTokenPrice ?? '0')\n const payoutUSD = payout && payoutTokenPrice ? payout * payoutTokenPrice : 0\n const payoutSymbol = userBill?.bond?.showcaseTokenName ?? userBill?.bond?.earnToken.symbol\n const payoutTokenSymbol = payoutSymbol === 'AIX' && userBill?.bond?.chainId === ChainId.SOL ? 'SOLAIX' : payoutSymbol\n\n // Cliff display info:\n const vestingCliff = userBill?.bond?.vestingCliff\n const currentTime = Math.round(new Date().getTime() / 1000)\n const vestingStartTimestamp = parseInt(userBill?.vestingStartTimestamp ?? '0')\n const isPendingCliff = vestingCliff ? currentTime - vestingStartTimestamp < vestingCliff : false\n const cliffCountdown = getTimePeriods(vestingStartTimestamp + (vestingCliff ?? 0) - currentTime, true)\n\n return (\n <Modal\n sx={{\n width: '480px',\n overflowY: 'unset !important',\n background: showNFTImg ? 'transparent !important' : 'white2',\n p: '0px',\n top: '56%',\n }}\n >\n <Flex\n sx={{\n flexDirection: 'column',\n borderRadius: 'normal',\n position: 'relative',\n background: showNFTImg ? 'transparent !important' : 'white2',\n p: '20px',\n }}\n >\n <NFTImage userBill={userBill} showNFTImg={showNFTImg} setShowNFTImg={setShowNFTImg} />\n\n {/* Modal Content */}\n\n {!showNFTImg && (\n <Flex sx={{ flexDirection: 'column' }}>\n <YourBondModalHeader userBill={userBill} onDismiss={onDismiss} />\n <Flex sx={{ mt: '10px', flexDirection: 'column', gap: '10px' }}>\n <Flex sx={{ width: '100%', gap: '15px', position: 'relative' }}>\n <Flex\n sx={{\n background: 'white3',\n borderRadius: 'normal',\n justifyContent: 'space-between',\n p: '10px',\n width: '50%',\n alignItems: 'center',\n fontSize: '14px',\n }}\n >\n <Flex>Deposit</Flex>\n <Flex>${formatNumberSI(depositUSD)}</Flex>\n </Flex>\n <Flex\n sx={{ position: 'absolute', top: '50%', left: '50%', transform: 'translateY(-50%) translateX(-50%)' }}\n >\n <Svg icon=\"arrow\" direction=\"right\" width={'5px'} />\n </Flex>\n <Flex\n sx={{\n background: 'white3',\n borderRadius: 'normal',\n justifyContent: 'space-between',\n p: '10px',\n width: '50%',\n alignItems: 'center',\n fontSize: '14px',\n }}\n >\n <Flex>Bond Value</Flex>\n <Flex sx={{ alignItems: 'center', gap: '5px' }}>\n <TokenImage symbol={payoutTokenSymbol} size={22} />\n <Flex sx={{ flexDirection: 'column', fontSize: '14px', lineHeight: '16px' }}>\n <Flex sx={{ justifyContent: 'center' }}>{formatNumberSI(payout ?? '0')}</Flex>\n <Flex sx={{ fontSize: '10px', fontWeight: 400, opacity: 0.6, justifyContent: 'center' }}>\n (${formatNumberSI(payoutUSD)})\n </Flex>\n </Flex>\n </Flex>\n </Flex>\n </Flex>\n {lostProfit && (\n <Flex\n sx={{\n background: 'white3',\n borderRadius: 'normal',\n width: '100%',\n p: '10px',\n justifyContent: 'space-between',\n }}\n >\n <Flex sx={{ width: '20%' }}>\n <img\n src={`https://ape.bond/images/launch/mythical.png`}\n alt=\"mythical\"\n style={{ width: '90px', height: '90px' }}\n />\n </Flex>\n <Flex sx={{ width: '75%', flexDirection: 'column', gap: '3px' }}>\n <Flex>\n You missed a <Flex sx={{ color: 'success', px: '3px' }}>${lostProfit}</Flex> bonus\n </Flex>\n <Flex sx={{ fontSize: '12px', lineHeight: '16px', fontWeight: 400 }}>\n Holding an Ape Tier would’ve gotten you an extra 5% bonus on this purchase and all future ones.\n </Flex>\n <Button\n variant=\"secondary\"\n sx={{ width: '100%', fontSize: '14px', height: '30px', fontWeight: 600 }}\n onClick={() => window.open('https://ape.bond/true-yield', '_blank')}\n >\n Upgrade Your Tier\n </Button>\n </Flex>\n </Flex>\n )}\n <Flex\n sx={{\n flexDirection: 'column',\n fontSize: '12px',\n fontWeight: 400,\n }}\n >\n <Flex\n sx={{\n width: '100%',\n justifyContent: 'space-between',\n alignItems: 'center',\n p: '4px 10px',\n background: 'white3',\n borderRadius: '10px 10px 0px 0px',\n }}\n >\n <Flex sx={{ alignItems: 'center', gap: '5px' }}>\n <Flex sx={{ opacity: 0.6 }}>Vesting Progress</Flex>\n <TooltipBubble\n className=\"tooltip-bubble\"\n body={<Flex>{UserBillTooltipText.FullyVested}</Flex>}\n width=\"230px\"\n placement=\"bottomLeft\"\n transformTip=\"translate(-5%, 0%)\"\n >\n <Flex className=\"block-header icon\">\n <Svg icon=\"questionCircle\" width=\"12px\" />\n </Flex>\n </TooltipBubble>\n </Flex>\n <Flex sx={{ alignItems: 'center' }}>\n {isPendingCliff ? (\n <>\n Claiming starts in{' '}\n {`${cliffCountdown.days !== 0 ? `${cliffCountdown.days} days` : cliffCountdown.hours !== 0 ? `${cliffCountdown.hours} hours` : `${cliffCountdown.minutes} mins`}`}\n </>\n ) : (\n <ProgressBarWrapper\n title={''}\n value={<ProgressBar value={getPercentageVested(userBill)} />}\n style={{\n width: '100px',\n flexDirection: 'column',\n alignItems: 'center',\n }}\n showTooltip={true}\n toolTip={\n getTimeLeftForFullyVested(userBill) > 0\n ? `Fully vested in ${getPendingVestingString(userBill)}.`\n : `Fully Vested.`\n }\n />\n )}\n </Flex>\n </Flex>\n <Flex\n sx={{\n width: '100%',\n justifyContent: 'space-between',\n alignItems: 'center',\n p: '4px 10px',\n background: 'white4',\n height: '26px',\n }}\n >\n <Flex sx={{ alignItems: 'center', gap: '5px' }}>\n <Flex sx={{ opacity: 0.6 }}>Pending</Flex>\n <TooltipBubble\n className=\"tooltip-bubble\"\n body={<Flex>{UserBillTooltipText.Pending}</Flex>}\n width=\"230px\"\n placement=\"bottomLeft\"\n transformTip=\"translate(-5%, 0%)\"\n >\n <Flex className=\"block-header icon\">\n <Svg icon=\"questionCircle\" width=\"12px\" />\n </Flex>\n </TooltipBubble>\n </Flex>\n <Flex sx={{ alignItems: 'center' }}>\n <TokenImage symbol={payoutTokenSymbol} size={18} />\n <Text sx={{ fontSize: '12px', fontWeight: 700, ml: '10px' }}>\n {formatNumberSI(pending(userBill), 4)}\n </Text>\n <Text\n sx={{\n fontSize: ['10px', '10px', '10px', '12px'],\n fontWeight: 400,\n ml: '10px',\n opacity: 0.6,\n }}\n >\n (${formatNumberSI(pendingUSD(userBill))})\n </Text>\n </Flex>\n </Flex>\n <Flex\n sx={{\n width: '100%',\n justifyContent: 'space-between',\n alignItems: 'center',\n p: '4px 10px',\n background: 'white3',\n height: '26px',\n }}\n >\n <Flex sx={{ alignItems: 'center', gap: '5px' }}>\n <Flex sx={{ opacity: 0.6 }}>Claimable</Flex>\n <TooltipBubble\n className=\"tooltip-bubble\"\n body={<Flex>{UserBillTooltipText.Claimable}</Flex>}\n width=\"230px\"\n placement=\"bottomLeft\"\n transformTip=\"translate(-5%, 0%)\"\n >\n <Flex className=\"block-header icon\">\n <Svg icon=\"questionCircle\" width=\"12px\" />\n </Flex>\n </TooltipBubble>\n </Flex>\n <Flex sx={{ alignItems: 'center' }}>\n <TokenImage symbol={payoutTokenSymbol} size={18} />\n <Text sx={{ fontSize: '12px', fontWeight: 700, ml: '10px' }}>\n {formatNumberSI(claimable(userBill), 4)}\n </Text>\n <Text\n sx={{\n fontSize: ['10px', '10px', '10px', '12px'],\n fontWeight: 400,\n ml: '10px',\n opacity: 0.6,\n }}\n >\n (${formatNumberSI(claimableUSD(userBill))})\n </Text>\n </Flex>\n </Flex>\n <Flex\n sx={{\n width: '100%',\n justifyContent: 'space-between',\n alignItems: 'center',\n p: '4px 10px',\n background: 'white4',\n height: '26px',\n borderRadius: '0px 0px 10px 10px',\n }}\n >\n <Flex sx={{ alignItems: 'center', gap: '5px' }}>\n <Flex sx={{ opacity: 0.6 }}>Claimed</Flex>\n <TooltipBubble\n className=\"tooltip-bubble\"\n body={<Flex>{UserBillTooltipText.Claimed}</Flex>}\n width=\"230px\"\n placement=\"bottomLeft\"\n transformTip=\"translate(-5%, 0%)\"\n >\n <Flex className=\"block-header icon\">\n <Svg icon=\"questionCircle\" width=\"12px\" />\n </Flex>\n </TooltipBubble>\n </Flex>\n <Flex sx={{ alignItems: 'center' }}>\n <TokenImage symbol={payoutTokenSymbol} size={18} />\n <Text sx={{ fontSize: '12px', fontWeight: 700, ml: '10px' }}>\n {formatNumberSI(claimed(userBill), 4)}\n </Text>\n <Text\n sx={{\n fontSize: ['10px', '10px', '10px', '12px'],\n fontWeight: 400,\n ml: '10px',\n opacity: 0.6,\n }}\n >\n (${formatNumberSI(claimedUSD(userBill))})\n </Text>\n </Flex>\n </Flex>\n </Flex>\n {userBill?.bond?.warningCard && (\n <Flex\n sx={{\n width: '100%',\n background: '#DE62F366',\n justifyContent: 'center',\n borderRadius: 'normal',\n }}\n >\n <Text sx={{ fontSize: '12px', fontWeight: 400, p: '4px 10px', lineHeight: '16px' }}>\n <SafeHTMLComponent html={userBill?.bond?.warningCard} />\n </Text>\n </Flex>\n )}\n <Flex\n sx={{\n width: '100%',\n justifyContent: 'space-between',\n gap: ['10px', '10px', '10px', '15px'],\n height: '40px',\n }}\n >\n {userBill?.bond?.chainId === ChainId.SOL ? (\n <ActionsSolana userBill={userBill} />\n ) : userBill?.bond?.chainId === ChainId.APTOS ? (\n <ActionsAptos userBill={userBill} />\n ) : userBill?.bond?.chainId === ChainId.SUI ? (\n <ActionsSui userBill={userBill} />\n ) : (\n <Actions userBill={userBill} />\n )}\n </Flex>\n {!lostProfit && !SDKConfig.chains.includes(ChainId.BITTENSOR_TESTNET) && (\n <Recommendations billAddress={userBill?.address} />\n )}\n </Flex>\n </Flex>\n )}\n </Flex>\n </Modal>\n )\n}\n\nexport default YourBondsModal\n"],"names":["_jsx","_jsxs","NFTImage","_Fragment"],"mappings":"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"}
1	+ {"version":3,"file":"YourBondsModal.js","sources":["../../../src/views/YourBondsModal/YourBondsModal.tsx"],"sourcesContent":["import React, { useState } from 'react'\nimport { UserBill } from '../../types/yourbonds'\nimport TokenImage from '../../components/uikit-sdk/TokenImage'\nimport { formatNumberSI } from '../../utils/formatNumber'\nimport { UserBillTooltipText } from '../../config/constants/tooltips'\nimport Recommendations from './components/Recommendations/Recommendations'\nimport {\n claimable,\n claimableUSD,\n claimed,\n claimedUSD,\n getPendingVestingString,\n getPercentageVested,\n getTimeLeftForFullyVested,\n pending,\n pendingUSD,\n} from '../../utils/displayHelpers'\nimport { getTimePeriods } from '../../utils/getTimePeriods'\nimport SafeHTMLComponent from '../../components/SafeHTMLComponent'\nimport ProgressBar from '../../components/ProgressBar/ProgressBar'\nimport ProgressBarWrapper from '../../components/ProgressBar/ProgressBarWrapper'\nimport NFTImage from './components/NFTImage/NFTImage'\nimport YourBondModalHeader from './components/YourBondModalHeader/YourBondModalHeader'\nimport Actions from './components/Actions/Actions'\nimport { ChainId } from '@ape.swap/apeswap-lists'\nimport ActionsSolana from './components/Actions/ActionsSolana'\nimport ActionsAptos from './components/Actions/ActionsAptos'\nimport ActionsSui from './components/Actions/ActionsSui'\nimport Modal from '../../components/uikit-sdk/Modal'\nimport Flex from '../../components/uikit-sdk/Flex'\nimport Button from '../../components/uikit-sdk/Button/Button'\nimport TooltipBubble from '../../components/uikit-sdk/TooltipBubble'\nimport Text from '../../components/uikit-sdk/Text'\nimport { useSDKConfig } from '../../state/useSDKConfig'\nimport Arrow from '../../components/uikit-sdk/Svg/Icons/Arrow'\nimport QuestionCircle from '../../components/uikit-sdk/Svg/Icons/QuestionCircle'\n\nconst YourBondsModal = ({\n userBill,\n lostProfit,\n onDismiss,\n}: {\n userBill?: UserBill\n lostProfit?: string\n onDismiss?: () => void\n}) => {\n // Hooks\n const SDKConfig = useSDKConfig()\n\n // State\n const [showNFTImg, setShowNFTImg] = useState(false)\n\n // Static Data\n const depositUSD = userBill?.nftData?.data?.dollarValue\n const payout = userBill?.nftData?.data?.payout\n const payoutTokenPrice = parseFloat(userBill?.bond?.payoutTokenPrice ?? '0')\n const payoutUSD = payout && payoutTokenPrice ? payout * payoutTokenPrice : 0\n const payoutSymbol = userBill?.bond?.showcaseTokenName ?? userBill?.bond?.earnToken.symbol\n const payoutTokenSymbol = payoutSymbol === 'AIX' && userBill?.bond?.chainId === ChainId.SOL ? 'SOLAIX' : payoutSymbol\n\n // Cliff display info:\n const vestingCliff = userBill?.bond?.vestingCliff\n const currentTime = Math.round(new Date().getTime() / 1000)\n const vestingStartTimestamp = parseInt(userBill?.vestingStartTimestamp ?? '0')\n const isPendingCliff = vestingCliff ? currentTime - vestingStartTimestamp < vestingCliff : false\n const cliffCountdown = getTimePeriods(vestingStartTimestamp + (vestingCliff ?? 0) - currentTime, true)\n\n return (\n <Modal\n sx={{\n width: '480px',\n overflowY: 'unset !important',\n background: showNFTImg ? 'transparent !important' : 'white2',\n p: '0px',\n top: '56%',\n }}\n >\n <Flex\n sx={{\n flexDirection: 'column',\n borderRadius: 'normal',\n position: 'relative',\n background: showNFTImg ? 'transparent !important' : 'white2',\n p: '20px',\n }}\n >\n <NFTImage userBill={userBill} showNFTImg={showNFTImg} setShowNFTImg={setShowNFTImg} />\n\n {/* Modal Content */}\n\n {!showNFTImg && (\n <Flex sx={{ flexDirection: 'column' }}>\n <YourBondModalHeader userBill={userBill} onDismiss={onDismiss} />\n <Flex sx={{ mt: '10px', flexDirection: 'column', gap: '10px' }}>\n <Flex sx={{ width: '100%', gap: '15px', position: 'relative' }}>\n <Flex\n sx={{\n background: 'white3',\n borderRadius: 'normal',\n justifyContent: 'space-between',\n p: '10px',\n width: '50%',\n alignItems: 'center',\n fontSize: '14px',\n }}\n >\n <Flex>Deposit</Flex>\n <Flex>${formatNumberSI(depositUSD)}</Flex>\n </Flex>\n <Flex\n sx={{ position: 'absolute', top: '50%', left: '50%', transform: 'translateY(-50%) translateX(-50%)' }}\n >\n <Arrow direction=\"right\" width={'5px'} />\n </Flex>\n <Flex\n sx={{\n background: 'white3',\n borderRadius: 'normal',\n justifyContent: 'space-between',\n p: '10px',\n width: '50%',\n alignItems: 'center',\n fontSize: '14px',\n }}\n >\n <Flex>Bond Value</Flex>\n <Flex sx={{ alignItems: 'center', gap: '5px' }}>\n <TokenImage symbol={payoutTokenSymbol} size={22} />\n <Flex sx={{ flexDirection: 'column', fontSize: '14px', lineHeight: '16px' }}>\n <Flex sx={{ justifyContent: 'center' }}>{formatNumberSI(payout ?? '0')}</Flex>\n <Flex sx={{ fontSize: '10px', fontWeight: 400, opacity: 0.6, justifyContent: 'center' }}>\n (${formatNumberSI(payoutUSD)})\n </Flex>\n </Flex>\n </Flex>\n </Flex>\n </Flex>\n {lostProfit && (\n <Flex\n sx={{\n background: 'white3',\n borderRadius: 'normal',\n width: '100%',\n p: '10px',\n justifyContent: 'space-between',\n }}\n >\n <Flex sx={{ width: '20%' }}>\n <img\n src={`https://ape.bond/images/launch/mythical.png`}\n alt=\"mythical\"\n style={{ width: '90px', height: '90px' }}\n />\n </Flex>\n <Flex sx={{ width: '75%', flexDirection: 'column', gap: '3px' }}>\n <Flex>\n You missed a <Flex sx={{ color: 'success', px: '3px' }}>${lostProfit}</Flex> bonus\n </Flex>\n <Flex sx={{ fontSize: '12px', lineHeight: '16px', fontWeight: 400 }}>\n Holding an Ape Tier would’ve gotten you an extra 5% bonus on this purchase and all future ones.\n </Flex>\n <Button\n variant=\"secondary\"\n sx={{ width: '100%', fontSize: '14px', height: '30px', fontWeight: 600 }}\n onClick={() => window.open('https://ape.bond/true-yield', '_blank')}\n >\n Upgrade Your Tier\n </Button>\n </Flex>\n </Flex>\n )}\n <Flex\n sx={{\n flexDirection: 'column',\n fontSize: '12px',\n fontWeight: 400,\n }}\n >\n <Flex\n sx={{\n width: '100%',\n justifyContent: 'space-between',\n alignItems: 'center',\n p: '4px 10px',\n background: 'white3',\n borderRadius: '10px 10px 0px 0px',\n }}\n >\n <Flex sx={{ alignItems: 'center', gap: '5px' }}>\n <Flex sx={{ opacity: 0.6 }}>Vesting Progress</Flex>\n <TooltipBubble\n className=\"tooltip-bubble\"\n body={<Flex>{UserBillTooltipText.FullyVested}</Flex>}\n width=\"230px\"\n placement=\"bottomLeft\"\n transformTip=\"translate(-5%, 0%)\"\n >\n <Flex className=\"block-header icon\">\n <QuestionCircle width=\"12px\" />\n </Flex>\n </TooltipBubble>\n </Flex>\n <Flex sx={{ alignItems: 'center' }}>\n {isPendingCliff ? (\n <>\n Claiming starts in{' '}\n {`${cliffCountdown.days !== 0 ? `${cliffCountdown.days} days` : cliffCountdown.hours !== 0 ? `${cliffCountdown.hours} hours` : `${cliffCountdown.minutes} mins`}`}\n </>\n ) : (\n <ProgressBarWrapper\n title={''}\n value={<ProgressBar value={getPercentageVested(userBill)} />}\n style={{\n width: '100px',\n flexDirection: 'column',\n alignItems: 'center',\n }}\n showTooltip={true}\n toolTip={\n getTimeLeftForFullyVested(userBill) > 0\n ? `Fully vested in ${getPendingVestingString(userBill)}.`\n : `Fully Vested.`\n }\n />\n )}\n </Flex>\n </Flex>\n <Flex\n sx={{\n width: '100%',\n justifyContent: 'space-between',\n alignItems: 'center',\n p: '4px 10px',\n background: 'white4',\n height: '26px',\n }}\n >\n <Flex sx={{ alignItems: 'center', gap: '5px' }}>\n <Flex sx={{ opacity: 0.6 }}>Pending</Flex>\n <TooltipBubble\n className=\"tooltip-bubble\"\n body={<Flex>{UserBillTooltipText.Pending}</Flex>}\n width=\"230px\"\n placement=\"bottomLeft\"\n transformTip=\"translate(-5%, 0%)\"\n >\n <Flex className=\"block-header icon\">\n <QuestionCircle width=\"12px\" />\n </Flex>\n </TooltipBubble>\n </Flex>\n <Flex sx={{ alignItems: 'center' }}>\n <TokenImage symbol={payoutTokenSymbol} size={18} />\n <Text sx={{ fontSize: '12px', fontWeight: 700, ml: '10px' }}>\n {formatNumberSI(pending(userBill), 4)}\n </Text>\n <Text\n sx={{\n fontSize: ['10px', '10px', '10px', '12px'],\n fontWeight: 400,\n ml: '10px',\n opacity: 0.6,\n }}\n >\n (${formatNumberSI(pendingUSD(userBill))})\n </Text>\n </Flex>\n </Flex>\n <Flex\n sx={{\n width: '100%',\n justifyContent: 'space-between',\n alignItems: 'center',\n p: '4px 10px',\n background: 'white3',\n height: '26px',\n }}\n >\n <Flex sx={{ alignItems: 'center', gap: '5px' }}>\n <Flex sx={{ opacity: 0.6 }}>Claimable</Flex>\n <TooltipBubble\n className=\"tooltip-bubble\"\n body={<Flex>{UserBillTooltipText.Claimable}</Flex>}\n width=\"230px\"\n placement=\"bottomLeft\"\n transformTip=\"translate(-5%, 0%)\"\n >\n <Flex className=\"block-header icon\">\n <QuestionCircle width=\"12px\" />\n </Flex>\n </TooltipBubble>\n </Flex>\n <Flex sx={{ alignItems: 'center' }}>\n <TokenImage symbol={payoutTokenSymbol} size={18} />\n <Text sx={{ fontSize: '12px', fontWeight: 700, ml: '10px' }}>\n {formatNumberSI(claimable(userBill), 4)}\n </Text>\n <Text\n sx={{\n fontSize: ['10px', '10px', '10px', '12px'],\n fontWeight: 400,\n ml: '10px',\n opacity: 0.6,\n }}\n >\n (${formatNumberSI(claimableUSD(userBill))})\n </Text>\n </Flex>\n </Flex>\n <Flex\n sx={{\n width: '100%',\n justifyContent: 'space-between',\n alignItems: 'center',\n p: '4px 10px',\n background: 'white4',\n height: '26px',\n borderRadius: '0px 0px 10px 10px',\n }}\n >\n <Flex sx={{ alignItems: 'center', gap: '5px' }}>\n <Flex sx={{ opacity: 0.6 }}>Claimed</Flex>\n <TooltipBubble\n className=\"tooltip-bubble\"\n body={<Flex>{UserBillTooltipText.Claimed}</Flex>}\n width=\"230px\"\n placement=\"bottomLeft\"\n transformTip=\"translate(-5%, 0%)\"\n >\n <Flex className=\"block-header icon\">\n <QuestionCircle width=\"12px\" />\n </Flex>\n </TooltipBubble>\n </Flex>\n <Flex sx={{ alignItems: 'center' }}>\n <TokenImage symbol={payoutTokenSymbol} size={18} />\n <Text sx={{ fontSize: '12px', fontWeight: 700, ml: '10px' }}>\n {formatNumberSI(claimed(userBill), 4)}\n </Text>\n <Text\n sx={{\n fontSize: ['10px', '10px', '10px', '12px'],\n fontWeight: 400,\n ml: '10px',\n opacity: 0.6,\n }}\n >\n (${formatNumberSI(claimedUSD(userBill))})\n </Text>\n </Flex>\n </Flex>\n </Flex>\n {userBill?.bond?.warningCard && (\n <Flex\n sx={{\n width: '100%',\n background: '#DE62F366',\n justifyContent: 'center',\n borderRadius: 'normal',\n }}\n >\n <Text sx={{ fontSize: '12px', fontWeight: 400, p: '4px 10px', lineHeight: '16px' }}>\n <SafeHTMLComponent html={userBill?.bond?.warningCard} />\n </Text>\n </Flex>\n )}\n <Flex\n sx={{\n width: '100%',\n justifyContent: 'space-between',\n gap: ['10px', '10px', '10px', '15px'],\n height: '40px',\n }}\n >\n {userBill?.bond?.chainId === ChainId.SOL ? (\n <ActionsSolana userBill={userBill} />\n ) : userBill?.bond?.chainId === ChainId.APTOS ? (\n <ActionsAptos userBill={userBill} />\n ) : userBill?.bond?.chainId === ChainId.SUI ? (\n <ActionsSui userBill={userBill} />\n ) : (\n <Actions userBill={userBill} />\n )}\n </Flex>\n {!lostProfit && !SDKConfig.chains.includes(ChainId.BITTENSOR_TESTNET) && (\n <Recommendations billAddress={userBill?.address} />\n )}\n </Flex>\n </Flex>\n )}\n </Flex>\n </Modal>\n )\n}\n\nexport default YourBondsModal\n"],"names":["_jsx","_jsxs","NFTImage","_Fragment"],"mappings":"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"}

package/dist/views/YourBondsModal/components/LinkShare/LinkShare.js CHANGED Viewed

@@ -2,11 +2,11 @@ import { jsxs, jsx } from 'theme-ui/jsx-runtime';
 import { useState } from 'react';
 import { Spinner } from 'theme-ui';
 import Flex from '../../../../components/uikit-sdk/Flex/index.js';
-import Svg from '../../../../components/uikit-sdk/Svg/index.js';
 import { useURLByEnvironment } from '../../../../state/useSDKConfig.js';
 import { generateImageFromTemplate } from './utils.js';
 import track from '../../../../utils/track.js';
 import { ChainId } from '@ape.swap/apeswap-lists';
+import Twitter from '../../../../components/uikit-sdk/Svg/Icons/Twitter.js';
 const LinkShare = ({ userBill }) => {
     // State
@@ -50,7 +50,7 @@ const LinkShare = ({ userBill }) => {
             '&:hover': {
                 background: 'white5',
             },
-        }, onClick: () => handleShare(`https://twitter.com/intent/tweet?text=${text}&url=${shareUrl}`, 'x'), children: [jsx(Flex, { children: isLoading[0] ? jsx(Spinner, { size: 16 }) : jsx(Svg, { icon: "twitter", width: 20 }) }), jsx(Flex, { children: "SHARE" })] }));
+        }, onClick: () => handleShare(`https://twitter.com/intent/tweet?text=${text}&url=${shareUrl}`, 'x'), children: [jsx(Flex, { children: isLoading[0] ? jsx(Spinner, { size: 16 }) : jsx(Twitter, { width: 20 }) }), jsx(Flex, { children: "SHARE" })] }));
 };
 export { LinkShare as default };

package/dist/views/YourBondsModal/components/LinkShare/LinkShare.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"LinkShare.js","sources":["../../../../../src/views/YourBondsModal/components/LinkShare/LinkShare.tsx"],"sourcesContent":["import { useState } from 'react'\nimport { Spinner } from 'theme-ui'\nimport Flex from '../../../../components/uikit-sdk/Flex'\nimport ~~Svg from '../../../../components/uikit-sdk/Svg'\nimport~~ { useURLByEnvironment } from '../../../../state/useSDKConfig'\nimport { UserBill, UserBillNftData } from '../../../../types/yourbonds'\nimport { generateImageFromTemplate } from './utils'\nimport track from '../../../../utils/track'\nimport { ChainId } from '@ape.swap/apeswap-lists'\n\nconst LinkShare = ({ userBill }: { userBill: UserBill \| undefined }) => {\n // State\n const [isLoading, setIsLoading] = useState<boolean[]>([false, false])\n\n // Static data\n const bondNFTData: UserBillNftData \| undefined = userBill?.nftData\n const chainId = userBill?.bond?.chainId\n // Hooks\n const mainUrl = useURLByEnvironment('mainUrl')\n const apiUrl = useURLByEnvironment('apiV2') ?? ''\n const bondAddress =\n userBill?.bond?.chainId === ChainId.SOL ? bondNFTData?.contractAddress : bondNFTData?.data?.billNftAddress\n const shareUrl = `${mainUrl}/bond-nft?bondAddress=${bondAddress}%26bondChain=${bondNFTData?.chainId}%26tokenId=${userBill?.id}%26af=${bondNFTData?.data?.createdAddressOwner}`\n const text = `I've filled my bags with $${userBill?.bond?.earnToken.symbol} at a discount, thanks to Bonds-only on @apebond! Check it out: `\n const handleShare = async (url: string, social: string) => {\n if (isLoading[0] \|\| isLoading[1]) {\n console.log('something is off')\n return\n }\n track({\n event: 'referral',\n chain: chainId,\n data: {\n cat: `${social.toUpperCase()} Share Bond`,\n bond: bondNFTData?.data?.payoutTokenData.symbol,\n },\n })\n setIsLoading(social === 'x' ? [true, false] : [false, true])\n await generateImageFromTemplate(bondNFTData, url, apiUrl)\n setIsLoading([false, false])\n }\n\n return (\n <Flex\n sx={{\n background: ['white3', 'white3', 'white3', 'white4'],\n borderRadius: 'normal',\n justifyContent: 'center',\n alignItems: 'center',\n p: '2px 10px 2px 5px',\n fontWeight: 600,\n fontSize: '12px',\n height: '22px',\n cursor: 'pointer',\n '&:hover': {\n background: 'white5',\n },\n }}\n onClick={() => handleShare(`https://twitter.com/intent/tweet?text=${text}&url=${shareUrl}`, 'x')}\n >\n <Flex>{isLoading[0] ? <Spinner size={16} /> : <~~Svg~~ ~~icon=\"twitter\"~~ width={20} />}</Flex>\n <Flex>SHARE</Flex>\n </Flex>\n )\n}\n\nexport default LinkShare\n"],"names":["_jsxs","_jsx"],"mappings":";;;;;;;;;;AAUA,MAAM,SAAS,GAAG,CAAC,EAAE,QAAQ,EAAsC,KAAI;;AAErE,IAAA,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAY,CAAC,KAAK,EAAE,KAAK,CAAC,CAAC;;AAGrE,IAAA,MAAM,WAAW,GAAgC,QAAQ,EAAE,OAAO;AAClE,IAAA,MAAM,OAAO,GAAG,QAAQ,EAAE,IAAI,EAAE,OAAO;;AAEvC,IAAA,MAAM,OAAO,GAAG,mBAAmB,CAAC,SAAS,CAAC;IAC9C,MAAM,MAAM,GAAG,mBAAmB,CAAC,OAAO,CAAC,IAAI,EAAE;IACjD,MAAM,WAAW,GACf,QAAQ,EAAE,IAAI,EAAE,OAAO,KAAK,OAAO,CAAC,GAAG,GAAG,WAAW,EAAE,eAAe,GAAG,WAAW,EAAE,IAAI,EAAE,cAAc;IAC5G,MAAM,QAAQ,GAAG,CAAA,EAAG,OAAO,yBAAyB,WAAW,CAAA,aAAA,EAAgB,WAAW,EAAE,OAAO,cAAc,QAAQ,EAAE,EAAE,CAAA,MAAA,EAAS,WAAW,EAAE,IAAI,EAAE,mBAAmB,CAAA,CAAE;IAC9K,MAAM,IAAI,GAAG,CAAA,0BAAA,EAA6B,QAAQ,EAAE,IAAI,EAAE,SAAS,CAAC,MAAM,CAAA,gEAAA,CAAkE;IAC5I,MAAM,WAAW,GAAG,OAAO,GAAW,EAAE,MAAc,KAAI;QACxD,IAAI,SAAS,CAAC,CAAC,CAAC,IAAI,SAAS,CAAC,CAAC,CAAC,EAAE;AAChC,YAAA,OAAO,CAAC,GAAG,CAAC,kBAAkB,CAAC;YAC/B;QACF;AACA,QAAA,KAAK,CAAC;AACJ,YAAA,KAAK,EAAE,UAAU;AACjB,YAAA,KAAK,EAAE,OAAO;AACd,YAAA,IAAI,EAAE;AACJ,gBAAA,GAAG,EAAE,CAAA,EAAG,MAAM,CAAC,WAAW,EAAE,CAAA,WAAA,CAAa;AACzC,gBAAA,IAAI,EAAE,WAAW,EAAE,IAAI,EAAE,eAAe,CAAC,MAAM;AAChD,aAAA;AACF,SAAA,CAAC;QACF,YAAY,CAAkB,CAAC,IAAI,EAAE,KAAK,CAAC,CAAgB,CAAC;QAC5D,MAAM,yBAAyB,CAAC,WAAW,EAAE,GAAG,EAAE,MAAM,CAAC;AACzD,QAAA,YAAY,CAAC,CAAC,KAAK,EAAE,KAAK,CAAC,CAAC;AAC9B,IAAA,CAAC;AAED,IAAA,QACEA,IAAA,CAAC,IAAI,EAAA,EACH,EAAE,EAAE;YACF,UAAU,EAAE,CAAC,QAAQ,EAAE,QAAQ,EAAE,QAAQ,EAAE,QAAQ,CAAC;AACpD,YAAA,YAAY,EAAE,QAAQ;AACtB,YAAA,cAAc,EAAE,QAAQ;AACxB,YAAA,UAAU,EAAE,QAAQ;AACpB,YAAA,CAAC,EAAE,kBAAkB;AACrB,YAAA,UAAU,EAAE,GAAG;AACf,YAAA,QAAQ,EAAE,MAAM;AAChB,YAAA,MAAM,EAAE,MAAM;AACd,YAAA,MAAM,EAAE,SAAS;AACjB,YAAA,SAAS,EAAE;AACT,gBAAA,UAAU,EAAE,QAAQ;AACrB,aAAA;SACF,EACD,OAAO,EAAE,MAAM,WAAW,CAAC,CAAA,sCAAA,EAAyC,IAAI,CAAA,KAAA,EAAQ,QAAQ,~~CAAA~~,~~CAAE,~~EAAE,GAAG,CAAC,EAAA,QAAA,EAAA,CAEhGC,GAAA,CAAC,IAAI,~~EAAA~~,~~EAAA,QAAA,EAAE,~~SAAS,CAAC,CAAC,CAAC,GAAGA,GAAA,CAAC,OAAO,~~EAAA~~,~~EAAC,~~IAAI,EAAE,EAAE,EAAA,CAAI,GAAGA,GAAA,CAAC,~~GAAG~~,~~EAAA~~,~~EAAC,IAAI,EAAC,SAAS,EAAC,~~KAAK,EAAE,EAAE,EAAA,CAAI,EAAA,CAAQ,~~EACvFA~~,~~GAAA~~,~~CAAC,~~IAAI,EAAA,EAAA,QAAA,EAAA,OAAA,EAAA,CAAa,CAAA,EAAA,CACb;AAEX;;;;"}
1	+ {"version":3,"file":"LinkShare.js","sources":["../../../../../src/views/YourBondsModal/components/LinkShare/LinkShare.tsx"],"sourcesContent":["import { useState } from 'react'\nimport { Spinner } from 'theme-ui'\nimport Flex from '../../../../components/uikit-sdk/Flex'\nimport { useURLByEnvironment } from '../../../../state/useSDKConfig'\nimport { UserBill, UserBillNftData } from '../../../../types/yourbonds'\nimport { generateImageFromTemplate } from './utils'\nimport track from '../../../../utils/track'\nimport { ChainId } from '@ape.swap/apeswap-lists'\nimport Twitter from '../../../../components/uikit-sdk/Svg/Icons/Twitter'\n\nconst LinkShare = ({ userBill }: { userBill: UserBill \| undefined }) => {\n // State\n const [isLoading, setIsLoading] = useState<boolean[]>([false, false])\n\n // Static data\n const bondNFTData: UserBillNftData \| undefined = userBill?.nftData\n const chainId = userBill?.bond?.chainId\n // Hooks\n const mainUrl = useURLByEnvironment('mainUrl')\n const apiUrl = useURLByEnvironment('apiV2') ?? ''\n const bondAddress =\n userBill?.bond?.chainId === ChainId.SOL ? bondNFTData?.contractAddress : bondNFTData?.data?.billNftAddress\n const shareUrl = `${mainUrl}/bond-nft?bondAddress=${bondAddress}%26bondChain=${bondNFTData?.chainId}%26tokenId=${userBill?.id}%26af=${bondNFTData?.data?.createdAddressOwner}`\n const text = `I've filled my bags with $${userBill?.bond?.earnToken.symbol} at a discount, thanks to Bonds-only on @apebond! Check it out: `\n const handleShare = async (url: string, social: string) => {\n if (isLoading[0] \|\| isLoading[1]) {\n console.log('something is off')\n return\n }\n track({\n event: 'referral',\n chain: chainId,\n data: {\n cat: `${social.toUpperCase()} Share Bond`,\n bond: bondNFTData?.data?.payoutTokenData.symbol,\n },\n })\n setIsLoading(social === 'x' ? [true, false] : [false, true])\n await generateImageFromTemplate(bondNFTData, url, apiUrl)\n setIsLoading([false, false])\n }\n\n return (\n <Flex\n sx={{\n background: ['white3', 'white3', 'white3', 'white4'],\n borderRadius: 'normal',\n justifyContent: 'center',\n alignItems: 'center',\n p: '2px 10px 2px 5px',\n fontWeight: 600,\n fontSize: '12px',\n height: '22px',\n cursor: 'pointer',\n '&:hover': {\n background: 'white5',\n },\n }}\n onClick={() => handleShare(`https://twitter.com/intent/tweet?text=${text}&url=${shareUrl}`, 'x')}\n >\n <Flex>{isLoading[0] ? <Spinner size={16} /> : <Twitter width={20} />}</Flex>\n <Flex>SHARE</Flex>\n </Flex>\n )\n}\n\nexport default LinkShare\n"],"names":["_jsxs","_jsx"],"mappings":";;;;;;;;;;AAUA,MAAM,SAAS,GAAG,CAAC,EAAE,QAAQ,EAAsC,KAAI;;AAErE,IAAA,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAY,CAAC,KAAK,EAAE,KAAK,CAAC,CAAC;;AAGrE,IAAA,MAAM,WAAW,GAAgC,QAAQ,EAAE,OAAO;AAClE,IAAA,MAAM,OAAO,GAAG,QAAQ,EAAE,IAAI,EAAE,OAAO;;AAEvC,IAAA,MAAM,OAAO,GAAG,mBAAmB,CAAC,SAAS,CAAC;IAC9C,MAAM,MAAM,GAAG,mBAAmB,CAAC,OAAO,CAAC,IAAI,EAAE;IACjD,MAAM,WAAW,GACf,QAAQ,EAAE,IAAI,EAAE,OAAO,KAAK,OAAO,CAAC,GAAG,GAAG,WAAW,EAAE,eAAe,GAAG,WAAW,EAAE,IAAI,EAAE,cAAc;IAC5G,MAAM,QAAQ,GAAG,CAAA,EAAG,OAAO,yBAAyB,WAAW,CAAA,aAAA,EAAgB,WAAW,EAAE,OAAO,cAAc,QAAQ,EAAE,EAAE,CAAA,MAAA,EAAS,WAAW,EAAE,IAAI,EAAE,mBAAmB,CAAA,CAAE;IAC9K,MAAM,IAAI,GAAG,CAAA,0BAAA,EAA6B,QAAQ,EAAE,IAAI,EAAE,SAAS,CAAC,MAAM,CAAA,gEAAA,CAAkE;IAC5I,MAAM,WAAW,GAAG,OAAO,GAAW,EAAE,MAAc,KAAI;QACxD,IAAI,SAAS,CAAC,CAAC,CAAC,IAAI,SAAS,CAAC,CAAC,CAAC,EAAE;AAChC,YAAA,OAAO,CAAC,GAAG,CAAC,kBAAkB,CAAC;YAC/B;QACF;AACA,QAAA,KAAK,CAAC;AACJ,YAAA,KAAK,EAAE,UAAU;AACjB,YAAA,KAAK,EAAE,OAAO;AACd,YAAA,IAAI,EAAE;AACJ,gBAAA,GAAG,EAAE,CAAA,EAAG,MAAM,CAAC,WAAW,EAAE,CAAA,WAAA,CAAa;AACzC,gBAAA,IAAI,EAAE,WAAW,EAAE,IAAI,EAAE,eAAe,CAAC,MAAM;AAChD,aAAA;AACF,SAAA,CAAC;QACF,YAAY,CAAkB,CAAC,IAAI,EAAE,KAAK,CAAC,CAAgB,CAAC;QAC5D,MAAM,yBAAyB,CAAC,WAAW,EAAE,GAAG,EAAE,MAAM,CAAC;AACzD,QAAA,YAAY,CAAC,CAAC,KAAK,EAAE,KAAK,CAAC,CAAC;AAC9B,IAAA,CAAC;AAED,IAAA,QACEA,IAAA,CAAC,IAAI,EAAA,EACH,EAAE,EAAE;YACF,UAAU,EAAE,CAAC,QAAQ,EAAE,QAAQ,EAAE,QAAQ,EAAE,QAAQ,CAAC;AACpD,YAAA,YAAY,EAAE,QAAQ;AACtB,YAAA,cAAc,EAAE,QAAQ;AACxB,YAAA,UAAU,EAAE,QAAQ;AACpB,YAAA,CAAC,EAAE,kBAAkB;AACrB,YAAA,UAAU,EAAE,GAAG;AACf,YAAA,QAAQ,EAAE,MAAM;AAChB,YAAA,MAAM,EAAE,MAAM;AACd,YAAA,MAAM,EAAE,SAAS;AACjB,YAAA,SAAS,EAAE;AACT,gBAAA,UAAU,EAAE,QAAQ;AACrB,aAAA;SACF,EACD,OAAO,EAAE,MAAM,WAAW,CAAC,CAAA,sCAAA,EAAyC,IAAI,CAAA,KAAA,EAAQ,QAAQ,EAAE,EAAE,GAAG,CAAC,EAAA,QAAA,EAAA,CAEhGC,GAAA,CAAC,IAAI,cAAE,SAAS,CAAC,CAAC,CAAC,GAAGA,GAAA,CAAC,OAAO,IAAC,IAAI,EAAE,EAAE,EAAA,CAAI,GAAGA,GAAA,CAAC,OAAO,IAAC,KAAK,EAAE,EAAE,EAAA,CAAI,EAAA,CAAQ,EAC5EA,IAAC,IAAI,EAAA,EAAA,QAAA,EAAA,OAAA,EAAA,CAAa,CAAA,EAAA,CACb;AAEX;;;;"}

package/dist/views/YourBondsModal/components/NFTImage/NFTImage.js CHANGED Viewed

@@ -5,9 +5,11 @@ import LinkShare from '../LinkShare/LinkShare.js';
 import { useIsMobile } from '../../../../hooks/useIsMobile.js';
 import ProgressiveImage from '../../../../components/ProgressiveImage/index.js';
 import Flex from '../../../../components/uikit-sdk/Flex/index.js';
-import Svg from '../../../../components/uikit-sdk/Svg/index.js';
 import Text from '../../../../components/uikit-sdk/Text/index.js';
 import Skeleton from '../../../../components/uikit-sdk/Skeleton/index.js';
+import Close from '../../../../components/uikit-sdk/Svg/Icons/Close.js';
+import Tag from '../../../../components/uikit-sdk/Svg/Icons/Tag.js';
+import Caret from '../../../../components/uikit-sdk/Svg/Icons/Caret.js';
 const NftImage = ({ userBill, showNFTImg, setShowNFTImg, }) => {
     // Hooks
@@ -93,7 +95,7 @@ const NftImage = ({ userBill, showNFTImg, setShowNFTImg, }) => {
                                 borderRadius: '50%',
                                 alignItems: 'center',
                                 justifyContent: 'center',
-                            }, children: jsx(Flex, { sx: { width: '6px' }, children: jsx(Svg, { icon: "close" }) }) })), jsx(ProgressiveImage, { src: `${bondNFTData?.image}`, blurSrc: `https://ape.bond/images/bills/bluredNFT.png` }), showNFTImg && (jsx(Flex, { sx: {
+                            }, children: jsx(Flex, { sx: { width: '6px' }, children: jsx(Close, {}) }) })), jsx(ProgressiveImage, { src: `${bondNFTData?.image}`, blurSrc: `https://ape.bond/images/bills/bluredNFT.png` }), showNFTImg && (jsx(Flex, { sx: {
                                 position: 'absolute',
                                 bottom: ['calc(-35% + 1px)', 'calc(-35% + 1px)', 'calc(-26% + 1px)'],
                                 width: '100%',
@@ -120,7 +122,7 @@ const NftImage = ({ userBill, showNFTImg, setShowNFTImg, }) => {
                                         }, onClick: (event) => {
                                             event.stopPropagation();
                                             setIsOpenTraits(!isOpenTraits);
-                                        }, children: [jsxs(Flex, { sx: { gap: '10px', alignItems: 'center' }, children: [jsx(Svg, { icon: "tag", direction: "down" }), jsx(Text, { sx: { fontSize: '12px', fontWeight: 400, color: 'text', opacity: '0.6' }, children: "Traits" })] }), jsx(Svg, { icon: "caret", direction: isOpenTraits ? 'up' : 'down' })] }), jsx(AnimatePresence, { children: isOpenTraits && (jsx(motion.div, { initial: { height: 0 }, animate: { height: 'fit-content' }, transition: { opacity: { duration: 0.2 } }, exit: { height: 0 }, sx: {
+                                        }, children: [jsxs(Flex, { sx: { gap: '10px', alignItems: 'center' }, children: [jsx(Tag, { direction: "down" }), jsx(Text, { sx: { fontSize: '12px', fontWeight: 400, color: 'text', opacity: '0.6' }, children: "Traits" })] }), jsx(Caret, { direction: isOpenTraits ? 'up' : 'down' })] }), jsx(AnimatePresence, { children: isOpenTraits && (jsx(motion.div, { initial: { height: 0 }, animate: { height: 'fit-content' }, transition: { opacity: { duration: 0.2 } }, exit: { height: 0 }, sx: {
                                                 overflow: 'hidden',
                                                 width: '100%',
                                                 position: 'absolute',

package/dist/views/YourBondsModal/components/NFTImage/NFTImage.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"NFTImage.js","sources":["../../../../../src/views/YourBondsModal/components/NFTImage/NFTImage.tsx"],"sourcesContent":["import React, { useState } from 'react'\nimport { AnimatePresence, motion, useAnimation } from 'framer-motion'\nimport LinkShare from '../LinkShare/LinkShare'\nimport { UserBill } from '../../../../types/yourbonds'\nimport { useIsMobile } from '../../../../hooks/useIsMobile'\nimport ProgressiveImage from '../../../../components/ProgressiveImage'\nimport Flex from '../../../../components/uikit-sdk/Flex'\nimport Svg from '../../../../components/uikit-sdk/Svg'\nimport Text from '../../../../components/uikit-sdk/Text'\nimport Skeleton from '../../../../components/uikit-sdk/Skeleton'\n\nconst NftImage = ({\n userBill,\n showNFTImg,\n setShowNFTImg,\n}: {\n userBill?: UserBill\n showNFTImg: boolean\n setShowNFTImg: (value: boolean) => void\n}) => {\n // Hooks\n const controls = useAnimation()\n const isMobile = useIsMobile()\n\n // State\n const [isOpenTraits, setIsOpenTraits] = useState<boolean>(false)\n\n //Static Data\n const bondNFTData = userBill?.nftData\n const BILL_ATTRIBUTES = ['The Legend', 'The Location', 'The Moment', 'The Trend', 'The Innovation']\n const attributes = bondNFTData?.attributes?.filter((attrib) => BILL_ATTRIBUTES.includes(attrib.trait_type))\n\n const openAnimation = () => {\n controls.start({\n scale: isMobile ? [1, 2] : [1, 3],\n zIndex: 1000,\n transition: { duration: 0.2 },\n })\n }\n\n const closeAnimation = () => {\n controls.start({\n scale: isMobile ? [2, 1] : [2, 1],\n zIndex: -1,\n transition: { duration: 0.3 },\n })\n setShowNFTImg(false)\n setIsOpenTraits(false)\n }\n return (\n <>\n <AnimatePresence>\n {showNFTImg && (\n <motion.div\n animate={{ opacity: 1 }}\n transition={{ duration: 1, delay: 0.3 }}\n sx={{\n position: 'absolute',\n display: ['flex'],\n top: ['-180px', '-180px', '-240px'],\n right: ['50%', '50%', '50%', '-13%'],\n transform: ['translateX(50%)', 'translateX(50%)', 'translateX(50%)', 'unset'],\n opacity: 0,\n zIndex: 5000,\n }}\n >\n <LinkShare userBill={userBill} />\n </motion.div>\n )}\n </AnimatePresence>\n <AnimatePresence>\n {bondNFTData?.image && (\n <motion.div\n animate={controls}\n onClick={() => {\n if (showNFTImg) {\n closeAnimation()\n } else {\n openAnimation()\n }\n }}\n onAnimationStart={() => {\n setShowNFTImg(true)\n }}\n sx={{\n display: 'flex',\n zIndex: -1,\n position: showNFTImg ? 'fixed' : 'absolute',\n bottom: 'calc(100% - 10px)',\n left: '25%',\n width: '50%',\n aspectRatio: '1 / 0.56',\n cursor: 'pointer',\n borderRadius: 'normal',\n flexDirection: 'column',\n '&: hover': {\n zIndex: [1000, 1000, 1000, '1000 !important'],\n },\n }}\n >\n <Flex\n sx={{\n display: showNFTImg ? 'none' : 'flex',\n position: 'absolute',\n zIndex: 121,\n width: '100%',\n height: '100%',\n opacity: 0,\n alignItems: 'center',\n justifyContent: 'center',\n fontWeight: 700,\n borderRadius: 'normal',\n '&: hover': {\n zIndex: 1000,\n opacity: 0.8,\n background: 'linear-gradient(90deg, rgba(49, 46, 122, 0.70) 0%, rgba(92, 79, 174, 0.70) 100%)',\n backdropFilter: ' blur(2px)',\n },\n }}\n >\n View NFT {'>'}\n </Flex>\n {showNFTImg && (\n <Flex\n sx={{\n position: 'absolute',\n top: '5px',\n right: '5px',\n background: 'grey',\n opacity: 0.9,\n p: '2px',\n borderRadius: '50%',\n alignItems: 'center',\n justifyContent: 'center',\n }}\n >\n <Flex sx={{ width: '6px' }}>\n <Svg icon=\"close\" />\n </Flex>\n </Flex>\n )}\n <ProgressiveImage src={`${bondNFTData?.image}`} blurSrc={`https://ape.bond/images/bills/bluredNFT.png`} />\n {showNFTImg && (\n <Flex\n sx={{\n position: 'absolute',\n bottom: ['calc(-35% + 1px)', 'calc(-35% + 1px)', 'calc(-26% + 1px)'],\n width: '100%',\n justifyContent: 'center',\n }}\n >\n <Flex\n sx={{\n flexDirection: 'column',\n width: '100%',\n minWidth: '250px',\n pb: '10px',\n alignItems: 'center',\n transform: [\n 'scale(0.5) translateY(-50%)',\n 'scale(0.5) translateY(-50%)',\n 'scale(0.5) translateY(-50%)',\n 'scale(0.4) translateY(-75%)',\n ],\n }}\n >\n <Flex\n sx={{\n justifyContent: 'space-between',\n height: '24px',\n backgroundColor: 'white3',\n px: '15px',\n width: '100%',\n borderRadius: `${isOpenTraits ? '6px 6px 0px 0px' : 'normal'}`,\n }}\n onClick={(event: React.MouseEvent) => {\n event.stopPropagation()\n setIsOpenTraits(!isOpenTraits)\n }}\n >\n <Flex sx={{ gap: '10px', alignItems: 'center' }}>\n <Svg icon=\"tag\" direction=\"down\" />\n <Text sx={{ fontSize: '12px', fontWeight: 400, color: 'text', opacity: '0.6' }}>Traits</Text>\n </Flex>\n <Svg icon=\"caret\" direction={isOpenTraits ? 'up' : 'down'} />\n </Flex>\n <AnimatePresence>\n {isOpenTraits && (\n <motion.div\n initial={{ height: 0 }}\n animate={{ height: 'fit-content' }}\n transition={{ opacity: { duration: 0.2 } }}\n exit={{ height: 0 }}\n sx={{\n overflow: 'hidden',\n width: '100%',\n position: 'absolute',\n top: '24px',\n borderRadius: '0 0 10px 10px',\n }}\n onClick={(event: React.MouseEvent) => {\n event.stopPropagation()\n setIsOpenTraits(!isOpenTraits)\n }}\n >\n <Flex sx={{ flexDirection: 'column' }}>\n {attributes\n ? attributes.map((a, index) => (\n <Flex\n key={`${a.value}-${index}`}\n sx={{ background: 'white4', width: '100%', padding: '2px 8px', height: '22px' }}\n >\n <Text sx={{ fontSize: '10px', fontWeight: 500, mr: '3px' }}>{a?.trait_type} -</Text>\n <Text sx={{ fontSize: '10px', fontWeight: 500 }}>{a?.value}</Text>\n </Flex>\n ))\n : BILL_ATTRIBUTES.map((attrib, index) => {\n return (\n <Flex\n key={`${attrib}-${index}`}\n sx={{ background: 'white4', width: '100%', padding: '2px 8px', height: '22px' }}\n >\n <Text sx={{ fontSize: '10px', fontWeight: 500 }}>{attrib}</Text>\n <Skeleton width=\"150px\" />\n </Flex>\n )\n })}\n </Flex>\n </motion.div>\n )}\n </AnimatePresence>\n </Flex>\n </Flex>\n )}\n </motion.div>\n )}\n </AnimatePresence>\n </>\n )\n}\n\nexport default NftImage\n"],"names":["_jsxs","_Fragment","_jsx"],"mappings":"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"}
1	+ {"version":3,"file":"NFTImage.js","sources":["../../../../../src/views/YourBondsModal/components/NFTImage/NFTImage.tsx"],"sourcesContent":["import React, { useState } from 'react'\nimport { AnimatePresence, motion, useAnimation } from 'framer-motion'\nimport LinkShare from '../LinkShare/LinkShare'\nimport { UserBill } from '../../../../types/yourbonds'\nimport { useIsMobile } from '../../../../hooks/useIsMobile'\nimport ProgressiveImage from '../../../../components/ProgressiveImage'\nimport Flex from '../../../../components/uikit-sdk/Flex'\nimport Text from '../../../../components/uikit-sdk/Text'\nimport Skeleton from '../../../../components/uikit-sdk/Skeleton'\nimport Close from '../../../../components/uikit-sdk/Svg/Icons/Close'\nimport Tag from '../../../../components/uikit-sdk/Svg/Icons/Tag'\nimport Caret from '../../../../components/uikit-sdk/Svg/Icons/Caret'\n\nconst NftImage = ({\n userBill,\n showNFTImg,\n setShowNFTImg,\n}: {\n userBill?: UserBill\n showNFTImg: boolean\n setShowNFTImg: (value: boolean) => void\n}) => {\n // Hooks\n const controls = useAnimation()\n const isMobile = useIsMobile()\n\n // State\n const [isOpenTraits, setIsOpenTraits] = useState<boolean>(false)\n\n //Static Data\n const bondNFTData = userBill?.nftData\n const BILL_ATTRIBUTES = ['The Legend', 'The Location', 'The Moment', 'The Trend', 'The Innovation']\n const attributes = bondNFTData?.attributes?.filter((attrib) => BILL_ATTRIBUTES.includes(attrib.trait_type))\n\n const openAnimation = () => {\n controls.start({\n scale: isMobile ? [1, 2] : [1, 3],\n zIndex: 1000,\n transition: { duration: 0.2 },\n })\n }\n\n const closeAnimation = () => {\n controls.start({\n scale: isMobile ? [2, 1] : [2, 1],\n zIndex: -1,\n transition: { duration: 0.3 },\n })\n setShowNFTImg(false)\n setIsOpenTraits(false)\n }\n return (\n <>\n <AnimatePresence>\n {showNFTImg && (\n <motion.div\n animate={{ opacity: 1 }}\n transition={{ duration: 1, delay: 0.3 }}\n sx={{\n position: 'absolute',\n display: ['flex'],\n top: ['-180px', '-180px', '-240px'],\n right: ['50%', '50%', '50%', '-13%'],\n transform: ['translateX(50%)', 'translateX(50%)', 'translateX(50%)', 'unset'],\n opacity: 0,\n zIndex: 5000,\n }}\n >\n <LinkShare userBill={userBill} />\n </motion.div>\n )}\n </AnimatePresence>\n <AnimatePresence>\n {bondNFTData?.image && (\n <motion.div\n animate={controls}\n onClick={() => {\n if (showNFTImg) {\n closeAnimation()\n } else {\n openAnimation()\n }\n }}\n onAnimationStart={() => {\n setShowNFTImg(true)\n }}\n sx={{\n display: 'flex',\n zIndex: -1,\n position: showNFTImg ? 'fixed' : 'absolute',\n bottom: 'calc(100% - 10px)',\n left: '25%',\n width: '50%',\n aspectRatio: '1 / 0.56',\n cursor: 'pointer',\n borderRadius: 'normal',\n flexDirection: 'column',\n '&: hover': {\n zIndex: [1000, 1000, 1000, '1000 !important'],\n },\n }}\n >\n <Flex\n sx={{\n display: showNFTImg ? 'none' : 'flex',\n position: 'absolute',\n zIndex: 121,\n width: '100%',\n height: '100%',\n opacity: 0,\n alignItems: 'center',\n justifyContent: 'center',\n fontWeight: 700,\n borderRadius: 'normal',\n '&: hover': {\n zIndex: 1000,\n opacity: 0.8,\n background: 'linear-gradient(90deg, rgba(49, 46, 122, 0.70) 0%, rgba(92, 79, 174, 0.70) 100%)',\n backdropFilter: ' blur(2px)',\n },\n }}\n >\n View NFT {'>'}\n </Flex>\n {showNFTImg && (\n <Flex\n sx={{\n position: 'absolute',\n top: '5px',\n right: '5px',\n background: 'grey',\n opacity: 0.9,\n p: '2px',\n borderRadius: '50%',\n alignItems: 'center',\n justifyContent: 'center',\n }}\n >\n <Flex sx={{ width: '6px' }}>\n <Close />\n </Flex>\n </Flex>\n )}\n <ProgressiveImage src={`${bondNFTData?.image}`} blurSrc={`https://ape.bond/images/bills/bluredNFT.png`} />\n {showNFTImg && (\n <Flex\n sx={{\n position: 'absolute',\n bottom: ['calc(-35% + 1px)', 'calc(-35% + 1px)', 'calc(-26% + 1px)'],\n width: '100%',\n justifyContent: 'center',\n }}\n >\n <Flex\n sx={{\n flexDirection: 'column',\n width: '100%',\n minWidth: '250px',\n pb: '10px',\n alignItems: 'center',\n transform: [\n 'scale(0.5) translateY(-50%)',\n 'scale(0.5) translateY(-50%)',\n 'scale(0.5) translateY(-50%)',\n 'scale(0.4) translateY(-75%)',\n ],\n }}\n >\n <Flex\n sx={{\n justifyContent: 'space-between',\n height: '24px',\n backgroundColor: 'white3',\n px: '15px',\n width: '100%',\n borderRadius: `${isOpenTraits ? '6px 6px 0px 0px' : 'normal'}`,\n }}\n onClick={(event: React.MouseEvent) => {\n event.stopPropagation()\n setIsOpenTraits(!isOpenTraits)\n }}\n >\n <Flex sx={{ gap: '10px', alignItems: 'center' }}>\n <Tag direction=\"down\" />\n <Text sx={{ fontSize: '12px', fontWeight: 400, color: 'text', opacity: '0.6' }}>Traits</Text>\n </Flex>\n <Caret direction={isOpenTraits ? 'up' : 'down'} />\n </Flex>\n <AnimatePresence>\n {isOpenTraits && (\n <motion.div\n initial={{ height: 0 }}\n animate={{ height: 'fit-content' }}\n transition={{ opacity: { duration: 0.2 } }}\n exit={{ height: 0 }}\n sx={{\n overflow: 'hidden',\n width: '100%',\n position: 'absolute',\n top: '24px',\n borderRadius: '0 0 10px 10px',\n }}\n onClick={(event: React.MouseEvent) => {\n event.stopPropagation()\n setIsOpenTraits(!isOpenTraits)\n }}\n >\n <Flex sx={{ flexDirection: 'column' }}>\n {attributes\n ? attributes.map((a, index) => (\n <Flex\n key={`${a.value}-${index}`}\n sx={{ background: 'white4', width: '100%', padding: '2px 8px', height: '22px' }}\n >\n <Text sx={{ fontSize: '10px', fontWeight: 500, mr: '3px' }}>{a?.trait_type} -</Text>\n <Text sx={{ fontSize: '10px', fontWeight: 500 }}>{a?.value}</Text>\n </Flex>\n ))\n : BILL_ATTRIBUTES.map((attrib, index) => {\n return (\n <Flex\n key={`${attrib}-${index}`}\n sx={{ background: 'white4', width: '100%', padding: '2px 8px', height: '22px' }}\n >\n <Text sx={{ fontSize: '10px', fontWeight: 500 }}>{attrib}</Text>\n <Skeleton width=\"150px\" />\n </Flex>\n )\n })}\n </Flex>\n </motion.div>\n )}\n </AnimatePresence>\n </Flex>\n </Flex>\n )}\n </motion.div>\n )}\n </AnimatePresence>\n </>\n )\n}\n\nexport default NftImage\n"],"names":["_jsxs","_Fragment","_jsx"],"mappings":"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"}

package/dist/views/YourBondsModal/components/YourBondModalHeader/YourBondModalHeader.js CHANGED Viewed

@@ -8,8 +8,8 @@ import TransferBondModal from '../TransferBondModal/index.js';
 import Flex from '../../../../components/uikit-sdk/Flex/index.js';
 import Skeleton from '../../../../components/uikit-sdk/Skeleton/index.js';
 import Button from '../../../../components/uikit-sdk/Button/Button.js';
-import Svg from '../../../../components/uikit-sdk/Svg/index.js';
 import Text from '../../../../components/uikit-sdk/Text/index.js';
+import Close from '../../../../components/uikit-sdk/Svg/Icons/Close.js';
 const YourBondModalHeader = ({ userBill, onDismiss }) => {
     // Hooks
@@ -39,7 +39,7 @@ const YourBondModalHeader = ({ userBill, onDismiss }) => {
                             opacity: '0.6',
                             fontSize: ['11px', '11px', '11px', '14px'],
                             display: ['none', 'none', 'none', 'flex'],
-                        }, children: userBill?.id && `#${userBill.id}` })] }), jsxs(Flex, { sx: { gap: '7px' }, children: [jsx(Button, { onClick: onTransferBondModal, disabled: !userBill, sx: { height: '22px', fontSize: '12px', fontWeight: 600, p: '2px 6px' }, children: "TRANSFER" }), jsx(Flex, { className: "svg-close", onClick: onDismiss, sx: { cursor: 'pointer', p: '2px 5px' }, children: jsx(Svg, { icon: "close", width: isMobile ? '12px' : '18px' }) })] })] }));
+                        }, children: userBill?.id && `#${userBill.id}` })] }), jsxs(Flex, { sx: { gap: '7px' }, children: [jsx(Button, { onClick: onTransferBondModal, disabled: !userBill, sx: { height: '22px', fontSize: '12px', fontWeight: 600, p: '2px 6px' }, children: "TRANSFER" }), jsx(Flex, { className: "svg-close", onClick: onDismiss, sx: { cursor: 'pointer', p: '2px 5px' }, children: jsx(Close, { width: isMobile ? '12px' : '18px' }) })] })] }));
 };
 export { YourBondModalHeader as default };

package/dist/views/YourBondsModal/components/YourBondModalHeader/YourBondModalHeader.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"YourBondModalHeader.js","sources":["../../../../../src/views/YourBondsModal/components/YourBondModalHeader/YourBondModalHeader.tsx"],"sourcesContent":["import React from 'react'\nimport TokenImage from '../../../../components/uikit-sdk/TokenImage'\nimport { UserBill } from '../../../../types/yourbonds'\nimport { useIsMobile } from '../../../../hooks/useIsMobile'\nimport { Box } from 'theme-ui'\nimport ProfitCard from '../../../YourBonds/components/ProfitCard/ProfitCard'\nimport useModal from '../../../../hooks/useModal'\nimport TransferBondModal from '../TransferBondModal'\nimport Flex from '../../../../components/uikit-sdk/Flex'\nimport Skeleton from '../../../../components/uikit-sdk/Skeleton'\nimport Button from '../../../../components/uikit-sdk/Button/Button'\nimport ~~Svg~~ from '../../../../components/uikit-sdk/~~Svg~~'\nimport ~~Text~~ from '../../../../components/uikit-sdk/~~Text~~'\n\nconst YourBondModalHeader = ({ userBill, onDismiss }: { userBill?: UserBill; onDismiss?: () => void }) => {\n // Hooks\n const isMobile = useIsMobile()\n\n // Static Data\n const payoutTokenSymbol = userBill?.bond?.showcaseTokenName ?? userBill?.bond?.earnToken.symbol\n\n // Modals\n const [onTransferBondModal] = useModal(\n <TransferBondModal userBill={userBill} />,\n true,\n true,\n `transferModal${userBill?.id}}`,\n )\n\n return (\n <Flex sx={{ width: '100%', justifyContent: 'space-between', alignItems: 'center' }}>\n <Flex sx={{ alignItems: 'center', gap: '7px' }}>\n {payoutTokenSymbol ? (\n <>\n <TokenImage symbol={payoutTokenSymbol} size={30} chain={userBill?.bond?.chainId} />\n <Box\n sx={{\n fontSize: ['16px', '16px', '16px', '18px'],\n fontWeight: 700,\n opacity: 0.7,\n overflow: 'hidden',\n whiteSpace: 'nowrap',\n textOverflow: 'ellipsis',\n maxWidth: '100px',\n }}\n >\n {payoutTokenSymbol}\n </Box>\n </>\n ) : (\n <>\n <Skeleton\n animation=\"waves\"\n sx={{\n width: '30px',\n height: '30px',\n borderRadius: '55px',\n mr: '10px',\n }}\n />\n <Skeleton\n animation=\"waves\"\n sx={{\n width: '100px',\n borderRadius: 'normal',\n }}\n />\n </>\n )}\n <ProfitCard userBond={userBill} />\n <Text\n sx={{\n color: 'text',\n opacity: '0.6',\n fontSize: ['11px', '11px', '11px', '14px'],\n display: ['none', 'none', 'none', 'flex'],\n }}\n >\n {userBill?.id && `#${userBill.id}`}\n </Text>\n </Flex>\n <Flex sx={{ gap: '7px' }}>\n <Button\n onClick={onTransferBondModal}\n disabled={!userBill}\n sx={{ height: '22px', fontSize: '12px', fontWeight: 600, p: '2px 6px' }}\n >\n TRANSFER\n </Button>\n <Flex className=\"svg-close\" onClick={onDismiss} sx={{ cursor: 'pointer', p: '2px 5px' }}>\n <~~Svg~~ ~~icon=\"close\"~~ width={isMobile ? '12px' : '18px'} />\n </Flex>\n </Flex>\n </Flex>\n )\n}\n\nexport default YourBondModalHeader\n"],"names":["_jsx","_jsxs","_Fragment"],"mappings":";;;;;;;;;;;;;AAcA,MAAM,mBAAmB,GAAG,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAmD,KAAI;;AAEvG,IAAA,MAAM,QAAQ,GAAG,WAAW,EAAE;;AAG9B,IAAA,MAAM,iBAAiB,GAAG,QAAQ,EAAE,IAAI,EAAE,iBAAiB,IAAI,QAAQ,EAAE,IAAI,EAAE,SAAS,CAAC,MAAM;;IAG/F,MAAM,CAAC,mBAAmB,CAAC,GAAG,QAAQ,CACpCA,GAAA,CAAC,iBAAiB,EAAA,EAAC,QAAQ,EAAE,QAAQ,GAAI,EACzC,IAAI,EACJ,IAAI,EACJ,CAAA,aAAA,EAAgB,QAAQ,EAAE,EAAE,CAAA,CAAA,CAAG,CAChC;AAED,IAAA,QACEC,IAAA,CAAC,IAAI,EAAA,EAAC,EAAE,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,cAAc,EAAE,eAAe,EAAE,UAAU,EAAE,QAAQ,EAAE,EAAA,QAAA,EAAA,CAChFA,IAAA,CAAC,IAAI,EAAA,EAAC,EAAE,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,GAAG,EAAE,KAAK,EAAE,EAAA,QAAA,EAAA,CAC3C,iBAAiB,IAChBA,IAAA,CAAAC,QAAA,EAAA,EAAA,QAAA,EAAA,CACEF,GAAA,CAAC,UAAU,EAAA,EAAC,MAAM,EAAE,iBAAiB,EAAE,IAAI,EAAE,EAAE,EAAE,KAAK,EAAE,QAAQ,EAAE,IAAI,EAAE,OAAO,EAAA,CAAI,EACnFA,GAAA,CAAC,GAAG,EAAA,EACF,EAAE,EAAE;oCACF,QAAQ,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC;AAC1C,oCAAA,UAAU,EAAE,GAAG;AACf,oCAAA,OAAO,EAAE,GAAG;AACZ,oCAAA,QAAQ,EAAE,QAAQ;AAClB,oCAAA,UAAU,EAAE,QAAQ;AACpB,oCAAA,YAAY,EAAE,UAAU;AACxB,oCAAA,QAAQ,EAAE,OAAO;AAClB,iCAAA,EAAA,QAAA,EAEA,iBAAiB,EAAA,CACd,CAAA,EAAA,CACL,KAEHC,IAAA,CAAAC,QAAA,EAAA,EAAA,QAAA,EAAA,CACEF,GAAA,CAAC,QAAQ,EAAA,EACP,SAAS,EAAC,OAAO,EACjB,EAAE,EAAE;AACF,oCAAA,KAAK,EAAE,MAAM;AACb,oCAAA,MAAM,EAAE,MAAM;AACd,oCAAA,YAAY,EAAE,MAAM;AACpB,oCAAA,EAAE,EAAE,MAAM;iCACX,EAAA,CACD,EACFA,IAAC,QAAQ,EAAA,EACP,SAAS,EAAC,OAAO,EACjB,EAAE,EAAE;AACF,oCAAA,KAAK,EAAE,OAAO;AACd,oCAAA,YAAY,EAAE,QAAQ;AACvB,iCAAA,EAAA,CACD,CAAA,EAAA,CACD,CACJ,EACDA,GAAA,CAAC,UAAU,EAAA,EAAC,QAAQ,EAAE,QAAQ,GAAI,EAClCA,GAAA,CAAC,IAAI,EAAA,EACH,EAAE,EAAE;AACF,4BAAA,KAAK,EAAE,MAAM;AACb,4BAAA,OAAO,EAAE,KAAK;4BACd,QAAQ,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC;4BAC1C,OAAO,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC;yBAC1C,EAAA,QAAA,EAEA,QAAQ,EAAE,EAAE,IAAI,IAAI,QAAQ,CAAC,EAAE,CAAA,CAAE,EAAA,CAC7B,~~CAAA~~,~~EAAA,CACF,~~EACPC,IAAA,CAAC,IAAI,~~IAAC~~,EAAE,EAAE,EAAE,GAAG,EAAE,KAAK,EAAE,EAAA,QAAA,EAAA,CACtBD,~~GAAA~~,~~CAAC,~~MAAM,EAAA,EACL,OAAO,EAAE,mBAAmB,EAC5B,QAAQ,EAAE,CAAC,QAAQ,EACnB,EAAE,EAAE,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,EAAE,UAAU,EAAE,GAAG,EAAE,CAAC,EAAE,SAAS,EAAE,~~yBAGhE~~,EACTA,GAAA,CAAC,IAAI,~~EAAA~~,~~EAAC,~~SAAS,EAAC,WAAW,EAAC,OAAO,EAAE,SAAS,EAAE,EAAE,EAAE,EAAE,MAAM,EAAE,SAAS,EAAE,CAAC,EAAE,SAAS,EAAE,EAAA,QAAA,EACrFA,GAAA,CAAC,~~GAAG~~,EAAA,EAAC,~~IAAI,EAAC,OAAO,EAAC,~~KAAK,EAAE,QAAQ,GAAG,MAAM,GAAG,MAAM,GAAI,EAAA,~~CAClD~~,CAAA,EAAA,CACF,CAAA,EAAA,CACF;AAEX;;;;"}
1	+ {"version":3,"file":"YourBondModalHeader.js","sources":["../../../../../src/views/YourBondsModal/components/YourBondModalHeader/YourBondModalHeader.tsx"],"sourcesContent":["import React from 'react'\nimport TokenImage from '../../../../components/uikit-sdk/TokenImage'\nimport { UserBill } from '../../../../types/yourbonds'\nimport { useIsMobile } from '../../../../hooks/useIsMobile'\nimport { Box } from 'theme-ui'\nimport ProfitCard from '../../../YourBonds/components/ProfitCard/ProfitCard'\nimport useModal from '../../../../hooks/useModal'\nimport TransferBondModal from '../TransferBondModal'\nimport Flex from '../../../../components/uikit-sdk/Flex'\nimport Skeleton from '../../../../components/uikit-sdk/Skeleton'\nimport Button from '../../../../components/uikit-sdk/Button/Button'\nimport Text from '../../../../components/uikit-sdk/Text'\nimport Close from '../../../../components/uikit-sdk/Svg/Icons/Close'\n\nconst YourBondModalHeader = ({ userBill, onDismiss }: { userBill?: UserBill; onDismiss?: () => void }) => {\n // Hooks\n const isMobile = useIsMobile()\n\n // Static Data\n const payoutTokenSymbol = userBill?.bond?.showcaseTokenName ?? userBill?.bond?.earnToken.symbol\n\n // Modals\n const [onTransferBondModal] = useModal(\n <TransferBondModal userBill={userBill} />,\n true,\n true,\n `transferModal${userBill?.id}}`,\n )\n\n return (\n <Flex sx={{ width: '100%', justifyContent: 'space-between', alignItems: 'center' }}>\n <Flex sx={{ alignItems: 'center', gap: '7px' }}>\n {payoutTokenSymbol ? (\n <>\n <TokenImage symbol={payoutTokenSymbol} size={30} chain={userBill?.bond?.chainId} />\n <Box\n sx={{\n fontSize: ['16px', '16px', '16px', '18px'],\n fontWeight: 700,\n opacity: 0.7,\n overflow: 'hidden',\n whiteSpace: 'nowrap',\n textOverflow: 'ellipsis',\n maxWidth: '100px',\n }}\n >\n {payoutTokenSymbol}\n </Box>\n </>\n ) : (\n <>\n <Skeleton\n animation=\"waves\"\n sx={{\n width: '30px',\n height: '30px',\n borderRadius: '55px',\n mr: '10px',\n }}\n />\n <Skeleton\n animation=\"waves\"\n sx={{\n width: '100px',\n borderRadius: 'normal',\n }}\n />\n </>\n )}\n <ProfitCard userBond={userBill} />\n <Text\n sx={{\n color: 'text',\n opacity: '0.6',\n fontSize: ['11px', '11px', '11px', '14px'],\n display: ['none', 'none', 'none', 'flex'],\n }}\n >\n {userBill?.id && `#${userBill.id}`}\n </Text>\n </Flex>\n <Flex sx={{ gap: '7px' }}>\n <Button\n onClick={onTransferBondModal}\n disabled={!userBill}\n sx={{ height: '22px', fontSize: '12px', fontWeight: 600, p: '2px 6px' }}\n >\n TRANSFER\n </Button>\n <Flex className=\"svg-close\" onClick={onDismiss} sx={{ cursor: 'pointer', p: '2px 5px' }}>\n <Close width={isMobile ? '12px' : '18px'} />\n </Flex>\n </Flex>\n </Flex>\n )\n}\n\nexport default YourBondModalHeader\n"],"names":["_jsx","_jsxs","_Fragment"],"mappings":"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"}

package/dist/views/YourBondsModalYield/YourBondsModalYield.js CHANGED Viewed

@@ -6,7 +6,6 @@ import { UserBillTooltipText } from '../../config/constants/tooltips.js';
 import YourBondModalHeader from './components/YourBondModalHeader/YourBondModalHeader.js';
 import Modal from '../../components/uikit-sdk/Modal/index.js';
 import Flex from '../../components/uikit-sdk/Flex/index.js';
-import Svg from '../../components/uikit-sdk/Svg/index.js';
 import Button from '../../components/uikit-sdk/Button/Button.js';
 import TooltipBubble from '../../components/uikit-sdk/TooltipBubble/index.js';
 import Text from '../../components/uikit-sdk/Text/index.js';
@@ -24,6 +23,8 @@ import { useMonitorTx } from '../../hooks/useMonitorTx.js';
 import { formatTimeLeft } from '../../utils/getTimePeriods.js';
 import useModal from '../../hooks/useModal.js';
 import UnstakeModalYield from './components/UnstakeModalYield/UnstakeModalYield.js';
+import Arrow from '../../components/uikit-sdk/Svg/Icons/Arrow.js';
+import QuestionCircle from '../../components/uikit-sdk/Svg/Icons/QuestionCircle.js';
 const YourBondsModalYield = ({ userBill, onDismiss }) => {
     // Hooks
@@ -147,7 +148,7 @@ const YourBondsModalYield = ({ userBill, onDismiss }) => {
                                             width: '65%',
                                             alignItems: 'center',
                                             fontSize: '14px',
-                                        }, children: [jsx(Flex, { children: "Deposit" }), jsx(Flex, { sx: { alignItems: 'center', gap: '5px' }, children: saleFinalized && hasRedeemed ? (jsxs(Fragment, { children: [jsx(TokenImage, { symbol: userBill?.underlyingEarnToken?.symbol, size: 18 }), formatNumberSI(depositedAssets), jsxs("span", { sx: { color: 'textDisabledButton', fontSize: '12px' }, children: ["($", formatNumberSI(depositedAssetsUSD), ")"] })] })) : (jsxs(Fragment, { children: [jsx(TokenImage, { symbol: userBill?.lpToken.symbol, size: 18 }), formatNumberSI(depositUSD)] })) })] }), jsx(Flex, { sx: { position: 'absolute', top: '50%', left: '65%', transform: 'translateY(-50%) translateX(-50%)' }, children: jsx(Svg, { icon: "arrow", direction: "right", width: '5px' }) }), jsxs(Flex, { sx: {
+                                        }, children: [jsx(Flex, { children: "Deposit" }), jsx(Flex, { sx: { alignItems: 'center', gap: '5px' }, children: saleFinalized && hasRedeemed ? (jsxs(Fragment, { children: [jsx(TokenImage, { symbol: userBill?.underlyingEarnToken?.symbol, size: 18 }), formatNumberSI(depositedAssets), jsxs("span", { sx: { color: 'textDisabledButton', fontSize: '12px' }, children: ["($", formatNumberSI(depositedAssetsUSD), ")"] })] })) : (jsxs(Fragment, { children: [jsx(TokenImage, { symbol: userBill?.lpToken.symbol, size: 18 }), formatNumberSI(depositUSD)] })) })] }), jsx(Flex, { sx: { position: 'absolute', top: '50%', left: '65%', transform: 'translateY(-50%) translateX(-50%)' }, children: jsx(Arrow, { direction: "right", width: '5px' }) }), jsxs(Flex, { sx: {
                                             background: 'white3',
                                             borderRadius: 'normal',
                                             justifyContent: 'space-between',
@@ -167,14 +168,14 @@ const YourBondsModalYield = ({ userBill, onDismiss }) => {
                                             background: 'white4',
                                             height: '26px',
                                             borderRadius: '10px 10px 0 0',
-                                        }, children: hasRedeemed ? (jsxs(Fragment, { children: [jsxs(Flex, { sx: { alignItems: 'center', gap: '5px' }, children: [jsx(Flex, { sx: { opacity: 0.6 }, children: "Vault Ends" }), jsx(TooltipBubble, { className: "tooltip-bubble", body: jsx(Flex, { children: "This is the date when reward distribution finishes." }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, 0%)", children: jsx(Flex, { className: "block-header icon", children: jsx(Svg, { icon: "questionCircle", width: "12px", color: 'textDisabledButton' }) }) })] }), jsx(Flex, { sx: { alignItems: 'center' }, children: formatUTCDate(new Date((userBill?.yieldData?.rewardDistributionEnd ?? 0) * 1000)) })] })) : (jsxs(Fragment, { children: [jsxs(Flex, { sx: { alignItems: 'center', gap: '5px' }, children: [jsx(Flex, { sx: { opacity: 0.6 }, children: "Yield starts in" }), jsx(TooltipBubble, { className: "tooltip-bubble", body: jsx(Flex, { children: "Time left for the vault to start accruing rewards." }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, 0%)", children: jsx(Flex, { className: "block-header icon", children: jsx(Svg, { icon: "questionCircle", width: "12px", color: 'textDisabledButton' }) }) })] }), endTimeFinished && !canRedeem ? ('Soon...') : canRedeem ? ('Activate Yield') : (jsxs(Flex, { sx: { alignItems: 'center', gap: '5px' }, children: [redeemableInLong, jsx(TooltipBubble, { className: "tooltip-bubble", body: jsxs(Flex, { onClick: () => setUseLocal(!useLocal), sx: { cursor: 'pointer' }, children: ["Claimable at", ' ', formatUTCDate(new Date((userBill?.redeemTime ?? 0) * 1000), false, useLocal), ' ', useLocal ? 'Local' : 'UTC'] }), width: "230px", placement: "bottomRight", transformTip: "translate(10%, 0%)", children: jsx(Flex, { className: "block-header icon", children: jsx(Svg, { icon: "questionCircle", width: "12px", color: 'textDisabledButton' }) }) })] }))] })) }), jsxs(Flex, { sx: {
+                                        }, children: hasRedeemed ? (jsxs(Fragment, { children: [jsxs(Flex, { sx: { alignItems: 'center', gap: '5px' }, children: [jsx(Flex, { sx: { opacity: 0.6 }, children: "Vault Ends" }), jsx(TooltipBubble, { className: "tooltip-bubble", body: jsx(Flex, { children: "This is the date when reward distribution finishes." }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, 0%)", children: jsx(Flex, { className: "block-header icon", children: jsx(QuestionCircle, { width: "12px", color: 'textDisabledButton' }) }) })] }), jsx(Flex, { sx: { alignItems: 'center' }, children: formatUTCDate(new Date((userBill?.yieldData?.rewardDistributionEnd ?? 0) * 1000)) })] })) : (jsxs(Fragment, { children: [jsxs(Flex, { sx: { alignItems: 'center', gap: '5px' }, children: [jsx(Flex, { sx: { opacity: 0.6 }, children: "Yield starts in" }), jsx(TooltipBubble, { className: "tooltip-bubble", body: jsx(Flex, { children: "Time left for the vault to start accruing rewards." }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, 0%)", children: jsx(Flex, { className: "block-header icon", children: jsx(QuestionCircle, { width: "12px", color: 'textDisabledButton' }) }) })] }), endTimeFinished && !canRedeem ? ('Soon...') : canRedeem ? ('Activate Yield') : (jsxs(Flex, { sx: { alignItems: 'center', gap: '5px' }, children: [redeemableInLong, jsx(TooltipBubble, { className: "tooltip-bubble", body: jsxs(Flex, { onClick: () => setUseLocal(!useLocal), sx: { cursor: 'pointer' }, children: ["Claimable at", ' ', formatUTCDate(new Date((userBill?.redeemTime ?? 0) * 1000), false, useLocal), ' ', useLocal ? 'Local' : 'UTC'] }), width: "230px", placement: "bottomRight", transformTip: "translate(10%, 0%)", children: jsx(Flex, { className: "block-header icon", children: jsx(QuestionCircle, { width: "12px", color: 'textDisabledButton' }) }) })] }))] })) }), jsxs(Flex, { sx: {
                                             width: '100%',
                                             justifyContent: 'space-between',
                                             alignItems: 'center',
                                             p: '4px 10px',
                                             background: 'white3',
                                             height: '26px',
-                                        }, children: [jsxs(Flex, { sx: { alignItems: 'center', gap: '5px' }, children: [jsx(Flex, { sx: { opacity: 0.6 }, children: "Claimable Rewards" }), jsx(TooltipBubble, { className: "tooltip-bubble", body: jsx(Flex, { children: "Amount of tokens that can be claimed in this moment" }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, 0%)", children: jsx(Flex, { className: "block-header icon", children: jsx(Svg, { icon: "questionCircle", width: "12px", color: 'textDisabledButton' }) }) })] }), jsxs(Flex, { sx: { alignItems: 'center' }, children: [jsx(TokenImage, { symbol: payoutSymbol, size: 18 }), jsx(Text, { sx: { fontSize: '12px', fontWeight: 700, ml: '10px' }, children: formatNumberSI(claimableRewards, 4) }), jsxs(Text, { sx: {
+                                        }, children: [jsxs(Flex, { sx: { alignItems: 'center', gap: '5px' }, children: [jsx(Flex, { sx: { opacity: 0.6 }, children: "Claimable Rewards" }), jsx(TooltipBubble, { className: "tooltip-bubble", body: jsx(Flex, { children: "Amount of tokens that can be claimed in this moment" }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, 0%)", children: jsx(Flex, { className: "block-header icon", children: jsx(QuestionCircle, { width: "12px", color: 'textDisabledButton' }) }) })] }), jsxs(Flex, { sx: { alignItems: 'center' }, children: [jsx(TokenImage, { symbol: payoutSymbol, size: 18 }), jsx(Text, { sx: { fontSize: '12px', fontWeight: 700, ml: '10px' }, children: formatNumberSI(claimableRewards, 4) }), jsxs(Text, { sx: {
                                                             fontSize: ['10px', '10px', '10px', '12px'],
                                                             fontWeight: 400,
                                                             ml: '10px',
@@ -187,7 +188,7 @@ const YourBondsModalYield = ({ userBill, onDismiss }) => {
                                             background: 'white4',
                                             height: '26px',
                                             borderRadius: '0px 0px 10px 10px',
-                                        }, children: [jsxs(Flex, { sx: { alignItems: 'center', gap: '5px' }, children: [jsx(Flex, { sx: { opacity: 0.6 }, children: "Claimed " }), jsx(TooltipBubble, { className: "tooltip-bubble", body: jsx(Flex, { children: UserBillTooltipText.Claimed }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, 0%)", children: jsx(Flex, { className: "block-header icon", children: jsx(Svg, { icon: "questionCircle", width: "12px", color: 'textDisabledButton' }) }) })] }), jsxs(Flex, { sx: { alignItems: 'center' }, children: [jsx(TokenImage, { symbol: payoutSymbol, size: 18 }), jsx(Text, { sx: { fontSize: '12px', fontWeight: 700, ml: '10px' }, children: formatNumberSI(userBill?.yieldData?.claimed, 4) }), jsxs(Text, { sx: {
+                                        }, children: [jsxs(Flex, { sx: { alignItems: 'center', gap: '5px' }, children: [jsx(Flex, { sx: { opacity: 0.6 }, children: "Claimed " }), jsx(TooltipBubble, { className: "tooltip-bubble", body: jsx(Flex, { children: UserBillTooltipText.Claimed }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, 0%)", children: jsx(Flex, { className: "block-header icon", children: jsx(QuestionCircle, { width: "12px", color: 'textDisabledButton' }) }) })] }), jsxs(Flex, { sx: { alignItems: 'center' }, children: [jsx(TokenImage, { symbol: payoutSymbol, size: 18 }), jsx(Text, { sx: { fontSize: '12px', fontWeight: 700, ml: '10px' }, children: formatNumberSI(userBill?.yieldData?.claimed, 4) }), jsxs(Text, { sx: {
                                                             fontSize: ['10px', '10px', '10px', '12px'],
                                                             fontWeight: 400,
                                                             ml: '10px',