@ape.swap/bonds-sdk 6.1.14 → 6.1.16

package/dist/views/Bonds/Bonds.js.map

@@ -1 +1 @@
-{"version":3,"file":"Bonds.js","sources":["../../../src/views/Bonds/Bonds.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useMemo, useState } from 'react'\nimport { BondsData } from '../../types/bonds'\nimport { useTopTags } from '../../hooks/useTopTags'\nimport { isBondSoldOut, isBondSupported, sortBonds } from './utils'\nimport useBondsData from '../../state/bonds/useBondsData'\nimport CheckURL from './components/CheckURL'\nimport PlaceholderMonkey from '../../components/PlaceholderMonkey'\nimport useFavoriteTokens from '../../state/favoriteTokens/useFavoriteTokens'\nimport useChainFilterOption from '../../state/chainFilterOption/useChainFilterOption'\nimport useBondsList from '../../state/bonds/useBondsList'\nimport { BaseBondConfig } from '@ape.swap/apeswap-lists'\nimport RecommendationCards from './components/RecommendationCards'\nimport BondsMenu from './components/BondsMenu/BondsMenu'\nimport { useSDKConfig } from '../../state/useSDKConfig'\nimport BuyAgainRow from './components/BuyAgainRow'\nimport LoadingSkeleton from './components/LoadingSkeleton/LoadingSkeleton'\nimport useHotBonds from '../../state/hotBonds/useHotBonds'\nimport useBondsListPreTGE from '../../state/bonds/useBondsListPreTGE'\nimport { MAINNET_CHAINS } from '../../config/constants/chains'\nimport ActiveBondRows from './components/BondRows/ActiveBondRows'\nimport SoldOutRows from './components/BondRows/SoldOutRows'\nimport Flex from '../../components/uikit-sdk/Flex'\nimport Svg from '../../components/uikit-sdk/Svg'\n\ntype SortableKeys = 'bonus' | 'arr' | 'terms' | 'tokensRemaining'\ntype SortDirection = 'asc' | 'desc'\n\nexport interface SortOptions {\n  key: SortableKeys\n  direction: SortDirection\n}\n\nexport type GroupedByChain = Record<number, (BondsData | BaseBondConfig)[]>\nexport type GroupedBySymbol = Record<number, Record<string, (BondsData | BaseBondConfig)[]>>\n\nconst Bonds = () => {\n  // Fetch data\n  useHotBonds()\n  const SDKConfig = useSDKConfig()\n  const { favTokens } = useFavoriteTokens()\n  const { data: bondData } = useBondsData()\n  const { data: allBonds } = useBondsList()\n  const { data: allPreBonds } = useBondsListPreTGE()\n  const { data: chainFilterOption, setChainFilterOption } = useChainFilterOption()\n  const topTags = useTopTags()\n\n  // State\n  const [sortConfig, setSortConfig] = useState<SortOptions | undefined>({ key: 'bonus', direction: 'desc' })\n  const [searchQuery, setSearchQuery] = useState('')\n  const [filterOption, setFilterOption] = useState('ALL')\n\n  // Static data\n  const filterOptions = ['ALL', 'FAVORITES', ...topTags, 'SOLD OUT']\n  const validatedChains = SDKConfig?.chains?.filter((chain) => MAINNET_CHAINS.includes(chain))\n\n  const billsToRender: GroupedByChain | GroupedBySymbol = useMemo(() => {\n    let bondsToUse\n\n    if (filterOption === 'SOLD OUT') {\n      if (!allBonds || !allPreBonds) return {}\n      bondsToUse = [...allPreBonds, ...allBonds]\n    } else {\n      bondsToUse = sortBonds(sortConfig, bondData)\n    }\n\n    const filteredBonds = bondsToUse?.filter((bill) => {\n      // filter incompatible bonds\n      if (!isBondSupported(SDKConfig.highestCompatibleVersion!, bill.version)) return false\n\n      // filter onlyPartner Bonds\n      if (bill.onlyPartner && SDKConfig.bondPartner !== bill.bondPartner) return false\n\n      // filter searchQuery\n      if (searchQuery) {\n        const matchesSearch = [\n          //@ts-ignore\n          `${bill?.underlyingEarnToken?.symbol?.toUpperCase()}`,\n          `${bill?.earnToken?.symbol.toUpperCase()}`,\n          `${bill?.lpToken?.symbol.toUpperCase()}`,\n        ].some((property) => property?.includes(searchQuery.toUpperCase()))\n        if (!matchesSearch) return false\n      }\n\n      // filter tiers\n      if (!SDKConfig?.useTiers && 'minTier' in bill) {\n        if (bill.minTier !== null && bill.minTier !== undefined) return false\n      }\n\n      // filter bondPartner\n      if (SDKConfig?.bondPartner && bill.bondPartner !== SDKConfig.bondPartner) return false\n\n      // filter topTags\n      if (topTags.includes(filterOption) && !bill?.tags?.includes(filterOption)) return false\n\n      // filter chainFilterOption\n      if (chainFilterOption && !chainFilterOption?.includes('All Chains')) {\n        if (!chainFilterOption?.includes(bill?.chainId?.toString())) return false\n      }\n\n      // filter SOLD OUT\n      if (filterOption === 'SOLD OUT' && !isBondSoldOut(bill as BondsData, SDKConfig.showLowValueBonds)) return false\n\n      // filter not SOLD OUT\n      if (filterOption !== 'SOLD OUT' && isBondSoldOut(bill as BondsData, SDKConfig.showLowValueBonds)) return false\n\n      // filter FAVORITES\n      if (filterOption === 'FAVORITES' && !favTokens.includes(bill?.earnToken?.symbol?.toLowerCase())) return false\n\n      return true\n    })\n\n    if (filterOption === 'SOLD OUT') {\n      return filteredBonds?.reduce<GroupedBySymbol>((acc, bond) => {\n        const symbol = bond?.earnToken?.symbol\n        const chainId = bond.chainId\n\n        if (!acc[chainId]) acc[chainId] = {}\n\n        if (!acc[chainId][symbol]) acc[chainId][symbol] = []\n\n        acc[chainId][symbol].push(bond)\n        return acc\n      }, {})\n    } else {\n      return filteredBonds?.reduce<GroupedByChain>((acc, bond) => {\n        const { chainId } = bond\n        if (!acc[chainId]) acc[chainId] = []\n        acc[chainId].push(bond)\n        return acc\n      }, {})\n    }\n  }, [\n    allBonds,\n    allPreBonds,\n    sortConfig,\n    bondData,\n    filterOption,\n    SDKConfig.highestCompatibleVersion,\n    SDKConfig.bondPartner,\n    SDKConfig?.useTiers,\n    SDKConfig.showLowValueBonds,\n    searchQuery,\n    topTags,\n    chainFilterOption,\n    favTokens,\n  ])\n\n  // Handlers\n  const handleSortOptions = useCallback(\n    (key: SortableKeys) => {\n      let direction: SortDirection = 'desc'\n      if (sortConfig?.key === key && sortConfig?.direction === 'desc') {\n        direction = 'asc'\n      }\n      setSortConfig({ key, direction })\n    },\n    [sortConfig?.key, sortConfig?.direction],\n  )\n\n  const handleChangeFilterOption = useCallback((newOption: string) => {\n    setFilterOption(newOption)\n  }, [])\n\n  useEffect(() => {\n    const hash = window.location.hash\n    //@ts-ignore\n    if (bondData?.length > 0 && hash) {\n      const tryScroll = () => {\n        const normalizedHash = decodeURIComponent(hash).replace(/\\s+/g, '')\n        const element = document.querySelector(normalizedHash)\n        if (element) {\n          const y = element.getBoundingClientRect().top + window.scrollY - 70\n          window.scrollTo({ top: y, behavior: 'smooth' })\n        } else {\n          setTimeout(tryScroll, 50)\n        }\n      }\n      tryScroll()\n    }\n  }, [bondData?.length])\n\n  return (\n    <Flex className=\"bonds-container\">\n      <CheckURL />\n      <BondsMenu\n        searchQuery={searchQuery}\n        setSearchQuery={setSearchQuery}\n        setChainFilterOption={setChainFilterOption}\n        chainFilterOption={chainFilterOption ?? ['All Chains']}\n        filterOptions={filterOptions}\n        filterOption={filterOption}\n        setFilterOption={handleChangeFilterOption}\n        onSort={handleSortOptions}\n      />\n      {SDKConfig.useHotBonds && !SDKConfig.bondPartner && filterOption !== 'SOLD OUT' && <BuyAgainRow />}\n      {Object.keys(billsToRender)?.length > 0 ? (\n        <Flex className=\"bondrowsbychain\">\n          {validatedChains?.map((chain) =>\n            filterOption === 'SOLD OUT' ? (\n              Object.entries(billsToRender[chain] ?? {}).map((groupedBonds) => (\n                <SoldOutRows bonds={groupedBonds[1]} key={groupedBonds[0]} />\n              ))\n            ) : (\n              <ActiveBondRows\n                chain={chain}\n                bonds={(billsToRender[chain] ?? []) as (BondsData | BaseBondConfig)[]}\n                key={chain}\n                hideTitles={searchQuery !== ''}\n                showHotBonds={!searchQuery && SDKConfig.useHotBonds && SDKConfig?.hotBondChains?.includes(chain)}\n              />\n            ),\n          )}\n        </Flex>\n      ) : searchQuery || !chainFilterOption.includes('All Chains') ? (\n        <Flex className=\"placeholder-monkey-wrapper\">\n          <PlaceholderMonkey text={'No results, change filters.'} />\n        </Flex>\n      ) : filterOption === 'FAVORITES' ? (\n        <Flex\n          sx={{\n            width: '100%',\n            height: '300px',\n            background: 'white2',\n            borderRadius: 'normal',\n            justifyContent: 'center',\n            alignItems: 'center',\n            flexDirection: 'column',\n            mt: '10px',\n          }}\n        >\n          <Svg icon=\"StarFilled\" width={75} height={75} />\n          <Flex sx={{ mt: '10px' }}>{`You don't have any Favorite Bonds yet!`}</Flex>\n          <Flex sx={{ fontSize: '12px', fontWeight: 400, color: 'textDisabledButton', mt: '10px' }}>\n            {`Click on the 'star' or 'fire' icon to add Bonds to the list.`}\n          </Flex>\n        </Flex>\n      ) : (\n        <LoadingSkeleton />\n      )}\n      {SDKConfig.useHotBonds && <RecommendationCards />}\n      <Flex sx={{ width: '100%', justifyContent: 'center', my: '15px' }} className=\"powered-by-apebond\">\n        <img\n          src=\"https://res.cloudinary.com/dswmrqgwy/image/upload/v1741643990/poweredbyapebondsdk_cxiouj.png\"\n          alt=\"powered-by-apebond\"\n          style={{ width: '200px', height: 'auto' }}\n        />\n      </Flex>\n    </Flex>\n  )\n}\n\nexport default Bonds\n"],"names":["_jsxs","_jsx","CheckURL"],"mappings":"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"}
+{"version":3,"file":"Bonds.js","sources":["../../../src/views/Bonds/Bonds.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useMemo, useState } from 'react'\nimport { BondsData } from '../../types/bonds'\nimport { useTopTags } from '../../hooks/useTopTags'\nimport { isBondSoldOut, isBondSupported, sortBonds } from './utils'\nimport useBondsData from '../../state/bonds/useBondsData'\nimport CheckURL from './components/CheckURL'\nimport PlaceholderMonkey from '../../components/PlaceholderMonkey'\nimport useFavoriteTokens from '../../state/favoriteTokens/useFavoriteTokens'\nimport useChainFilterOption from '../../state/chainFilterOption/useChainFilterOption'\nimport useBondsList from '../../state/bonds/useBondsList'\nimport { BaseBondConfig } from '@ape.swap/apeswap-lists'\nimport RecommendationCards from './components/RecommendationCards'\nimport BondsMenu from './components/BondsMenu/BondsMenu'\nimport { useSDKConfig } from '../../state/useSDKConfig'\nimport BuyAgainRow from './components/BuyAgainRow'\nimport LoadingSkeleton from './components/LoadingSkeleton/LoadingSkeleton'\nimport useHotBonds from '../../state/hotBonds/useHotBonds'\nimport useBondsListPreTGE from '../../state/bonds/useBondsListPreTGE'\nimport { MAINNET_CHAINS } from '../../config/constants/chains'\nimport ActiveBondRows from './components/BondRows/ActiveBondRows'\nimport SoldOutRows from './components/BondRows/SoldOutRows'\nimport Flex from '../../components/uikit-sdk/Flex'\nimport StarFilled from '../../components/uikit-sdk/Svg/Icons/StarFilled'\n\ntype SortableKeys = 'bonus' | 'arr' | 'terms' | 'tokensRemaining'\ntype SortDirection = 'asc' | 'desc'\n\nexport interface SortOptions {\n  key: SortableKeys\n  direction: SortDirection\n}\n\nexport type GroupedByChain = Record<number, (BondsData | BaseBondConfig)[]>\nexport type GroupedBySymbol = Record<number, Record<string, (BondsData | BaseBondConfig)[]>>\n\nconst Bonds = () => {\n  // Fetch data\n  useHotBonds()\n  const SDKConfig = useSDKConfig()\n  const { favTokens } = useFavoriteTokens()\n  const { data: bondData } = useBondsData()\n  const { data: allBonds } = useBondsList()\n  const { data: allPreBonds } = useBondsListPreTGE()\n  const { data: chainFilterOption, setChainFilterOption } = useChainFilterOption()\n  const topTags = useTopTags()\n\n  // State\n  const [sortConfig, setSortConfig] = useState<SortOptions | undefined>({ key: 'bonus', direction: 'desc' })\n  const [searchQuery, setSearchQuery] = useState('')\n  const [filterOption, setFilterOption] = useState('ALL')\n\n  // Static data\n  const filterOptions = ['ALL', 'FAVORITES', ...topTags, 'SOLD OUT']\n  const validatedChains = SDKConfig?.chains?.filter((chain) => MAINNET_CHAINS.includes(chain))\n\n  const billsToRender: GroupedByChain | GroupedBySymbol = useMemo(() => {\n    let bondsToUse\n\n    if (filterOption === 'SOLD OUT') {\n      if (!allBonds || !allPreBonds) return {}\n      bondsToUse = [...allPreBonds, ...allBonds]\n    } else {\n      bondsToUse = sortBonds(sortConfig, bondData)\n    }\n\n    const filteredBonds = bondsToUse?.filter((bill) => {\n      // filter incompatible bonds\n      if (!isBondSupported(SDKConfig.highestCompatibleVersion!, bill.version)) return false\n\n      // filter onlyPartner Bonds\n      if (bill.onlyPartner && SDKConfig.bondPartner !== bill.bondPartner) return false\n\n      // filter searchQuery\n      if (searchQuery) {\n        const matchesSearch = [\n          //@ts-ignore\n          `${bill?.underlyingEarnToken?.symbol?.toUpperCase()}`,\n          `${bill?.earnToken?.symbol.toUpperCase()}`,\n          `${bill?.lpToken?.symbol.toUpperCase()}`,\n        ].some((property) => property?.includes(searchQuery.toUpperCase()))\n        if (!matchesSearch) return false\n      }\n\n      // filter tiers\n      if (!SDKConfig?.useTiers && 'minTier' in bill) {\n        if (bill.minTier !== null && bill.minTier !== undefined) return false\n      }\n\n      // filter bondPartner\n      if (SDKConfig?.bondPartner && bill.bondPartner !== SDKConfig.bondPartner) return false\n\n      // filter topTags\n      if (topTags.includes(filterOption) && !bill?.tags?.includes(filterOption)) return false\n\n      // filter chainFilterOption\n      if (chainFilterOption && !chainFilterOption?.includes('All Chains')) {\n        if (!chainFilterOption?.includes(bill?.chainId?.toString())) return false\n      }\n\n      // filter SOLD OUT\n      if (filterOption === 'SOLD OUT' && !isBondSoldOut(bill as BondsData, SDKConfig.showLowValueBonds)) return false\n\n      // filter not SOLD OUT\n      if (filterOption !== 'SOLD OUT' && isBondSoldOut(bill as BondsData, SDKConfig.showLowValueBonds)) return false\n\n      // filter FAVORITES\n      if (filterOption === 'FAVORITES' && !favTokens.includes(bill?.earnToken?.symbol?.toLowerCase())) return false\n\n      return true\n    })\n\n    if (filterOption === 'SOLD OUT') {\n      return filteredBonds?.reduce<GroupedBySymbol>((acc, bond) => {\n        const symbol = bond?.earnToken?.symbol\n        const chainId = bond.chainId\n\n        if (!acc[chainId]) acc[chainId] = {}\n\n        if (!acc[chainId][symbol]) acc[chainId][symbol] = []\n\n        acc[chainId][symbol].push(bond)\n        return acc\n      }, {})\n    } else {\n      return filteredBonds?.reduce<GroupedByChain>((acc, bond) => {\n        const { chainId } = bond\n        if (!acc[chainId]) acc[chainId] = []\n        acc[chainId].push(bond)\n        return acc\n      }, {})\n    }\n  }, [\n    allBonds,\n    allPreBonds,\n    sortConfig,\n    bondData,\n    filterOption,\n    SDKConfig.highestCompatibleVersion,\n    SDKConfig.bondPartner,\n    SDKConfig?.useTiers,\n    SDKConfig.showLowValueBonds,\n    searchQuery,\n    topTags,\n    chainFilterOption,\n    favTokens,\n  ])\n\n  // Handlers\n  const handleSortOptions = useCallback(\n    (key: SortableKeys) => {\n      let direction: SortDirection = 'desc'\n      if (sortConfig?.key === key && sortConfig?.direction === 'desc') {\n        direction = 'asc'\n      }\n      setSortConfig({ key, direction })\n    },\n    [sortConfig?.key, sortConfig?.direction],\n  )\n\n  const handleChangeFilterOption = useCallback((newOption: string) => {\n    setFilterOption(newOption)\n  }, [])\n\n  useEffect(() => {\n    const hash = window.location.hash\n    //@ts-ignore\n    if (bondData?.length > 0 && hash) {\n      const tryScroll = () => {\n        const normalizedHash = decodeURIComponent(hash).replace(/\\s+/g, '')\n        const element = document.querySelector(normalizedHash)\n        if (element) {\n          const y = element.getBoundingClientRect().top + window.scrollY - 70\n          window.scrollTo({ top: y, behavior: 'smooth' })\n        } else {\n          setTimeout(tryScroll, 50)\n        }\n      }\n      tryScroll()\n    }\n  }, [bondData?.length])\n\n  return (\n    <Flex className=\"bonds-container\">\n      <CheckURL />\n      <BondsMenu\n        searchQuery={searchQuery}\n        setSearchQuery={setSearchQuery}\n        setChainFilterOption={setChainFilterOption}\n        chainFilterOption={chainFilterOption ?? ['All Chains']}\n        filterOptions={filterOptions}\n        filterOption={filterOption}\n        setFilterOption={handleChangeFilterOption}\n        onSort={handleSortOptions}\n      />\n      {SDKConfig.useHotBonds && !SDKConfig.bondPartner && filterOption !== 'SOLD OUT' && <BuyAgainRow />}\n      {Object.keys(billsToRender)?.length > 0 ? (\n        <Flex className=\"bondrowsbychain\">\n          {validatedChains?.map((chain) =>\n            filterOption === 'SOLD OUT' ? (\n              Object.entries(billsToRender[chain] ?? {}).map((groupedBonds) => (\n                <SoldOutRows bonds={groupedBonds[1]} key={groupedBonds[0]} />\n              ))\n            ) : (\n              <ActiveBondRows\n                chain={chain}\n                bonds={(billsToRender[chain] ?? []) as (BondsData | BaseBondConfig)[]}\n                key={chain}\n                hideTitles={searchQuery !== ''}\n                showHotBonds={!searchQuery && SDKConfig.useHotBonds && SDKConfig?.hotBondChains?.includes(chain)}\n              />\n            ),\n          )}\n        </Flex>\n      ) : searchQuery || !chainFilterOption.includes('All Chains') ? (\n        <Flex className=\"placeholder-monkey-wrapper\">\n          <PlaceholderMonkey text={'No results, change filters.'} />\n        </Flex>\n      ) : filterOption === 'FAVORITES' ? (\n        <Flex\n          sx={{\n            width: '100%',\n            height: '300px',\n            background: 'white2',\n            borderRadius: 'normal',\n            justifyContent: 'center',\n            alignItems: 'center',\n            flexDirection: 'column',\n            mt: '10px',\n          }}\n        >\n          <StarFilled width={75} height={75} />\n          <Flex sx={{ mt: '10px' }}>{`You don't have any Favorite Bonds yet!`}</Flex>\n          <Flex sx={{ fontSize: '12px', fontWeight: 400, color: 'textDisabledButton', mt: '10px' }}>\n            {`Click on the 'star' or 'fire' icon to add Bonds to the list.`}\n          </Flex>\n        </Flex>\n      ) : (\n        <LoadingSkeleton />\n      )}\n      {SDKConfig.useHotBonds && <RecommendationCards />}\n      <Flex sx={{ width: '100%', justifyContent: 'center', my: '15px' }} className=\"powered-by-apebond\">\n        <img\n          src=\"https://res.cloudinary.com/dswmrqgwy/image/upload/v1741643990/poweredbyapebondsdk_cxiouj.png\"\n          alt=\"powered-by-apebond\"\n          style={{ width: '200px', height: 'auto' }}\n        />\n      </Flex>\n    </Flex>\n  )\n}\n\nexport default Bonds\n"],"names":["_jsxs","_jsx","CheckURL"],"mappings":"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"}

package/dist/views/Bonds/components/BondRows/BondRow.js

@@ -13,7 +13,9 @@ import SafeHTMLComponent from '../../../../components/SafeHTMLComponent/index.js
 import { MCBondRowStyles } from '../../../../utils/campaignStyles.js';
 import Flex from '../../../../components/uikit-sdk/Flex/index.js';
 import TooltipBubble from '../../../../components/uikit-sdk/TooltipBubble/index.js';
-import Svg from '../../../../components/uikit-sdk/Svg/index.js';
+import QuestionCircle from '../../../../components/uikit-sdk/Svg/Icons/QuestionCircle.js';
+import Caret from '../../../../components/uikit-sdk/Svg/Icons/Caret.js';
+import More from '../../../../components/uikit-sdk/Svg/Icons/More.js';
 
 const BondRow = ({ bondAddress, bondChain, marketingCampaign, payoutToken, billType, tag, bondSoldOut, trueBondPrices, minTier, bonus, airdropTooltip, vestingTermString, vestingCliffString, percentageAvailable, remainingTokensString, projectURL, twitterURL, shortDescription, soldoutBondsCount, isOpen, cgId, dexscreener, }) => {
     const SDKConfig = useSDKConfig();
@@ -51,13 +53,13 @@ const BondRow = ({ bondAddress, bondChain, marketingCampaign, payoutToken, billT
             '&:hover .list-tag': {
                 background: 'rgb(20 18 29 / 0.25)',
             },
-        }, children: [jsx("div", { className: "token-info-container", sx: { width: ['45%', '45%', '45%', '30%'], minWidth: ['unset', 'unset', 'unset', '400px'] }, children: jsx(TokenInfoAndName, { tokenSymbol: payoutToken?.symbol, chain: bondChain, tag: tag, marketingCampaign: marketingCampaign }) }), SDKConfig.useCardsView && shortDescription && (jsx("div", { className: "short-description", children: jsx(SafeHTMLComponent, { html: shortDescription }) })), jsxs("div", { className: "bond-info-columns", sx: { width: ['55%', '55%', '55%', '70%'] }, children: [!SDKConfig.useCardsView && jsx(Flex, { sx: { display: ['none', 'none', 'none', 'flex'], width: '125px' } }), jsx(BonusContainer, { trueBondPrices: trueBondPrices, minTier: minTier, bonus: bonus, airdropTooltip: airdropTooltip }), jsxs("div", { className: "terms-column", children: [vestingTermString, vestingCliffString && (jsx(TooltipBubble, { className: "tooltip-bubble", body: jsx(Flex, { children: vestingCliffString }), width: "180px", placement: "bottomRight", transformTip: "translate(13%, 0%)", children: jsx(Flex, { sx: { opacity: 0.6, ml: '6px' }, children: jsx(Svg, { icon: "questionCircle", width: "12px" }) }) }))] }), jsx("div", { className: "tokens-remaining-column", children: bondSoldOut ? ('-') : (jsx(ProgressBarWrapper, { title: '', value: jsx(ProgressBar, { value: percentageAvailable }), style: {
+        }, children: [jsx("div", { className: "token-info-container", sx: { width: ['45%', '45%', '45%', '30%'], minWidth: ['unset', 'unset', 'unset', '400px'] }, children: jsx(TokenInfoAndName, { tokenSymbol: payoutToken?.symbol, chain: bondChain, tag: tag, marketingCampaign: marketingCampaign }) }), SDKConfig.useCardsView && shortDescription && (jsx("div", { className: "short-description", children: jsx(SafeHTMLComponent, { html: shortDescription }) })), jsxs("div", { className: "bond-info-columns", sx: { width: ['55%', '55%', '55%', '70%'] }, children: [!SDKConfig.useCardsView && jsx(Flex, { sx: { display: ['none', 'none', 'none', 'flex'], width: '125px' } }), jsx(BonusContainer, { trueBondPrices: trueBondPrices, minTier: minTier, bonus: bonus, airdropTooltip: airdropTooltip }), jsxs("div", { className: "terms-column", children: [vestingTermString, vestingCliffString && (jsx(TooltipBubble, { className: "tooltip-bubble", body: jsx(Flex, { children: vestingCliffString }), width: "180px", placement: "bottomRight", transformTip: "translate(13%, 0%)", children: jsx(Flex, { sx: { opacity: 0.6, ml: '6px' }, children: jsx(QuestionCircle, { width: "12px" }) }) }))] }), jsx("div", { className: "tokens-remaining-column", children: bondSoldOut ? ('-') : (jsx(ProgressBarWrapper, { title: '', value: jsx(ProgressBar, { value: percentageAvailable }), style: {
                                 width: '127px',
                                 height: '25px',
                                 flexDirection: 'column',
                                 justifyContent: 'center',
                                 display: ['none', 'none', 'none', 'flex'],
-                            }, showTooltip: true, toolTip: remainingTokensString })) }), jsx("div", { className: "tooltip-column", children: soldoutBondsCount ? (jsxs(Flex, { sx: { gap: '5px', fontSize: '13px', fontWeight: 500, opacity: 0.5 }, children: ["(", soldoutBondsCount, ")", jsx(Svg, { icon: "caret", direction: isOpen ? 'up' : 'down', width: "8px" })] })) : (jsx(TooltipBubble, { className: "tooltip-bubble", body: jsx(BondInfoTooltip, { earnTokenContract: payoutToken?.address?.[bondChain] ?? '', earnTokenSymbol: payoutToken?.symbol ?? '', bondContract: bondAddress ?? '', projectLink: projectURL, twitter: twitterURL, chain: bondChain, isSoldOut: bondSoldOut, billType: billType, cgId: cgId, dexscreener: dexscreener }), width: "205px", placement: "bottomRight", transformTip: "translate(7%, -2%)", children: jsx(Flex, { className: "more-icon", sx: { opacity: 0.8 }, children: jsx(Svg, { icon: "more", width: "25px" }) }) })) })] })] }, `${bondAddress}-${bondChain}`));
+                            }, showTooltip: true, toolTip: remainingTokensString })) }), jsx("div", { className: "tooltip-column", children: soldoutBondsCount ? (jsxs(Flex, { sx: { gap: '5px', fontSize: '13px', fontWeight: 500, opacity: 0.5 }, children: ["(", soldoutBondsCount, ")", jsx(Caret, { direction: isOpen ? 'up' : 'down', width: "8px" })] })) : (jsx(TooltipBubble, { className: "tooltip-bubble", body: jsx(BondInfoTooltip, { earnTokenContract: payoutToken?.address?.[bondChain] ?? '', earnTokenSymbol: payoutToken?.symbol ?? '', bondContract: bondAddress ?? '', projectLink: projectURL, twitter: twitterURL, chain: bondChain, isSoldOut: bondSoldOut, billType: billType, cgId: cgId, dexscreener: dexscreener }), width: "205px", placement: "bottomRight", transformTip: "translate(7%, -2%)", children: jsx(Flex, { className: "more-icon", sx: { opacity: 0.8 }, children: jsx(More, { width: "25px" }) }) })) })] })] }, `${bondAddress}-${bondChain}`));
 };
 
 export { BondRow as default };

package/dist/views/Bonds/components/BondRows/BondRow.js.map

@@ -1 +1 @@
-{"version":3,"file":"BondRow.js","sources":["../../../../../src/views/Bonds/components/BondRows/BondRow.tsx"],"sourcesContent":["import React from 'react'\nimport { TrueBondPrices } from '../../../../types/bonds'\nimport ProgressBar from '../../../../components/ProgressBar/ProgressBar'\nimport ProgressBarWrapper from '../../../../components/ProgressBar/ProgressBarWrapper'\nimport TokenInfoAndName from '../../../../components/TokenInfoAndName'\nimport Tooltip from '../../../../components/Tooltip/Tooltip'\nimport { ChainId, LaunchBondTiers, MarketingCampaign, Token } from '@ape.swap/apeswap-lists'\nimport useModal from '../../../../hooks/useModal'\nimport ModalHandler from './ModalHandler'\nimport track from '../../../../utils/track'\nimport BonusContainer from '../BonusComponents/BonusContainer'\nimport ModalHandlerPreTGE from './ModalHandlerPreTGE'\nimport { useSDKConfig } from '../../../../state/useSDKConfig'\nimport SafeHTMLComponent from '../../../../components/SafeHTMLComponent'\nimport { MCBondRowStyles } from '../../../../utils/campaignStyles'\nimport Flex from '../../../../components/uikit-sdk/Flex'\nimport TooltipBubble from '../../../../components/uikit-sdk/TooltipBubble'\nimport Svg from '../../../../components/uikit-sdk/Svg'\n\ninterface BondRowProps {\n  bondAddress: string\n  bondChain: ChainId\n  marketingCampaign?: MarketingCampaign\n  payoutToken: Token\n  billType: string\n  tag?: string\n  bondSoldOut?: boolean\n  trueBondPrices?: TrueBondPrices[]\n  minTier?: LaunchBondTiers\n  bonus?: string\n  airdropTooltip?: string\n  vestingTermString: string\n  vestingCliffString?: string\n  percentageAvailable: number\n  remainingTokensString: string\n  projectURL?: string\n  twitterURL?: string\n  shortDescription?: string\n  soldoutBondsCount?: number\n  isOpen?: boolean\n  cgId?: string\n  dexscreener?: string\n}\n\nconst BondRow: React.FC<BondRowProps> = ({\n  bondAddress,\n  bondChain,\n  marketingCampaign,\n  payoutToken,\n  billType,\n  tag,\n  bondSoldOut,\n  trueBondPrices,\n  minTier,\n  bonus,\n  airdropTooltip,\n  vestingTermString,\n  vestingCliffString,\n  percentageAvailable,\n  remainingTokensString,\n  projectURL,\n  twitterURL,\n  shortDescription,\n  soldoutBondsCount,\n  isOpen,\n  cgId,\n  dexscreener,\n}) => {\n  const SDKConfig = useSDKConfig()\n\n  // Modal\n  const [openBuyModal] = useModal(\n    <ModalHandler bondAddress={bondAddress} bondChain={bondChain} />,\n    true,\n    true,\n    `buyBondModal-${bondAddress.toLowerCase()}-${bondChain}`,\n  )\n\n  const [openPreTGEBondModal] = useModal(\n    <ModalHandlerPreTGE bondAddress={bondAddress} bondChain={bondChain} />,\n    true,\n    true,\n    `preTGEBuyBondModal:${bondAddress.toLowerCase()}-${bondChain}}`,\n  )\n\n  const handleOpenModal = () => {\n    if (bondSoldOut) return\n    if (billType === 'fcfs') {\n      openPreTGEBondModal()\n    } else {\n      openBuyModal()\n    }\n    if (typeof window !== 'undefined') {\n      const locationPath = window.location.pathname.replace('/', '')\n      window.history.pushState({}, '', `${locationPath}?bondAddress=${bondAddress}&bondChain=${bondChain}`)\n    }\n    track({\n      event: 'buyModalOpen',\n      chain: bondChain,\n      data: {\n        cat: 'Row',\n        bond: payoutToken.symbol,\n        bondChain: bondChain,\n      },\n    })\n  }\n\n  return (\n    <div\n      className=\"bond-row\"\n      onClick={handleOpenModal}\n      key={`${bondAddress}-${bondChain}`}\n      sx={{\n        borderRadius: 'normal',\n        // Insert special campaign styles here\n        ...MCBondRowStyles[marketingCampaign!],\n        cursor: !bondSoldOut || (soldoutBondsCount && !isOpen) ? 'pointer' : 'default',\n        '&:hover .list-tag': {\n          background: 'rgb(20 18 29 / 0.25)',\n        },\n      }}\n    >\n      <div\n        className=\"token-info-container\"\n        sx={{ width: ['45%', '45%', '45%', '30%'], minWidth: ['unset', 'unset', 'unset', '400px'] }}\n      >\n        <TokenInfoAndName\n          tokenSymbol={payoutToken?.symbol}\n          chain={bondChain}\n          tag={tag}\n          marketingCampaign={marketingCampaign}\n        />\n      </div>\n      {SDKConfig.useCardsView && shortDescription && (\n        <div className=\"short-description\">\n          <SafeHTMLComponent html={shortDescription} />\n        </div>\n      )}\n      <div className=\"bond-info-columns\" sx={{ width: ['55%', '55%', '55%', '70%'] }}>\n        {!SDKConfig.useCardsView && <Flex sx={{ display: ['none', 'none', 'none', 'flex'], width: '125px' }} />}\n        <BonusContainer\n          trueBondPrices={trueBondPrices}\n          minTier={minTier}\n          bonus={bonus}\n          airdropTooltip={airdropTooltip}\n        />\n\n        <div className=\"terms-column\">\n          {vestingTermString}\n          {vestingCliffString && (\n            <TooltipBubble\n              className=\"tooltip-bubble\"\n              body={<Flex>{vestingCliffString}</Flex>}\n              width=\"180px\"\n              placement=\"bottomRight\"\n              transformTip=\"translate(13%, 0%)\"\n            >\n              <Flex sx={{ opacity: 0.6, ml: '6px' }}>\n                <Svg icon=\"questionCircle\" width=\"12px\" />\n              </Flex>\n            </TooltipBubble>\n          )}\n        </div>\n        <div className=\"tokens-remaining-column\">\n          {bondSoldOut ? (\n            '-'\n          ) : (\n            <ProgressBarWrapper\n              title={''}\n              value={<ProgressBar value={percentageAvailable} />}\n              style={{\n                width: '127px',\n                height: '25px',\n                flexDirection: 'column',\n                justifyContent: 'center',\n                display: ['none', 'none', 'none', 'flex'],\n              }}\n              showTooltip={true}\n              toolTip={remainingTokensString}\n            />\n          )}\n        </div>\n        <div className=\"tooltip-column\">\n          {soldoutBondsCount ? (\n            <Flex sx={{ gap: '5px', fontSize: '13px', fontWeight: 500, opacity: 0.5 }}>\n              ({soldoutBondsCount})\n              <Svg icon=\"caret\" direction={isOpen ? 'up' : 'down'} width=\"8px\" />\n            </Flex>\n          ) : (\n            <TooltipBubble\n              className=\"tooltip-bubble\"\n              body={\n                <Tooltip\n                  earnTokenContract={payoutToken?.address?.[bondChain] ?? ''}\n                  earnTokenSymbol={payoutToken?.symbol ?? ''}\n                  bondContract={bondAddress ?? ''}\n                  projectLink={projectURL}\n                  twitter={twitterURL}\n                  chain={bondChain}\n                  isSoldOut={bondSoldOut}\n                  billType={billType}\n                  cgId={cgId}\n                  dexscreener={dexscreener}\n                />\n              }\n              width=\"205px\"\n              placement=\"bottomRight\"\n              transformTip=\"translate(7%, -2%)\"\n            >\n              <Flex className=\"more-icon\" sx={{ opacity: 0.8 }}>\n                <Svg icon=\"more\" width=\"25px\" />\n              </Flex>\n            </TooltipBubble>\n          )}\n        </div>\n      </div>\n    </div>\n  )\n}\n\nexport default BondRow\n"],"names":["_jsx","_jsxs","Tooltip"],"mappings":"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"}
+{"version":3,"file":"BondRow.js","sources":["../../../../../src/views/Bonds/components/BondRows/BondRow.tsx"],"sourcesContent":["import React from 'react'\nimport { TrueBondPrices } from '../../../../types/bonds'\nimport ProgressBar from '../../../../components/ProgressBar/ProgressBar'\nimport ProgressBarWrapper from '../../../../components/ProgressBar/ProgressBarWrapper'\nimport TokenInfoAndName from '../../../../components/TokenInfoAndName'\nimport Tooltip from '../../../../components/Tooltip/Tooltip'\nimport { ChainId, LaunchBondTiers, MarketingCampaign, Token } from '@ape.swap/apeswap-lists'\nimport useModal from '../../../../hooks/useModal'\nimport ModalHandler from './ModalHandler'\nimport track from '../../../../utils/track'\nimport BonusContainer from '../BonusComponents/BonusContainer'\nimport ModalHandlerPreTGE from './ModalHandlerPreTGE'\nimport { useSDKConfig } from '../../../../state/useSDKConfig'\nimport SafeHTMLComponent from '../../../../components/SafeHTMLComponent'\nimport { MCBondRowStyles } from '../../../../utils/campaignStyles'\nimport Flex from '../../../../components/uikit-sdk/Flex'\nimport TooltipBubble from '../../../../components/uikit-sdk/TooltipBubble'\nimport QuestionCircle from '../../../../components/uikit-sdk/Svg/Icons/QuestionCircle'\nimport Caret from '../../../../components/uikit-sdk/Svg/Icons/Caret'\nimport More from '../../../../components/uikit-sdk/Svg/Icons/More'\n\ninterface BondRowProps {\n  bondAddress: string\n  bondChain: ChainId\n  marketingCampaign?: MarketingCampaign\n  payoutToken: Token\n  billType: string\n  tag?: string\n  bondSoldOut?: boolean\n  trueBondPrices?: TrueBondPrices[]\n  minTier?: LaunchBondTiers\n  bonus?: string\n  airdropTooltip?: string\n  vestingTermString: string\n  vestingCliffString?: string\n  percentageAvailable: number\n  remainingTokensString: string\n  projectURL?: string\n  twitterURL?: string\n  shortDescription?: string\n  soldoutBondsCount?: number\n  isOpen?: boolean\n  cgId?: string\n  dexscreener?: string\n}\n\nconst BondRow: React.FC<BondRowProps> = ({\n  bondAddress,\n  bondChain,\n  marketingCampaign,\n  payoutToken,\n  billType,\n  tag,\n  bondSoldOut,\n  trueBondPrices,\n  minTier,\n  bonus,\n  airdropTooltip,\n  vestingTermString,\n  vestingCliffString,\n  percentageAvailable,\n  remainingTokensString,\n  projectURL,\n  twitterURL,\n  shortDescription,\n  soldoutBondsCount,\n  isOpen,\n  cgId,\n  dexscreener,\n}) => {\n  const SDKConfig = useSDKConfig()\n\n  // Modal\n  const [openBuyModal] = useModal(\n    <ModalHandler bondAddress={bondAddress} bondChain={bondChain} />,\n    true,\n    true,\n    `buyBondModal-${bondAddress.toLowerCase()}-${bondChain}`,\n  )\n\n  const [openPreTGEBondModal] = useModal(\n    <ModalHandlerPreTGE bondAddress={bondAddress} bondChain={bondChain} />,\n    true,\n    true,\n    `preTGEBuyBondModal:${bondAddress.toLowerCase()}-${bondChain}}`,\n  )\n\n  const handleOpenModal = () => {\n    if (bondSoldOut) return\n    if (billType === 'fcfs') {\n      openPreTGEBondModal()\n    } else {\n      openBuyModal()\n    }\n    if (typeof window !== 'undefined') {\n      const locationPath = window.location.pathname.replace('/', '')\n      window.history.pushState({}, '', `${locationPath}?bondAddress=${bondAddress}&bondChain=${bondChain}`)\n    }\n    track({\n      event: 'buyModalOpen',\n      chain: bondChain,\n      data: {\n        cat: 'Row',\n        bond: payoutToken.symbol,\n        bondChain: bondChain,\n      },\n    })\n  }\n\n  return (\n    <div\n      className=\"bond-row\"\n      onClick={handleOpenModal}\n      key={`${bondAddress}-${bondChain}`}\n      sx={{\n        borderRadius: 'normal',\n        // Insert special campaign styles here\n        ...MCBondRowStyles[marketingCampaign!],\n        cursor: !bondSoldOut || (soldoutBondsCount && !isOpen) ? 'pointer' : 'default',\n        '&:hover .list-tag': {\n          background: 'rgb(20 18 29 / 0.25)',\n        },\n      }}\n    >\n      <div\n        className=\"token-info-container\"\n        sx={{ width: ['45%', '45%', '45%', '30%'], minWidth: ['unset', 'unset', 'unset', '400px'] }}\n      >\n        <TokenInfoAndName\n          tokenSymbol={payoutToken?.symbol}\n          chain={bondChain}\n          tag={tag}\n          marketingCampaign={marketingCampaign}\n        />\n      </div>\n      {SDKConfig.useCardsView && shortDescription && (\n        <div className=\"short-description\">\n          <SafeHTMLComponent html={shortDescription} />\n        </div>\n      )}\n      <div className=\"bond-info-columns\" sx={{ width: ['55%', '55%', '55%', '70%'] }}>\n        {!SDKConfig.useCardsView && <Flex sx={{ display: ['none', 'none', 'none', 'flex'], width: '125px' }} />}\n        <BonusContainer\n          trueBondPrices={trueBondPrices}\n          minTier={minTier}\n          bonus={bonus}\n          airdropTooltip={airdropTooltip}\n        />\n\n        <div className=\"terms-column\">\n          {vestingTermString}\n          {vestingCliffString && (\n            <TooltipBubble\n              className=\"tooltip-bubble\"\n              body={<Flex>{vestingCliffString}</Flex>}\n              width=\"180px\"\n              placement=\"bottomRight\"\n              transformTip=\"translate(13%, 0%)\"\n            >\n              <Flex sx={{ opacity: 0.6, ml: '6px' }}>\n                <QuestionCircle width=\"12px\" />\n              </Flex>\n            </TooltipBubble>\n          )}\n        </div>\n        <div className=\"tokens-remaining-column\">\n          {bondSoldOut ? (\n            '-'\n          ) : (\n            <ProgressBarWrapper\n              title={''}\n              value={<ProgressBar value={percentageAvailable} />}\n              style={{\n                width: '127px',\n                height: '25px',\n                flexDirection: 'column',\n                justifyContent: 'center',\n                display: ['none', 'none', 'none', 'flex'],\n              }}\n              showTooltip={true}\n              toolTip={remainingTokensString}\n            />\n          )}\n        </div>\n        <div className=\"tooltip-column\">\n          {soldoutBondsCount ? (\n            <Flex sx={{ gap: '5px', fontSize: '13px', fontWeight: 500, opacity: 0.5 }}>\n              ({soldoutBondsCount})\n              <Caret direction={isOpen ? 'up' : 'down'} width=\"8px\" />\n            </Flex>\n          ) : (\n            <TooltipBubble\n              className=\"tooltip-bubble\"\n              body={\n                <Tooltip\n                  earnTokenContract={payoutToken?.address?.[bondChain] ?? ''}\n                  earnTokenSymbol={payoutToken?.symbol ?? ''}\n                  bondContract={bondAddress ?? ''}\n                  projectLink={projectURL}\n                  twitter={twitterURL}\n                  chain={bondChain}\n                  isSoldOut={bondSoldOut}\n                  billType={billType}\n                  cgId={cgId}\n                  dexscreener={dexscreener}\n                />\n              }\n              width=\"205px\"\n              placement=\"bottomRight\"\n              transformTip=\"translate(7%, -2%)\"\n            >\n              <Flex className=\"more-icon\" sx={{ opacity: 0.8 }}>\n                <More width=\"25px\" />\n              </Flex>\n            </TooltipBubble>\n          )}\n        </div>\n      </div>\n    </div>\n  )\n}\n\nexport default BondRow\n"],"names":["_jsx","_jsxs","Tooltip"],"mappings":";;;;;;;;;;;;;;;;;;;AA8CA,MAAM,OAAO,GAA2B,CAAC,EACvC,WAAW,EACX,SAAS,EACT,iBAAiB,EACjB,WAAW,EACX,QAAQ,EACR,GAAG,EACH,WAAW,EACX,cAAc,EACd,OAAO,EACP,KAAK,EACL,cAAc,EACd,iBAAiB,EACjB,kBAAkB,EAClB,mBAAmB,EACnB,qBAAqB,EACrB,UAAU,EACV,UAAU,EACV,gBAAgB,EAChB,iBAAiB,EACjB,MAAM,EACN,IAAI,EACJ,WAAW,GACZ,KAAI;AACH,IAAA,MAAM,SAAS,GAAG,YAAY,EAAE;;AAGhC,IAAA,MAAM,CAAC,YAAY,CAAC,GAAG,QAAQ,CAC7BA,GAAA,CAAC,YAAY,EAAA,EAAC,WAAW,EAAE,WAAW,EAAE,SAAS,EAAE,SAAS,EAAA,CAAI,EAChE,IAAI,EACJ,IAAI,EACJ,CAAA,aAAA,EAAgB,WAAW,CAAC,WAAW,EAAE,CAAA,CAAA,EAAI,SAAS,CAAA,CAAE,CACzD;AAED,IAAA,MAAM,CAAC,mBAAmB,CAAC,GAAG,QAAQ,CACpCA,GAAA,CAAC,kBAAkB,EAAA,EAAC,WAAW,EAAE,WAAW,EAAE,SAAS,EAAE,SAAS,EAAA,CAAI,EACtE,IAAI,EACJ,IAAI,EACJ,CAAA,mBAAA,EAAsB,WAAW,CAAC,WAAW,EAAE,CAAA,CAAA,EAAI,SAAS,CAAA,CAAA,CAAG,CAChE;IAED,MAAM,eAAe,GAAG,MAAK;AAC3B,QAAA,IAAI,WAAW;YAAE;AACjB,QAAA,IAAI,QAAQ,KAAK,MAAM,EAAE;AACvB,YAAA,mBAAmB,EAAE;QACvB;aAAO;AACL,YAAA,YAAY,EAAE;QAChB;AACA,QAAA,IAAI,OAAO,MAAM,KAAK,WAAW,EAAE;AACjC,YAAA,MAAM,YAAY,GAAG,MAAM,CAAC,QAAQ,CAAC,QAAQ,CAAC,OAAO,CAAC,GAAG,EAAE,EAAE,CAAC;AAC9D,YAAA,MAAM,CAAC,OAAO,CAAC,SAAS,CAAC,EAAE,EAAE,EAAE,EAAE,CAAA,EAAG,YAAY,CAAA,aAAA,EAAgB,WAAW,cAAc,SAAS,CAAA,CAAE,CAAC;QACvG;AACA,QAAA,KAAK,CAAC;AACJ,YAAA,KAAK,EAAE,cAAc;AACrB,YAAA,KAAK,EAAE,SAAS;AAChB,YAAA,IAAI,EAAE;AACJ,gBAAA,GAAG,EAAE,KAAK;gBACV,IAAI,EAAE,WAAW,CAAC,MAAM;AACxB,gBAAA,SAAS,EAAE,SAAS;AACrB,aAAA;AACF,SAAA,CAAC;AACJ,IAAA,CAAC;IAED,QACEC,IAAA,CAAA,KAAA,EAAA,EACE,SAAS,EAAC,UAAU,EACpB,OAAO,EAAE,eAAe,EAExB,EAAE,EAAE;AACF,YAAA,YAAY,EAAE,QAAQ;;YAEtB,GAAG,eAAe,CAAC,iBAAkB,CAAC;AACtC,YAAA,MAAM,EAAE,CAAC,WAAW,KAAK,iBAAiB,IAAI,CAAC,MAAM,CAAC,GAAG,SAAS,GAAG,SAAS;AAC9E,YAAA,mBAAmB,EAAE;AACnB,gBAAA,UAAU,EAAE,sBAAsB;AACnC,aAAA;SACF,EAAA,QAAA,EAAA,CAEDD,GAAA,CAAA,KAAA,EAAA,EACE,SAAS,EAAC,sBAAsB,EAChC,EAAE,EAAE,EAAE,KAAK,EAAE,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,CAAC,EAAE,QAAQ,EAAE,CAAC,OAAO,EAAE,OAAO,EAAE,OAAO,EAAE,OAAO,CAAC,EAAE,EAAA,QAAA,EAE3FA,GAAA,CAAC,gBAAgB,EAAA,EACf,WAAW,EAAE,WAAW,EAAE,MAAM,EAChC,KAAK,EAAE,SAAS,EAChB,GAAG,EAAE,GAAG,EACR,iBAAiB,EAAE,iBAAiB,EAAA,CACpC,EAAA,CACE,EACL,SAAS,CAAC,YAAY,IAAI,gBAAgB,KACzCA,GAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,mBAAmB,EAAA,QAAA,EAChCA,GAAA,CAAC,iBAAiB,EAAA,EAAC,IAAI,EAAE,gBAAgB,EAAA,CAAI,EAAA,CACzC,CACP,EACDC,IAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,mBAAmB,EAAC,EAAE,EAAE,EAAE,KAAK,EAAE,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,CAAC,EAAE,EAAA,QAAA,EAAA,CAC3E,CAAC,SAAS,CAAC,YAAY,IAAID,GAAA,CAAC,IAAI,EAAA,EAAC,EAAE,EAAE,EAAE,OAAO,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,EAAA,CAAI,EACvGA,GAAA,CAAC,cAAc,EAAA,EACb,cAAc,EAAE,cAAc,EAC9B,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,KAAK,EACZ,cAAc,EAAE,cAAc,EAAA,CAC9B,EAEFC,IAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,cAAc,EAAA,QAAA,EAAA,CAC1B,iBAAiB,EACjB,kBAAkB,KACjBD,GAAA,CAAC,aAAa,EAAA,EACZ,SAAS,EAAC,gBAAgB,EAC1B,IAAI,EAAEA,GAAA,CAAC,IAAI,EAAA,EAAA,QAAA,EAAE,kBAAkB,EAAA,CAAQ,EACvC,KAAK,EAAC,OAAO,EACb,SAAS,EAAC,aAAa,EACvB,YAAY,EAAC,oBAAoB,EAAA,QAAA,EAEjCA,IAAC,IAAI,EAAA,EAAC,EAAE,EAAE,EAAE,OAAO,EAAE,GAAG,EAAE,EAAE,EAAE,KAAK,EAAE,EAAA,QAAA,EACnCA,GAAA,CAAC,cAAc,EAAA,EAAC,KAAK,EAAC,MAAM,EAAA,CAAG,EAAA,CAC1B,EAAA,CACO,CACjB,CAAA,EAAA,CACG,EACNA,GAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,yBAAyB,EAAA,QAAA,EACrC,WAAW,IACV,GAAG,KAEHA,GAAA,CAAC,kBAAkB,EAAA,EACjB,KAAK,EAAE,EAAE,EACT,KAAK,EAAEA,GAAA,CAAC,WAAW,EAAA,EAAC,KAAK,EAAE,mBAAmB,EAAA,CAAI,EAClD,KAAK,EAAE;AACL,gCAAA,KAAK,EAAE,OAAO;AACd,gCAAA,MAAM,EAAE,MAAM;AACd,gCAAA,aAAa,EAAE,QAAQ;AACvB,gCAAA,cAAc,EAAE,QAAQ;gCACxB,OAAO,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC;AAC1C,6BAAA,EACD,WAAW,EAAE,IAAI,EACjB,OAAO,EAAE,qBAAqB,EAAA,CAC9B,CACH,GACG,EACNA,GAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,gBAAgB,YAC5B,iBAAiB,IAChBC,KAAC,IAAI,EAAA,EAAC,EAAE,EAAE,EAAE,GAAG,EAAE,KAAK,EAAE,QAAQ,EAAE,MAAM,EAAE,UAAU,EAAE,GAAG,EAAE,OAAO,EAAE,GAAG,EAAE,EAAA,QAAA,EAAA,CAAA,GAAA,EACrE,iBAAiB,EAAA,GAAA,EACnBD,GAAA,CAAC,KAAK,EAAA,EAAC,SAAS,EAAE,MAAM,GAAG,IAAI,GAAG,MAAM,EAAE,KAAK,EAAC,KAAK,EAAA,CAAG,IACnD,KAEPA,IAAC,aAAa,EAAA,EACZ,SAAS,EAAC,gBAAgB,EAC1B,IAAI,EACFA,IAACE,eAAO,EAAA,EACN,iBAAiB,EAAE,WAAW,EAAE,OAAO,GAAG,SAAS,CAAC,IAAI,EAAE,EAC1D,eAAe,EAAE,WAAW,EAAE,MAAM,IAAI,EAAE,EAC1C,YAAY,EAAE,WAAW,IAAI,EAAE,EAC/B,WAAW,EAAE,UAAU,EACvB,OAAO,EAAE,UAAU,EACnB,KAAK,EAAE,SAAS,EAChB,SAAS,EAAE,WAAW,EACtB,QAAQ,EAAE,QAAQ,EAClB,IAAI,EAAE,IAAI,EACV,WAAW,EAAE,WAAW,GACxB,EAEJ,KAAK,EAAC,OAAO,EACb,SAAS,EAAC,aAAa,EACvB,YAAY,EAAC,oBAAoB,EAAA,QAAA,EAEjCF,GAAA,CAAC,IAAI,EAAA,EAAC,SAAS,EAAC,WAAW,EAAC,EAAE,EAAE,EAAE,OAAO,EAAE,GAAG,EAAE,EAAA,QAAA,EAC9CA,GAAA,CAAC,IAAI,EAAA,EAAC,KAAK,EAAC,MAAM,EAAA,CAAG,GAChB,EAAA,CACO,CACjB,GACG,CAAA,EAAA,CACF,CAAA,EAAA,EAxGD,GAAG,WAAW,CAAA,CAAA,EAAI,SAAS,CAAA,CAAE,CAyG9B;AAEV;;;;"}

package/dist/views/Bonds/components/BondRows/ChainTitle.js

@@ -3,8 +3,9 @@ import { NETWORK_LABEL } from '../../../../config/constants/chains.js';
 import { useIsMobile } from '../../../../hooks/useIsMobile.js';
 import Flex from '../../../../components/uikit-sdk/Flex/index.js';
 import Text from '../../../../components/uikit-sdk/Text/index.js';
-import Svg from '../../../../components/uikit-sdk/Svg/index.js';
 import TooltipBubble from '../../../../components/uikit-sdk/TooltipBubble/index.js';
+import Caret from '../../../../components/uikit-sdk/Svg/Icons/Caret.js';
+import QuestionCircle from '../../../../components/uikit-sdk/Svg/Icons/QuestionCircle.js';
 
 const ChainTitle = ({ chain, pt, hideTitles, isOpen, }) => {
     const isMobile = useIsMobile();
@@ -19,7 +20,7 @@ const ChainTitle = ({ chain, pt, hideTitles, isOpen, }) => {
             display: hideTitles ? 'none' : 'flex',
             width: '300px',
             alignItems: 'center',
-        }, children: [NETWORK_LABEL[chain], " Bonds", jsx(Flex, { sx: { ml: '7px' }, children: jsx(Svg, { icon: "caret", direction: isOpen ? 'down' : 'up', width: 8, color: "textDisabledButton" }) }), NETWORK_LABEL[chain]?.toLowerCase().includes('testnet') && (jsxs(Flex, { sx: { ml: '15px' }, children: [jsx(Text, { sx: { fontSize: '12px', color: '#DE62F3', fontWeight: 700, mr: '7px' }, children: "TESTNET" }), jsx(TooltipBubble, { className: "tooltip-bubble", body: jsx(Text, { sx: { textTransform: 'none' }, children: "Testnet Bonds let you experiment with fake tokens for free on upcoming chains still in development." }), width: isMobile ? '272px' : '280px', placement: isMobile ? 'bottomRight' : 'bottomLeft', transformTip: isMobile ? 'translate(10%, -5%)' : 'translate(-5%, -5%)', children: jsx(Svg, { icon: "questionCircle", width: 14, color: "textDisabledButton" }) })] }))] }));
+        }, children: [NETWORK_LABEL[chain], " Bonds", jsx(Flex, { sx: { ml: '7px' }, children: jsx(Caret, { direction: isOpen ? 'down' : 'up', width: 8, color: "textDisabledButton" }) }), NETWORK_LABEL[chain]?.toLowerCase().includes('testnet') && (jsxs(Flex, { sx: { ml: '15px' }, children: [jsx(Text, { sx: { fontSize: '12px', color: '#DE62F3', fontWeight: 700, mr: '7px' }, children: "TESTNET" }), jsx(TooltipBubble, { className: "tooltip-bubble", body: jsx(Text, { sx: { textTransform: 'none' }, children: "Testnet Bonds let you experiment with fake tokens for free on upcoming chains still in development." }), width: isMobile ? '272px' : '280px', placement: isMobile ? 'bottomRight' : 'bottomLeft', transformTip: isMobile ? 'translate(10%, -5%)' : 'translate(-5%, -5%)', children: jsx(QuestionCircle, { width: 14, color: "textDisabledButton" }) })] }))] }));
 };
 
 export { ChainTitle as default };

package/dist/views/Bonds/components/BondRows/ChainTitle.js.map

@@ -1 +1 @@
-{"version":3,"file":"ChainTitle.js","sources":["../../../../../src/views/Bonds/components/BondRows/ChainTitle.tsx"],"sourcesContent":["import React from 'react'\nimport { NETWORK_LABEL } from '../../../../config/constants/chains'\nimport { useIsMobile } from '../../../../hooks/useIsMobile'\nimport Flex from '../../../../components/uikit-sdk/Flex'\nimport Text from '../../../../components/uikit-sdk/Text'\nimport Svg from '../../../../components/uikit-sdk/Svg'\nimport TooltipBubble from '../../../../components/uikit-sdk/TooltipBubble'\n\nconst ChainTitle = ({\n  chain,\n  pt,\n  hideTitles,\n  isOpen,\n}: {\n  chain: number\n  pt: string\n  hideTitles?: boolean\n  isOpen: boolean\n}) => {\n  const isMobile = useIsMobile()\n  return (\n    <Flex\n      id={`${NETWORK_LABEL[chain].toLowerCase().replace(/\\s+/g, '')}`}\n      className=\"chaintitle\"\n      sx={{\n        pt,\n        pb: '10px',\n        color: 'textDisabledButton',\n        fontSize: '13px',\n        fontWeight: 500,\n        cursor: 'pointer',\n        textTransform: 'uppercase',\n        display: hideTitles ? 'none' : 'flex',\n        width: '300px',\n        alignItems: 'center',\n      }}\n    >\n      {NETWORK_LABEL[chain]} Bonds\n      <Flex sx={{ ml: '7px' }}>\n        <Svg icon=\"caret\" direction={isOpen ? 'down' : 'up'} width={8} color=\"textDisabledButton\" />\n      </Flex>\n      {NETWORK_LABEL[chain]?.toLowerCase().includes('testnet') && (\n        <Flex sx={{ ml: '15px' }}>\n          <Text sx={{ fontSize: '12px', color: '#DE62F3', fontWeight: 700, mr: '7px' }}>TESTNET</Text>\n          <TooltipBubble\n            className=\"tooltip-bubble\"\n            body={\n              <Text sx={{ textTransform: 'none' }}>\n                Testnet Bonds let you experiment with fake tokens for free on upcoming chains still in development.\n              </Text>\n            }\n            width={isMobile ? '272px' : '280px'}\n            placement={isMobile ? 'bottomRight' : 'bottomLeft'}\n            transformTip={isMobile ? 'translate(10%, -5%)' : 'translate(-5%, -5%)'}\n          >\n            <Svg icon=\"questionCircle\" width={14} color=\"textDisabledButton\" />\n          </TooltipBubble>\n        </Flex>\n      )}\n    </Flex>\n  )\n}\n\nexport default ChainTitle\n"],"names":["_jsxs","_jsx"],"mappings":";;;;;;;;AAQA,MAAM,UAAU,GAAG,CAAC,EAClB,KAAK,EACL,EAAE,EACF,UAAU,EACV,MAAM,GAMP,KAAI;AACH,IAAA,MAAM,QAAQ,GAAG,WAAW,EAAE;AAC9B,IAAA,QACEA,IAAA,CAAC,IAAI,EAAA,EACH,EAAE,EAAE,CAAA,EAAG,aAAa,CAAC,KAAK,CAAC,CAAC,WAAW,EAAE,CAAC,OAAO,CAAC,MAAM,EAAE,EAAE,CAAC,CAAA,CAAE,EAC/D,SAAS,EAAC,YAAY,EACtB,EAAE,EAAE;YACF,EAAE;AACF,YAAA,EAAE,EAAE,MAAM;AACV,YAAA,KAAK,EAAE,oBAAoB;AAC3B,YAAA,QAAQ,EAAE,MAAM;AAChB,YAAA,UAAU,EAAE,GAAG;AACf,YAAA,MAAM,EAAE,SAAS;AACjB,YAAA,aAAa,EAAE,WAAW;YAC1B,OAAO,EAAE,UAAU,GAAG,MAAM,GAAG,MAAM;AACrC,YAAA,KAAK,EAAE,OAAO;AACd,YAAA,UAAU,EAAE,QAAQ;AACrB,SAAA,EAAA,QAAA,EAAA,CAEA,aAAa,CAAC,KAAK,CAAC,EAAA,QAAA,EACrBC,IAAC,IAAI,EAAA,EAAC,EAAE,EAAE,EAAE,EAAE,EAAE,KAAK,EAAE,EAAA,QAAA,EACrBA,IAAC,GAAG,EAAA,EAAC,IAAI,EAAC,OAAO,EAAC,SAAS,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI,EAAE,KAAK,EAAE,CAAC,EAAE,KAAK,EAAC,oBAAoB,EAAA,CAAG,GACvF,EACN,aAAa,CAAC,KAAK,CAAC,EAAE,WAAW,EAAE,CAAC,QAAQ,CAAC,SAAS,CAAC,KACtDD,IAAA,CAAC,IAAI,EAAA,EAAC,EAAE,EAAE,EAAE,EAAE,EAAE,MAAM,EAAE,EAAA,QAAA,EAAA,CACtBC,GAAA,CAAC,IAAI,EAAA,EAAC,EAAE,EAAE,EAAE,QAAQ,EAAE,MAAM,EAAE,KAAK,EAAE,SAAS,EAAE,UAAU,EAAE,GAAG,EAAE,EAAE,EAAE,KAAK,EAAE,EAAA,QAAA,EAAA,SAAA,EAAA,CAAgB,EAC5FA,GAAA,CAAC,aAAa,EAAA,EACZ,SAAS,EAAC,gBAAgB,EAC1B,IAAI,EACFA,GAAA,CAAC,IAAI,EAAA,EAAC,EAAE,EAAE,EAAE,aAAa,EAAE,MAAM,EAAE,EAAA,QAAA,EAAA,qGAAA,EAAA,CAE5B,EAET,KAAK,EAAE,QAAQ,GAAG,OAAO,GAAG,OAAO,EACnC,SAAS,EAAE,QAAQ,GAAG,aAAa,GAAG,YAAY,EAClD,YAAY,EAAE,QAAQ,GAAG,qBAAqB,GAAG,qBAAqB,EAAA,QAAA,EAEtEA,GAAA,CAAC,GAAG,IAAC,IAAI,EAAC,gBAAgB,EAAC,KAAK,EAAE,EAAE,EAAE,KAAK,EAAC,oBAAoB,EAAA,CAAG,EAAA,CACrD,IACX,CACR,CAAA,EAAA,CACI;AAEX;;;;"}
+{"version":3,"file":"ChainTitle.js","sources":["../../../../../src/views/Bonds/components/BondRows/ChainTitle.tsx"],"sourcesContent":["import React from 'react'\nimport { NETWORK_LABEL } from '../../../../config/constants/chains'\nimport { useIsMobile } from '../../../../hooks/useIsMobile'\nimport Flex from '../../../../components/uikit-sdk/Flex'\nimport Text from '../../../../components/uikit-sdk/Text'\nimport TooltipBubble from '../../../../components/uikit-sdk/TooltipBubble'\nimport Caret from '../../../../components/uikit-sdk/Svg/Icons/Caret'\nimport QuestionCircle from '../../../../components/uikit-sdk/Svg/Icons/QuestionCircle'\n\nconst ChainTitle = ({\n  chain,\n  pt,\n  hideTitles,\n  isOpen,\n}: {\n  chain: number\n  pt: string\n  hideTitles?: boolean\n  isOpen: boolean\n}) => {\n  const isMobile = useIsMobile()\n  return (\n    <Flex\n      id={`${NETWORK_LABEL[chain].toLowerCase().replace(/\\s+/g, '')}`}\n      className=\"chaintitle\"\n      sx={{\n        pt,\n        pb: '10px',\n        color: 'textDisabledButton',\n        fontSize: '13px',\n        fontWeight: 500,\n        cursor: 'pointer',\n        textTransform: 'uppercase',\n        display: hideTitles ? 'none' : 'flex',\n        width: '300px',\n        alignItems: 'center',\n      }}\n    >\n      {NETWORK_LABEL[chain]} Bonds\n      <Flex sx={{ ml: '7px' }}>\n        <Caret direction={isOpen ? 'down' : 'up'} width={8} color=\"textDisabledButton\" />\n      </Flex>\n      {NETWORK_LABEL[chain]?.toLowerCase().includes('testnet') && (\n        <Flex sx={{ ml: '15px' }}>\n          <Text sx={{ fontSize: '12px', color: '#DE62F3', fontWeight: 700, mr: '7px' }}>TESTNET</Text>\n          <TooltipBubble\n            className=\"tooltip-bubble\"\n            body={\n              <Text sx={{ textTransform: 'none' }}>\n                Testnet Bonds let you experiment with fake tokens for free on upcoming chains still in development.\n              </Text>\n            }\n            width={isMobile ? '272px' : '280px'}\n            placement={isMobile ? 'bottomRight' : 'bottomLeft'}\n            transformTip={isMobile ? 'translate(10%, -5%)' : 'translate(-5%, -5%)'}\n          >\n            <QuestionCircle width={14} color=\"textDisabledButton\" />\n          </TooltipBubble>\n        </Flex>\n      )}\n    </Flex>\n  )\n}\n\nexport default ChainTitle\n"],"names":["_jsxs","_jsx"],"mappings":";;;;;;;;;AASA,MAAM,UAAU,GAAG,CAAC,EAClB,KAAK,EACL,EAAE,EACF,UAAU,EACV,MAAM,GAMP,KAAI;AACH,IAAA,MAAM,QAAQ,GAAG,WAAW,EAAE;AAC9B,IAAA,QACEA,IAAA,CAAC,IAAI,EAAA,EACH,EAAE,EAAE,CAAA,EAAG,aAAa,CAAC,KAAK,CAAC,CAAC,WAAW,EAAE,CAAC,OAAO,CAAC,MAAM,EAAE,EAAE,CAAC,CAAA,CAAE,EAC/D,SAAS,EAAC,YAAY,EACtB,EAAE,EAAE;YACF,EAAE;AACF,YAAA,EAAE,EAAE,MAAM;AACV,YAAA,KAAK,EAAE,oBAAoB;AAC3B,YAAA,QAAQ,EAAE,MAAM;AAChB,YAAA,UAAU,EAAE,GAAG;AACf,YAAA,MAAM,EAAE,SAAS;AACjB,YAAA,aAAa,EAAE,WAAW;YAC1B,OAAO,EAAE,UAAU,GAAG,MAAM,GAAG,MAAM;AACrC,YAAA,KAAK,EAAE,OAAO;AACd,YAAA,UAAU,EAAE,QAAQ;AACrB,SAAA,EAAA,QAAA,EAAA,CAEA,aAAa,CAAC,KAAK,CAAC,EAAA,QAAA,EACrBC,IAAC,IAAI,EAAA,EAAC,EAAE,EAAE,EAAE,EAAE,EAAE,KAAK,EAAE,YACrBA,GAAA,CAAC,KAAK,EAAA,EAAC,SAAS,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI,EAAE,KAAK,EAAE,CAAC,EAAE,KAAK,EAAC,oBAAoB,EAAA,CAAG,EAAA,CAC5E,EACN,aAAa,CAAC,KAAK,CAAC,EAAE,WAAW,EAAE,CAAC,QAAQ,CAAC,SAAS,CAAC,KACtDD,IAAA,CAAC,IAAI,IAAC,EAAE,EAAE,EAAE,EAAE,EAAE,MAAM,EAAE,EAAA,QAAA,EAAA,CACtBC,GAAA,CAAC,IAAI,EAAA,EAAC,EAAE,EAAE,EAAE,QAAQ,EAAE,MAAM,EAAE,KAAK,EAAE,SAAS,EAAE,UAAU,EAAE,GAAG,EAAE,EAAE,EAAE,KAAK,EAAE,wBAAgB,EAC5FA,GAAA,CAAC,aAAa,EAAA,EACZ,SAAS,EAAC,gBAAgB,EAC1B,IAAI,EACFA,IAAC,IAAI,EAAA,EAAC,EAAE,EAAE,EAAE,aAAa,EAAE,MAAM,EAAE,oHAE5B,EAET,KAAK,EAAE,QAAQ,GAAG,OAAO,GAAG,OAAO,EACnC,SAAS,EAAE,QAAQ,GAAG,aAAa,GAAG,YAAY,EAClD,YAAY,EAAE,QAAQ,GAAG,qBAAqB,GAAG,qBAAqB,YAEtEA,GAAA,CAAC,cAAc,EAAA,EAAC,KAAK,EAAE,EAAE,EAAE,KAAK,EAAC,oBAAoB,EAAA,CAAG,EAAA,CAC1C,IACX,CACR,CAAA,EAAA,CACI;AAEX;;;;"}

package/dist/views/Bonds/components/BondRows/SoldOutRows.js

@@ -4,7 +4,7 @@ import { AnimatePresence, motion } from 'framer-motion';
 import BondRow from './BondRow.js';
 import { formatNumberSI } from '../../../../utils/formatNumber.js';
 import Flex from '../../../../components/uikit-sdk/Flex/index.js';
-import Svg from '../../../../components/uikit-sdk/Svg/index.js';
+import TurnArrow from '../../../../components/uikit-sdk/Svg/Icons/TurnArrow.js';
 
 const SoldOutRows = ({ bonds }) => {
     const bond = bonds[0];
@@ -21,7 +21,7 @@ const SoldOutRows = ({ bonds }) => {
                             overflow: 'hidden',
                             width: '100%',
                             marginTop: '0px',
-                        }, className: "bonds-card-container", children: jsxs(Flex, { sx: { cursor: 'pointer' }, onClick: () => setIsOpen(!isOpen), children: [jsx(Flex, { sx: { alignItems: 'center', pb: '10px' }, children: jsx(Svg, { icon: "turnArrow", direction: 'up' }) }), jsx(BondRow, { bondAddress: bond.contractAddress?.[bond.chainId], marketingCampaign: bond.marketingCampaign, bondChain: bond.chainId, payoutToken: bond.earnToken, billType: bond.billType, tag: bond.tags?.[0], bondSoldOut: true, percentageAvailable: 100, remainingTokensString: `${formatNumberSI(0, 0)} ${bond.earnToken.symbol} ($${formatNumberSI(0, 2)})`, vestingTermString: "-", projectURL: bond.projectLink, twitterURL: bond.twitter, shortDescription: bond.shortDescription })] }) }, `${bond.contractAddress[bond.chainId]}-${bond.chainId}`));
+                        }, className: "bonds-card-container", children: jsxs(Flex, { sx: { cursor: 'pointer' }, onClick: () => setIsOpen(!isOpen), children: [jsx(Flex, { sx: { alignItems: 'center', pb: '10px' }, children: jsx(TurnArrow, { direction: 'up' }) }), jsx(BondRow, { bondAddress: bond.contractAddress?.[bond.chainId], marketingCampaign: bond.marketingCampaign, bondChain: bond.chainId, payoutToken: bond.earnToken, billType: bond.billType, tag: bond.tags?.[0], bondSoldOut: true, percentageAvailable: 100, remainingTokensString: `${formatNumberSI(0, 0)} ${bond.earnToken.symbol} ($${formatNumberSI(0, 2)})`, vestingTermString: "-", projectURL: bond.projectLink, twitterURL: bond.twitter, shortDescription: bond.shortDescription })] }) }, `${bond.contractAddress[bond.chainId]}-${bond.chainId}`));
                 })] }));
 };
 

package/dist/views/Bonds/components/BondRows/SoldOutRows.js.map

@@ -1 +1 @@
-{"version":3,"file":"SoldOutRows.js","sources":["../../../../../src/views/Bonds/components/BondRows/SoldOutRows.tsx"],"sourcesContent":["import React, { useState } from 'react'\nimport { BaseBondConfig, BillsConfig, MarketingCampaign } from '@ape.swap/apeswap-lists'\nimport { AnimatePresence, motion } from 'framer-motion'\nimport BondRow from './BondRow'\nimport { formatNumberSI } from '../../../../utils/formatNumber'\nimport { BondsData } from '../../../../types/bonds'\nimport Flex from '../../../../components/uikit-sdk/Flex'\nimport Svg from '../../../../components/uikit-sdk/Svg'\n\nconst SoldOutRows = ({ bonds }: { bonds: (BondsData | BaseBondConfig)[] }) => {\n  const bond = bonds[0] as BaseBondConfig\n  const [isOpen, setIsOpen] = useState(false)\n  return (\n    <AnimatePresence initial={false}>\n      <Flex sx={{ cursor: 'pointer' }} onClick={() => setIsOpen(!isOpen)}>\n        <BondRow\n          key={`${bond.contractAddress[bond.chainId]}-${bond.chainId}`}\n          bondAddress={bond.contractAddress?.[bond.chainId] as string}\n          marketingCampaign={bond.marketingCampaign as MarketingCampaign}\n          bondChain={bond.chainId}\n          //@ts-ignore\n          payoutToken={bond.underlyingEarnToken || bond.earnToken}\n          billType={bond.billType}\n          tag={bond.tags?.[0]}\n          bondSoldOut={true}\n          percentageAvailable={100}\n          remainingTokensString={`${formatNumberSI(0, 0)} ${bond.earnToken.symbol} ($${formatNumberSI(0, 2)})`}\n          vestingTermString=\"-\"\n          projectURL={bond.projectLink}\n          twitterURL={bond.twitter}\n          shortDescription={bond.shortDescription}\n          soldoutBondsCount={bonds.length > 1 ? bonds.length : undefined}\n          isOpen={isOpen}\n        />\n      </Flex>\n      {bonds.length > 1 &&\n        isOpen &&\n        bonds\n          .sort((a: BillsConfig, b: BillsConfig) => (b?.initTime?.[b.chainId] ?? 0) - (a?.initTime?.[a.chainId] ?? 0))\n          .map((bond) => {\n            return (\n              <motion.div\n                initial={{ height: 0, overflow: 'hidden' }}\n                animate={{ height: 'fit-content', overflow: 'hidden', transitionEnd: { overflow: 'visible' } }}\n                exit={{ height: 0, overflow: 'hidden' }}\n                sx={{\n                  position: 'relative',\n                  overflow: 'hidden',\n                  width: '100%',\n                  marginTop: '0px',\n                }}\n                key={`${bond.contractAddress[bond.chainId]}-${bond.chainId}`}\n                className=\"bonds-card-container\"\n              >\n                <Flex sx={{ cursor: 'pointer' }} onClick={() => setIsOpen(!isOpen)}>\n                  <Flex sx={{ alignItems: 'center', pb: '10px' }}>\n                    <Svg icon=\"turnArrow\" direction={'up'} />\n                  </Flex>\n                  <BondRow\n                    bondAddress={bond.contractAddress?.[bond.chainId] as string}\n                    marketingCampaign={bond.marketingCampaign as MarketingCampaign}\n                    bondChain={bond.chainId}\n                    payoutToken={bond.earnToken}\n                    billType={bond.billType}\n                    tag={bond.tags?.[0]}\n                    bondSoldOut={true}\n                    percentageAvailable={100}\n                    remainingTokensString={`${formatNumberSI(0, 0)} ${bond.earnToken.symbol} ($${formatNumberSI(0, 2)})`}\n                    vestingTermString=\"-\"\n                    projectURL={bond.projectLink}\n                    twitterURL={bond.twitter}\n                    shortDescription={bond.shortDescription}\n                  />\n                </Flex>\n              </motion.div>\n            )\n          })}\n    </AnimatePresence>\n  )\n}\n\nexport default SoldOutRows\n"],"names":["_jsxs","_jsx"],"mappings":"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"}
+{"version":3,"file":"SoldOutRows.js","sources":["../../../../../src/views/Bonds/components/BondRows/SoldOutRows.tsx"],"sourcesContent":["import React, { useState } from 'react'\nimport { BaseBondConfig, BillsConfig, MarketingCampaign } from '@ape.swap/apeswap-lists'\nimport { AnimatePresence, motion } from 'framer-motion'\nimport BondRow from './BondRow'\nimport { formatNumberSI } from '../../../../utils/formatNumber'\nimport { BondsData } from '../../../../types/bonds'\nimport Flex from '../../../../components/uikit-sdk/Flex'\nimport TurnArrow from '../../../../components/uikit-sdk/Svg/Icons/TurnArrow'\n\nconst SoldOutRows = ({ bonds }: { bonds: (BondsData | BaseBondConfig)[] }) => {\n  const bond = bonds[0] as BaseBondConfig\n  const [isOpen, setIsOpen] = useState(false)\n  return (\n    <AnimatePresence initial={false}>\n      <Flex sx={{ cursor: 'pointer' }} onClick={() => setIsOpen(!isOpen)}>\n        <BondRow\n          key={`${bond.contractAddress[bond.chainId]}-${bond.chainId}`}\n          bondAddress={bond.contractAddress?.[bond.chainId] as string}\n          marketingCampaign={bond.marketingCampaign as MarketingCampaign}\n          bondChain={bond.chainId}\n          //@ts-ignore\n          payoutToken={bond.underlyingEarnToken || bond.earnToken}\n          billType={bond.billType}\n          tag={bond.tags?.[0]}\n          bondSoldOut={true}\n          percentageAvailable={100}\n          remainingTokensString={`${formatNumberSI(0, 0)} ${bond.earnToken.symbol} ($${formatNumberSI(0, 2)})`}\n          vestingTermString=\"-\"\n          projectURL={bond.projectLink}\n          twitterURL={bond.twitter}\n          shortDescription={bond.shortDescription}\n          soldoutBondsCount={bonds.length > 1 ? bonds.length : undefined}\n          isOpen={isOpen}\n        />\n      </Flex>\n      {bonds.length > 1 &&\n        isOpen &&\n        bonds\n          .sort((a: BillsConfig, b: BillsConfig) => (b?.initTime?.[b.chainId] ?? 0) - (a?.initTime?.[a.chainId] ?? 0))\n          .map((bond) => {\n            return (\n              <motion.div\n                initial={{ height: 0, overflow: 'hidden' }}\n                animate={{ height: 'fit-content', overflow: 'hidden', transitionEnd: { overflow: 'visible' } }}\n                exit={{ height: 0, overflow: 'hidden' }}\n                sx={{\n                  position: 'relative',\n                  overflow: 'hidden',\n                  width: '100%',\n                  marginTop: '0px',\n                }}\n                key={`${bond.contractAddress[bond.chainId]}-${bond.chainId}`}\n                className=\"bonds-card-container\"\n              >\n                <Flex sx={{ cursor: 'pointer' }} onClick={() => setIsOpen(!isOpen)}>\n                  <Flex sx={{ alignItems: 'center', pb: '10px' }}>\n                    <TurnArrow direction={'up'} />\n                  </Flex>\n                  <BondRow\n                    bondAddress={bond.contractAddress?.[bond.chainId] as string}\n                    marketingCampaign={bond.marketingCampaign as MarketingCampaign}\n                    bondChain={bond.chainId}\n                    payoutToken={bond.earnToken}\n                    billType={bond.billType}\n                    tag={bond.tags?.[0]}\n                    bondSoldOut={true}\n                    percentageAvailable={100}\n                    remainingTokensString={`${formatNumberSI(0, 0)} ${bond.earnToken.symbol} ($${formatNumberSI(0, 2)})`}\n                    vestingTermString=\"-\"\n                    projectURL={bond.projectLink}\n                    twitterURL={bond.twitter}\n                    shortDescription={bond.shortDescription}\n                  />\n                </Flex>\n              </motion.div>\n            )\n          })}\n    </AnimatePresence>\n  )\n}\n\nexport default SoldOutRows\n"],"names":["_jsxs","_jsx"],"mappings":"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"}

package/dist/views/Bonds/components/BondsMenu/BondsMenu.js

@@ -1,10 +1,10 @@
 import { jsxs, jsx } from 'theme-ui/jsx-runtime';
 import Input from '../../../../components/uikit-sdk/Input/Input.js';
-import Svg from '../../../../components/uikit-sdk/Svg/index.js';
 import Flex from '../../../../components/uikit-sdk/Flex/index.js';
 import FavIcon from '../../../../components/FavIcons/FavFilter.js';
 import BondFilters from '../../../../components/BondFilters/BondFilters.js';
 import { useSDKConfig } from '../../../../state/useSDKConfig.js';
+import Sort from '../../../../components/uikit-sdk/Svg/Icons/Sort.js';
 
 const BondsMenu = ({ searchQuery, setSearchQuery, setChainFilterOption, chainFilterOption, filterOptions, filterOption, setFilterOption, onSort, }) => {
     const { namingPreference } = useSDKConfig();
@@ -15,7 +15,7 @@ const BondsMenu = ({ searchQuery, setSearchQuery, setChainFilterOption, chainFil
                                         fontSize: '14px',
                                         color: 'white',
                                         width: ['calc(50vw - 25px)'],
-                                    }, placeholder: 'Search...' }), jsx(FavIcon, { filterOption: filterOption, setFilterOption: setFilterOption })] }) }), jsxs("div", { className: "headers-container", children: [jsx(Flex, { sx: { width: '125px' } }), jsxs("div", { className: "discount-header", onClick: () => onSort('bonus'), children: [namingPreference.toUpperCase(), jsx(Flex, { sx: { ml: '5px', mb: '3px' }, children: jsx(Svg, { icon: "sort", width: 10, color: "textDisabledButton" }) })] }), jsxs("div", { className: "terms-header", onClick: () => onSort('terms'), children: ["TERMS", jsx(Flex, { sx: { ml: '5px', mb: '3px' }, children: jsx(Svg, { icon: "sort", width: "12px", color: "textDisabledButton" }) })] }), jsxs("div", { className: "tokens-remaining-header", onClick: () => onSort('tokensRemaining'), children: ["TOKENS REMAINING", jsx(Flex, { sx: { ml: '5px', mb: '3px' }, children: jsx(Svg, { icon: "sort", width: "12px", color: "textDisabledButton" }) })] }), jsx("div", { className: "tooltip-header" })] })] })] }));
+                                    }, placeholder: 'Search...' }), jsx(FavIcon, { filterOption: filterOption, setFilterOption: setFilterOption })] }) }), jsxs("div", { className: "headers-container", children: [jsx(Flex, { sx: { width: '125px' } }), jsxs("div", { className: "discount-header", onClick: () => onSort('bonus'), children: [namingPreference.toUpperCase(), jsx(Flex, { sx: { ml: '5px', mb: '3px' }, children: jsx(Sort, { width: 10, color: "textDisabledButton" }) })] }), jsxs("div", { className: "terms-header", onClick: () => onSort('terms'), children: ["TERMS", jsx(Flex, { sx: { ml: '5px', mb: '3px' }, children: jsx(Sort, { width: "12px", color: "textDisabledButton" }) })] }), jsxs("div", { className: "tokens-remaining-header", onClick: () => onSort('tokensRemaining'), children: ["TOKENS REMAINING", jsx(Flex, { sx: { ml: '5px', mb: '3px' }, children: jsx(Sort, { width: "12px", color: "textDisabledButton" }) })] }), jsx("div", { className: "tooltip-header" })] })] })] }));
 };
 
 export { BondsMenu as default };

package/dist/views/Bonds/components/BondsMenu/BondsMenu.js.map

@@ -1 +1 @@
-{"version":3,"file":"BondsMenu.js","sources":["../../../../../src/views/Bonds/components/BondsMenu/BondsMenu.tsx"],"sourcesContent":["import React from 'react'\nimport Input from '../../../../components/uikit-sdk/Input/Input'\nimport Svg from '../../../../components/uikit-sdk/Svg'\nimport Flex from '../../../../components/uikit-sdk/Flex'\nimport FavIcon from '../../../../components/FavIcons/FavFilter'\nimport BondFilters from '../../../../components/BondFilters/BondFilters'\nimport { useSDKConfig } from '../../../../state/useSDKConfig'\n\ninterface BondRowHeaderProps {\n  searchQuery: string\n  setSearchQuery: (value: string) => void\n  setChainFilterOption: (newValue: string[]) => void\n  chainFilterOption: string[]\n  filterOptions: string[]\n  filterOption: string\n  setFilterOption: (newOption: string) => void\n  onSort: (key: 'bonus' | 'arr' | 'terms' | 'tokensRemaining') => void\n}\n\nconst BondsMenu: React.FC<BondRowHeaderProps> = ({\n  searchQuery,\n  setSearchQuery,\n  setChainFilterOption,\n  chainFilterOption,\n  filterOptions,\n  filterOption,\n  setFilterOption,\n  onSort,\n}) => {\n  const { namingPreference } = useSDKConfig()\n  return (\n    <div className=\"bonds-menu\">\n      <BondFilters\n        chainFilterOption={chainFilterOption ?? ['All Chains']}\n        setChainFilterOption={setChainFilterOption}\n        filterOptions={filterOptions}\n        filterOption={filterOption}\n        setFilterOption={setFilterOption}\n        onHandleQueryChange={() => setSearchQuery('')}\n      />\n      <div className=\"table-header-container\">\n        <div className=\"search-container\">\n          <Flex sx={{ width: '100%', maxWidth: '340px' }}>\n            <Input\n              value={searchQuery}\n              onChange={(event: React.ChangeEvent<HTMLInputElement>) => setSearchQuery(event.target.value)}\n              variant=\"search\"\n              width={'100%'}\n              sx={{\n                fontWeight: 600,\n                background: 'white2',\n                height: '30px',\n                fontSize: '14px',\n                color: 'white',\n                width: ['calc(50vw - 25px)'],\n              }}\n              placeholder={'Search...'}\n            />\n            <FavIcon filterOption={filterOption} setFilterOption={setFilterOption} />\n          </Flex>\n        </div>\n        <div className=\"headers-container\">\n          <Flex sx={{ width: '125px' }} />\n          <div className=\"discount-header\" onClick={() => onSort('bonus')}>\n            {namingPreference.toUpperCase()}\n            <Flex sx={{ ml: '5px', mb: '3px' }}>\n              <Svg icon=\"sort\" width={10} color=\"textDisabledButton\" />\n            </Flex>\n          </div>\n          <div className=\"terms-header\" onClick={() => onSort('terms')}>\n            TERMS\n            <Flex sx={{ ml: '5px', mb: '3px' }}>\n              <Svg icon=\"sort\" width=\"12px\" color=\"textDisabledButton\" />\n            </Flex>\n          </div>\n          <div className=\"tokens-remaining-header\" onClick={() => onSort('tokensRemaining')}>\n            TOKENS REMAINING\n            <Flex sx={{ ml: '5px', mb: '3px' }}>\n              <Svg icon=\"sort\" width=\"12px\" color=\"textDisabledButton\" />\n            </Flex>\n          </div>\n          <div className=\"tooltip-header\" />\n        </div>\n      </div>\n    </div>\n  )\n}\n\nexport default BondsMenu\n"],"names":["_jsxs","_jsx"],"mappings":"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"}
+{"version":3,"file":"BondsMenu.js","sources":["../../../../../src/views/Bonds/components/BondsMenu/BondsMenu.tsx"],"sourcesContent":["import React from 'react'\nimport Input from '../../../../components/uikit-sdk/Input/Input'\nimport Flex from '../../../../components/uikit-sdk/Flex'\nimport FavIcon from '../../../../components/FavIcons/FavFilter'\nimport BondFilters from '../../../../components/BondFilters/BondFilters'\nimport { useSDKConfig } from '../../../../state/useSDKConfig'\nimport Sort from '../../../../components/uikit-sdk/Svg/Icons/Sort'\n\ninterface BondRowHeaderProps {\n  searchQuery: string\n  setSearchQuery: (value: string) => void\n  setChainFilterOption: (newValue: string[]) => void\n  chainFilterOption: string[]\n  filterOptions: string[]\n  filterOption: string\n  setFilterOption: (newOption: string) => void\n  onSort: (key: 'bonus' | 'arr' | 'terms' | 'tokensRemaining') => void\n}\n\nconst BondsMenu: React.FC<BondRowHeaderProps> = ({\n  searchQuery,\n  setSearchQuery,\n  setChainFilterOption,\n  chainFilterOption,\n  filterOptions,\n  filterOption,\n  setFilterOption,\n  onSort,\n}) => {\n  const { namingPreference } = useSDKConfig()\n  return (\n    <div className=\"bonds-menu\">\n      <BondFilters\n        chainFilterOption={chainFilterOption ?? ['All Chains']}\n        setChainFilterOption={setChainFilterOption}\n        filterOptions={filterOptions}\n        filterOption={filterOption}\n        setFilterOption={setFilterOption}\n        onHandleQueryChange={() => setSearchQuery('')}\n      />\n      <div className=\"table-header-container\">\n        <div className=\"search-container\">\n          <Flex sx={{ width: '100%', maxWidth: '340px' }}>\n            <Input\n              value={searchQuery}\n              onChange={(event: React.ChangeEvent<HTMLInputElement>) => setSearchQuery(event.target.value)}\n              variant=\"search\"\n              width={'100%'}\n              sx={{\n                fontWeight: 600,\n                background: 'white2',\n                height: '30px',\n                fontSize: '14px',\n                color: 'white',\n                width: ['calc(50vw - 25px)'],\n              }}\n              placeholder={'Search...'}\n            />\n            <FavIcon filterOption={filterOption} setFilterOption={setFilterOption} />\n          </Flex>\n        </div>\n        <div className=\"headers-container\">\n          <Flex sx={{ width: '125px' }} />\n          <div className=\"discount-header\" onClick={() => onSort('bonus')}>\n            {namingPreference.toUpperCase()}\n            <Flex sx={{ ml: '5px', mb: '3px' }}>\n              <Sort width={10} color=\"textDisabledButton\" />\n            </Flex>\n          </div>\n          <div className=\"terms-header\" onClick={() => onSort('terms')}>\n            TERMS\n            <Flex sx={{ ml: '5px', mb: '3px' }}>\n              <Sort width=\"12px\" color=\"textDisabledButton\" />\n            </Flex>\n          </div>\n          <div className=\"tokens-remaining-header\" onClick={() => onSort('tokensRemaining')}>\n            TOKENS REMAINING\n            <Flex sx={{ ml: '5px', mb: '3px' }}>\n              <Sort width=\"12px\" color=\"textDisabledButton\" />\n            </Flex>\n          </div>\n          <div className=\"tooltip-header\" />\n        </div>\n      </div>\n    </div>\n  )\n}\n\nexport default BondsMenu\n"],"names":["_jsxs","_jsx"],"mappings":"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"}

package/dist/views/Bonds/components/BonusComponents/BonusComponent.js

@@ -7,7 +7,7 @@ import { findHighestTrueBondPrice } from '../../../../utils/bondPriceHelpers.js'
 import { useIsMobile } from '../../../../hooks/useIsMobile.js';
 import Flex from '../../../../components/uikit-sdk/Flex/index.js';
 import TooltipBubble from '../../../../components/uikit-sdk/TooltipBubble/index.js';
-import Svg from '../../../../components/uikit-sdk/Svg/index.js';
+import Timer from '../../../../components/uikit-sdk/Svg/Icons/Timer.js';
 
 const BonusComponent = ({ trueBondPrices, minTier, bonus, airdropTooltip, tooltipPosition, hideTooltip, }) => {
     const SDKConfig = useSDKConfig();
@@ -39,7 +39,7 @@ const BonusComponent = ({ trueBondPrices, minTier, bonus, airdropTooltip, toolti
                                             ? 'success'
                                             : 'error',
                                         fontSize: ['14px', '14px', '16px', '16px'],
-                                    }, children: [highestPointsElement?.bonusWithFee?.toFixed(2), "%"] })] })] }) })) : (jsx(Flex, { sx: { height: '20px', width: '20px' }, children: jsx(TooltipBubble, { body: 'This bond is currently on cooldown and has no bonus. Please check back soon.', width: "205px", placement: "bottomRight", transformTip: "translate(10%, 0%)", children: jsx(Svg, { icon: "Timer", width: "20px", color: "#81CFEA" }) }) })) })) : baseTrueBondPrice ? (jsx(Flex, { sx: { alignItems: 'center', minWidth: '20px' }, className: `${getDiscountColor(+baseTrueBondPrice?.bonusWithFee)}`, children: baseTrueBondPrice?.bonusWithFee > 0 ? (`${baseTrueBondPrice?.bonusWithFee?.toFixed(2)}%`) : (jsx(Flex, { sx: { height: '20px', width: '20px' }, children: jsx(TooltipBubble, { body: 'This bond is currently on cooldown and has no bonus. Please check back soon.', width: "205px", placement: "bottomRight", transformTip: "translate(10%, 0%)", children: jsx(Svg, { icon: "Timer", width: "20px", color: "#81CFEA" }) }) })) })) : (jsxs(Flex, { sx: { color: bonus && 'success', alignItems: 'center', minWidth: '20px' }, children: [bonus || '-', airdropTooltip && (jsx(TooltipBubble, { body: jsx(Fragment, { children: airdropTooltip }), width: "230px", placement: isMobile ? 'bottomRight' : 'bottomLeft', transformTip: isMobile ? 'translate(9%, 6%)' : 'translate(-3%, 6%)', children: jsx(Flex, { sx: { width: '20px', height: '20px', alignItems: 'center', ml: '5px' }, children: jsx("img", { src: "https://res.cloudinary.com/dswmrqgwy/image/upload/v1750345773/airdrop_qvh4ow.png", alt: "airdrop-img", style: { width: '20px', height: '20px' } }) }) }))] })) }));
+                                    }, children: [highestPointsElement?.bonusWithFee?.toFixed(2), "%"] })] })] }) })) : (jsx(Flex, { sx: { height: '20px', width: '20px' }, children: jsx(TooltipBubble, { body: 'This bond is currently on cooldown and has no bonus. Please check back soon.', width: "205px", placement: "bottomRight", transformTip: "translate(10%, 0%)", children: jsx(Timer, { width: "20px", color: "#81CFEA" }) }) })) })) : baseTrueBondPrice ? (jsx(Flex, { sx: { alignItems: 'center', minWidth: '20px' }, className: `${getDiscountColor(+baseTrueBondPrice?.bonusWithFee)}`, children: baseTrueBondPrice?.bonusWithFee > 0 ? (`${baseTrueBondPrice?.bonusWithFee?.toFixed(2)}%`) : (jsx(Flex, { sx: { height: '20px', width: '20px' }, children: jsx(TooltipBubble, { body: 'This bond is currently on cooldown and has no bonus. Please check back soon.', width: "205px", placement: "bottomRight", transformTip: "translate(10%, 0%)", children: jsx(Timer, { width: "20px", color: "#81CFEA" }) }) })) })) : (jsxs(Flex, { sx: { color: bonus && 'success', alignItems: 'center', minWidth: '20px' }, children: [bonus || '-', airdropTooltip && (jsx(TooltipBubble, { body: jsx(Fragment, { children: airdropTooltip }), width: "230px", placement: isMobile ? 'bottomRight' : 'bottomLeft', transformTip: isMobile ? 'translate(9%, 6%)' : 'translate(-3%, 6%)', children: jsx(Flex, { sx: { width: '20px', height: '20px', alignItems: 'center', ml: '5px' }, children: jsx("img", { src: "https://res.cloudinary.com/dswmrqgwy/image/upload/v1750345773/airdrop_qvh4ow.png", alt: "airdrop-img", style: { width: '20px', height: '20px' } }) }) }))] })) }));
 };
 
 export { BonusComponent as default };

package/dist/views/Bonds/components/BonusComponents/BonusComponent.js.map

@@ -1 +1 @@
-{"version":3,"file":"BonusComponent.js","sources":["../../../../../src/views/Bonds/components/BonusComponents/BonusComponent.tsx"],"sourcesContent":["import React from 'react'\nimport { TrueBondPrices } from '../../../../types/bonds'\nimport { BigNumber } from 'bignumber.js'\nimport BonusTable from './BonusTable'\nimport { useSDKConfig } from '../../../../state/useSDKConfig'\nimport { getDiscountColor } from '../../utils'\nimport { findHighestTrueBondPrice } from '../../../../utils/bondPriceHelpers'\nimport { LaunchBondTiers } from '@ape.swap/apeswap-lists'\nimport { useIsMobile } from '../../../../hooks/useIsMobile'\nimport Flex from '../../../../components/uikit-sdk/Flex'\nimport TooltipBubble from '../../../../components/uikit-sdk/TooltipBubble'\nimport Svg from '../../../../components/uikit-sdk/Svg'\n\nconst BonusComponent = ({\n  trueBondPrices,\n  minTier,\n  bonus,\n  airdropTooltip,\n  tooltipPosition,\n  hideTooltip,\n}: {\n  trueBondPrices?: TrueBondPrices[]\n  minTier?: LaunchBondTiers\n  bonus?: string\n  airdropTooltip?: string\n  tooltipPosition?: 'bottomRight' | 'bottomLeft'\n  hideTooltip?: boolean\n}) => {\n  const SDKConfig = useSDKConfig()\n  const isMobile = useIsMobile()\n  const highestPointsElement = trueBondPrices?.reduce((max, current) => {\n    return new BigNumber(current.points).isGreaterThan(new BigNumber(max.points)) ? current : max\n  }, trueBondPrices[0])\n\n  const baseTrueBondPrice = findHighestTrueBondPrice('0', trueBondPrices)\n\n  return (\n    <Flex>\n      {trueBondPrices && trueBondPrices?.length > 1 && SDKConfig.useTiers ? (\n        <Flex sx={{ alignItems: 'center', minWidth: '20px' }}>\n          {highestPointsElement?.bonusWithFee && highestPointsElement?.bonusWithFee > 0 ? (\n            <TooltipBubble\n              width=\"280px\"\n              placement={tooltipPosition}\n              transformTip={tooltipPosition === 'bottomLeft' ? 'translate(0%, 0%)' : 'translate(0%, 0%)'}\n              body={<BonusTable trueBondPrices={trueBondPrices} minTier={minTier} />}\n              sx={{ display: hideTooltip ? 'none' : 'block' }}\n            >\n              <Flex\n                sx={{\n                  p: '3px 6px',\n                  border: '1px solid #9960C5',\n                  borderRadius: 'normal',\n                  background: 'transparent',\n                  position: 'relative',\n                  overflow: 'hidden',\n                  cursor: 'pointer',\n                  width: ['130px', '130px', '150px', '150px'],\n                }}\n              >\n                <Flex\n                  sx={{\n                    position: 'absolute',\n                    width: '100%',\n                    height: '100%',\n                    top: 0,\n                    left: 0,\n                    zIndex: 1,\n                    background: '#9960C5',\n                    opacity: 0.2,\n                  }}\n                />\n                <Flex sx={{ width: '100%', zIndex: 2, alignItems: 'center', justifyContent: 'center' }}>\n                  <img\n                    src={`https://ape.bond/images/launch/mythical.png`}\n                    alt=\"minTier\"\n                    style={{ width: '21px', height: '21px', marginRight: '3px', zIndex: 1 }}\n                  />\n                  <Flex sx={{ fontSize: ['12px', '12px', '14px', '14px'], mr: '3px' }}>Up to</Flex>\n                  <Flex\n                    sx={{\n                      color:\n                        highestPointsElement?.bonusWithFee && highestPointsElement?.bonusWithFee > 0\n                          ? 'success'\n                          : 'error',\n                      fontSize: ['14px', '14px', '16px', '16px'],\n                    }}\n                  >\n                    {highestPointsElement?.bonusWithFee?.toFixed(2)}%\n                  </Flex>\n                </Flex>\n              </Flex>\n            </TooltipBubble>\n          ) : (\n            <Flex sx={{ height: '20px', width: '20px' }}>\n              <TooltipBubble\n                body={'This bond is currently on cooldown and has no bonus. Please check back soon.'}\n                width=\"205px\"\n                placement=\"bottomRight\"\n                transformTip=\"translate(10%, 0%)\"\n              >\n                <Svg icon=\"Timer\" width=\"20px\" color=\"#81CFEA\" />\n              </TooltipBubble>\n            </Flex>\n          )}\n        </Flex>\n      ) : baseTrueBondPrice ? (\n        <Flex\n          sx={{ alignItems: 'center', minWidth: '20px' }}\n          className={`${getDiscountColor(+baseTrueBondPrice?.bonusWithFee)}`}\n        >\n          {baseTrueBondPrice?.bonusWithFee > 0 ? (\n            `${baseTrueBondPrice?.bonusWithFee?.toFixed(2)}%`\n          ) : (\n            <Flex sx={{ height: '20px', width: '20px' }}>\n              <TooltipBubble\n                body={'This bond is currently on cooldown and has no bonus. Please check back soon.'}\n                width=\"205px\"\n                placement=\"bottomRight\"\n                transformTip=\"translate(10%, 0%)\"\n              >\n                <Svg icon=\"Timer\" width=\"20px\" color=\"#81CFEA\" />\n              </TooltipBubble>\n            </Flex>\n          )}\n        </Flex>\n      ) : (\n        <Flex sx={{ color: bonus && 'success', alignItems: 'center', minWidth: '20px' }}>\n          {bonus || '-'}\n          {airdropTooltip && (\n            <TooltipBubble\n              body={<>{airdropTooltip}</>}\n              width=\"230px\"\n              placement={isMobile ? 'bottomRight' : 'bottomLeft'}\n              transformTip={isMobile ? 'translate(9%, 6%)' : 'translate(-3%, 6%)'}\n            >\n              <Flex sx={{ width: '20px', height: '20px', alignItems: 'center', ml: '5px' }}>\n                <img\n                  src=\"https://res.cloudinary.com/dswmrqgwy/image/upload/v1750345773/airdrop_qvh4ow.png\"\n                  alt=\"airdrop-img\"\n                  style={{ width: '20px', height: '20px' }}\n                />\n              </Flex>\n            </TooltipBubble>\n          )}\n        </Flex>\n      )}\n    </Flex>\n  )\n}\n\nexport default BonusComponent\n"],"names":["_jsx","_jsxs"],"mappings":"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"}
+{"version":3,"file":"BonusComponent.js","sources":["../../../../../src/views/Bonds/components/BonusComponents/BonusComponent.tsx"],"sourcesContent":["import React from 'react'\nimport { TrueBondPrices } from '../../../../types/bonds'\nimport { BigNumber } from 'bignumber.js'\nimport BonusTable from './BonusTable'\nimport { useSDKConfig } from '../../../../state/useSDKConfig'\nimport { getDiscountColor } from '../../utils'\nimport { findHighestTrueBondPrice } from '../../../../utils/bondPriceHelpers'\nimport { LaunchBondTiers } from '@ape.swap/apeswap-lists'\nimport { useIsMobile } from '../../../../hooks/useIsMobile'\nimport Flex from '../../../../components/uikit-sdk/Flex'\nimport TooltipBubble from '../../../../components/uikit-sdk/TooltipBubble'\nimport Timer from '../../../../components/uikit-sdk/Svg/Icons/Timer'\n\nconst BonusComponent = ({\n  trueBondPrices,\n  minTier,\n  bonus,\n  airdropTooltip,\n  tooltipPosition,\n  hideTooltip,\n}: {\n  trueBondPrices?: TrueBondPrices[]\n  minTier?: LaunchBondTiers\n  bonus?: string\n  airdropTooltip?: string\n  tooltipPosition?: 'bottomRight' | 'bottomLeft'\n  hideTooltip?: boolean\n}) => {\n  const SDKConfig = useSDKConfig()\n  const isMobile = useIsMobile()\n  const highestPointsElement = trueBondPrices?.reduce((max, current) => {\n    return new BigNumber(current.points).isGreaterThan(new BigNumber(max.points)) ? current : max\n  }, trueBondPrices[0])\n\n  const baseTrueBondPrice = findHighestTrueBondPrice('0', trueBondPrices)\n\n  return (\n    <Flex>\n      {trueBondPrices && trueBondPrices?.length > 1 && SDKConfig.useTiers ? (\n        <Flex sx={{ alignItems: 'center', minWidth: '20px' }}>\n          {highestPointsElement?.bonusWithFee && highestPointsElement?.bonusWithFee > 0 ? (\n            <TooltipBubble\n              width=\"280px\"\n              placement={tooltipPosition}\n              transformTip={tooltipPosition === 'bottomLeft' ? 'translate(0%, 0%)' : 'translate(0%, 0%)'}\n              body={<BonusTable trueBondPrices={trueBondPrices} minTier={minTier} />}\n              sx={{ display: hideTooltip ? 'none' : 'block' }}\n            >\n              <Flex\n                sx={{\n                  p: '3px 6px',\n                  border: '1px solid #9960C5',\n                  borderRadius: 'normal',\n                  background: 'transparent',\n                  position: 'relative',\n                  overflow: 'hidden',\n                  cursor: 'pointer',\n                  width: ['130px', '130px', '150px', '150px'],\n                }}\n              >\n                <Flex\n                  sx={{\n                    position: 'absolute',\n                    width: '100%',\n                    height: '100%',\n                    top: 0,\n                    left: 0,\n                    zIndex: 1,\n                    background: '#9960C5',\n                    opacity: 0.2,\n                  }}\n                />\n                <Flex sx={{ width: '100%', zIndex: 2, alignItems: 'center', justifyContent: 'center' }}>\n                  <img\n                    src={`https://ape.bond/images/launch/mythical.png`}\n                    alt=\"minTier\"\n                    style={{ width: '21px', height: '21px', marginRight: '3px', zIndex: 1 }}\n                  />\n                  <Flex sx={{ fontSize: ['12px', '12px', '14px', '14px'], mr: '3px' }}>Up to</Flex>\n                  <Flex\n                    sx={{\n                      color:\n                        highestPointsElement?.bonusWithFee && highestPointsElement?.bonusWithFee > 0\n                          ? 'success'\n                          : 'error',\n                      fontSize: ['14px', '14px', '16px', '16px'],\n                    }}\n                  >\n                    {highestPointsElement?.bonusWithFee?.toFixed(2)}%\n                  </Flex>\n                </Flex>\n              </Flex>\n            </TooltipBubble>\n          ) : (\n            <Flex sx={{ height: '20px', width: '20px' }}>\n              <TooltipBubble\n                body={'This bond is currently on cooldown and has no bonus. Please check back soon.'}\n                width=\"205px\"\n                placement=\"bottomRight\"\n                transformTip=\"translate(10%, 0%)\"\n              >\n                <Timer width=\"20px\" color=\"#81CFEA\" />\n              </TooltipBubble>\n            </Flex>\n          )}\n        </Flex>\n      ) : baseTrueBondPrice ? (\n        <Flex\n          sx={{ alignItems: 'center', minWidth: '20px' }}\n          className={`${getDiscountColor(+baseTrueBondPrice?.bonusWithFee)}`}\n        >\n          {baseTrueBondPrice?.bonusWithFee > 0 ? (\n            `${baseTrueBondPrice?.bonusWithFee?.toFixed(2)}%`\n          ) : (\n            <Flex sx={{ height: '20px', width: '20px' }}>\n              <TooltipBubble\n                body={'This bond is currently on cooldown and has no bonus. Please check back soon.'}\n                width=\"205px\"\n                placement=\"bottomRight\"\n                transformTip=\"translate(10%, 0%)\"\n              >\n                <Timer width=\"20px\" color=\"#81CFEA\" />\n              </TooltipBubble>\n            </Flex>\n          )}\n        </Flex>\n      ) : (\n        <Flex sx={{ color: bonus && 'success', alignItems: 'center', minWidth: '20px' }}>\n          {bonus || '-'}\n          {airdropTooltip && (\n            <TooltipBubble\n              body={<>{airdropTooltip}</>}\n              width=\"230px\"\n              placement={isMobile ? 'bottomRight' : 'bottomLeft'}\n              transformTip={isMobile ? 'translate(9%, 6%)' : 'translate(-3%, 6%)'}\n            >\n              <Flex sx={{ width: '20px', height: '20px', alignItems: 'center', ml: '5px' }}>\n                <img\n                  src=\"https://res.cloudinary.com/dswmrqgwy/image/upload/v1750345773/airdrop_qvh4ow.png\"\n                  alt=\"airdrop-img\"\n                  style={{ width: '20px', height: '20px' }}\n                />\n              </Flex>\n            </TooltipBubble>\n          )}\n        </Flex>\n      )}\n    </Flex>\n  )\n}\n\nexport default BonusComponent\n"],"names":["_jsx","_jsxs","_Fragment"],"mappings":"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"}

package/dist/views/Bonds/components/HotBondCards/HotBondCard.js

@@ -4,13 +4,14 @@ import useModal from '../../../../hooks/useModal.js';
 import BuyBondModal from '../../../BuyBond/BuyBondModal.js';
 import track from '../../../../utils/track.js';
 import Flex from '../../../../components/uikit-sdk/Flex/index.js';
-import Svg from '../../../../components/uikit-sdk/Svg/index.js';
 import TokenImage from '../../../../components/uikit-sdk/TokenImage/index.js';
 import { NETWORK_ICONS } from '../../../../config/constants/chains.js';
+import Question from '../../../../components/uikit-sdk/Svg/Icons/Question.js';
 import BonusComponent from '../BonusComponents/BonusComponent.js';
 import { getTimePeriods } from '../../../../utils/getTimePeriods.js';
 
 const HotBondCard = ({ bond }) => {
+    const ChainIcon = NETWORK_ICONS[bond.chainId] ?? Question;
     // Modal
     const [openBuyModal] = useModal(jsx(BuyBondModal, { bondAddress: bond?.contractAddress?.[bond?.chainId], bondChain: bond.chainId }), true, true, `buyBondModal-${bond?.contractAddress?.[bond?.chainId]}-${bond.chainId}`);
     const handleOpenModal = () => {
@@ -36,7 +37,7 @@ const HotBondCard = ({ bond }) => {
                     width: '100%',
                     position: 'relative',
                     gap: '10px',
-                }, children: [jsx(Flex, { sx: { position: 'absolute', top: 0, left: 0, borderRadius: '10px 0px 10px 0px', overflow: 'hidden' }, children: jsx(Svg, { width: 20, height: 20, icon: NETWORK_ICONS[bond.chainId] }) }), jsx(Flex, { sx: {
+                }, children: [jsx(Flex, { sx: { position: 'absolute', top: 0, left: 0, borderRadius: '10px 0px 10px 0px', overflow: 'hidden' }, children: jsx(ChainIcon, { width: 20, height: 20 }) }), jsx(Flex, { sx: {
                             alignItems: 'center',
                             justifyContent: 'center',
                             width: '100px',

package/dist/views/Bonds/components/HotBondCards/HotBondCard.js.map

@@ -1 +1 @@
-{"version":3,"file":"HotBondCard.js","sources":["../../../../../src/views/Bonds/components/HotBondCards/HotBondCard.tsx"],"sourcesContent":["import React from 'react'\nimport { styles } from './styles'\nimport { BondsData } from '../../../../types/bonds'\nimport useModal from '../../../../hooks/useModal'\nimport BuyBondModal from '../../../BuyBond/BuyBondModal'\nimport track from '../../../../utils/track'\nimport Flex from '../../../../components/uikit-sdk/Flex'\nimport Svg from '../../../../components/uikit-sdk/Svg'\nimport TokenImage from '../../../../components/uikit-sdk/TokenImage'\nimport { NETWORK_ICONS } from '../../../../config/constants/chains'\nimport BonusComponent from '../BonusComponents/BonusComponent'\nimport { getTimePeriods } from '../../../../utils/getTimePeriods'\n\nconst HotBondCard = ({ bond }: { bond: BondsData }) => {\n  // Modal\n  const [openBuyModal] = useModal(\n    <BuyBondModal bondAddress={bond?.contractAddress?.[bond?.chainId]} bondChain={bond.chainId} />,\n    true,\n    true,\n    `buyBondModal-${bond?.contractAddress?.[bond?.chainId]}-${bond.chainId}`,\n  )\n\n  const handleOpenModal = () => {\n    openBuyModal()\n    track({\n      event: 'hotClick',\n      chain: bond.chainId,\n      data: {\n        cat: 'hotClick',\n        bond: bond.earnToken.symbol,\n      },\n    })\n  }\n\n  return (\n    <Flex\n      sx={{\n        background: 'white2',\n        width: '100%',\n        borderRadius: 'normal',\n        mt: '10px',\n        '&:hover': {\n          background: 'white3',\n        },\n      }}\n    >\n      <Flex sx={styles.desktopCard} className=\"hot-bond-card\" onClick={handleOpenModal}>\n        <Flex\n          sx={{\n            width: '100%',\n            position: 'relative',\n            gap: '10px',\n          }}\n        >\n          <Flex sx={{ position: 'absolute', top: 0, left: 0, borderRadius: '10px 0px 10px 0px', overflow: 'hidden' }}>\n            <Svg width={20} height={20} icon={NETWORK_ICONS[bond.chainId]} />\n          </Flex>\n          <Flex\n            sx={{\n              alignItems: 'center',\n              justifyContent: 'center',\n              width: '100px',\n            }}\n          >\n            <TokenImage symbol={bond.earnToken.symbol} size={80} />\n          </Flex>\n          <Flex sx={{ flexDirection: 'column', justifyContent: 'center', gap: '10px' }}>\n            <Flex sx={{ fontWeight: 700, fontSize: ['14px'] }}>${bond.earnToken.symbol}</Flex>\n            <Flex sx={{ gap: ['20px', '20px', '20px', '20px', '10px', '30px'] }}>\n              <Flex sx={{ flexDirection: 'column', alignItems: 'center' }}>\n                <Flex sx={{ fontWeight: 700, fontSize: ['16px'], height: '30px', alignItems: 'center' }}>\n                  {getTimePeriods(bond?.vestingTerm, true)?.days} D\n                </Flex>\n                <Flex sx={{ fontWeight: 400, fontSize: ['11px'], color: 'textDisabledButton', mt: '5px' }}>Terms</Flex>\n              </Flex>\n              <Flex sx={{ flexDirection: 'column', alignItems: 'center', minWidth: '148px' }}>\n                <Flex sx={{ fontWeight: 700, fontSize: ['16px'], height: '30px' }}>\n                  <BonusComponent trueBondPrices={bond.trueBondPrices} hideTooltip />\n                </Flex>\n                <Flex sx={{ fontWeight: 400, fontSize: ['11px'], color: 'textDisabledButton', mt: '5px' }}>Bonus</Flex>\n              </Flex>\n            </Flex>\n          </Flex>\n        </Flex>\n      </Flex>\n    </Flex>\n  )\n}\n\nexport default HotBondCard\n"],"names":["_jsx","_jsxs"],"mappings":"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"}
+{"version":3,"file":"HotBondCard.js","sources":["../../../../../src/views/Bonds/components/HotBondCards/HotBondCard.tsx"],"sourcesContent":["import React from 'react'\nimport { styles } from './styles'\nimport { BondsData } from '../../../../types/bonds'\nimport useModal from '../../../../hooks/useModal'\nimport BuyBondModal from '../../../BuyBond/BuyBondModal'\nimport track from '../../../../utils/track'\nimport Flex from '../../../../components/uikit-sdk/Flex'\nimport TokenImage from '../../../../components/uikit-sdk/TokenImage'\nimport { NETWORK_ICONS } from '../../../../config/constants/chains'\nimport Question from '../../../../components/uikit-sdk/Svg/Icons/Question'\nimport BonusComponent from '../BonusComponents/BonusComponent'\nimport { getTimePeriods } from '../../../../utils/getTimePeriods'\n\nconst HotBondCard = ({ bond }: { bond: BondsData }) => {\n  const ChainIcon = NETWORK_ICONS[bond.chainId] ?? Question\n  // Modal\n  const [openBuyModal] = useModal(\n    <BuyBondModal bondAddress={bond?.contractAddress?.[bond?.chainId]} bondChain={bond.chainId} />,\n    true,\n    true,\n    `buyBondModal-${bond?.contractAddress?.[bond?.chainId]}-${bond.chainId}`,\n  )\n\n  const handleOpenModal = () => {\n    openBuyModal()\n    track({\n      event: 'hotClick',\n      chain: bond.chainId,\n      data: {\n        cat: 'hotClick',\n        bond: bond.earnToken.symbol,\n      },\n    })\n  }\n\n  return (\n    <Flex\n      sx={{\n        background: 'white2',\n        width: '100%',\n        borderRadius: 'normal',\n        mt: '10px',\n        '&:hover': {\n          background: 'white3',\n        },\n      }}\n    >\n      <Flex sx={styles.desktopCard} className=\"hot-bond-card\" onClick={handleOpenModal}>\n        <Flex\n          sx={{\n            width: '100%',\n            position: 'relative',\n            gap: '10px',\n          }}\n        >\n          <Flex sx={{ position: 'absolute', top: 0, left: 0, borderRadius: '10px 0px 10px 0px', overflow: 'hidden' }}>\n            <ChainIcon width={20} height={20} />\n          </Flex>\n          <Flex\n            sx={{\n              alignItems: 'center',\n              justifyContent: 'center',\n              width: '100px',\n            }}\n          >\n            <TokenImage symbol={bond.earnToken.symbol} size={80} />\n          </Flex>\n          <Flex sx={{ flexDirection: 'column', justifyContent: 'center', gap: '10px' }}>\n            <Flex sx={{ fontWeight: 700, fontSize: ['14px'] }}>${bond.earnToken.symbol}</Flex>\n            <Flex sx={{ gap: ['20px', '20px', '20px', '20px', '10px', '30px'] }}>\n              <Flex sx={{ flexDirection: 'column', alignItems: 'center' }}>\n                <Flex sx={{ fontWeight: 700, fontSize: ['16px'], height: '30px', alignItems: 'center' }}>\n                  {getTimePeriods(bond?.vestingTerm, true)?.days} D\n                </Flex>\n                <Flex sx={{ fontWeight: 400, fontSize: ['11px'], color: 'textDisabledButton', mt: '5px' }}>Terms</Flex>\n              </Flex>\n              <Flex sx={{ flexDirection: 'column', alignItems: 'center', minWidth: '148px' }}>\n                <Flex sx={{ fontWeight: 700, fontSize: ['16px'], height: '30px' }}>\n                  <BonusComponent trueBondPrices={bond.trueBondPrices} hideTooltip />\n                </Flex>\n                <Flex sx={{ fontWeight: 400, fontSize: ['11px'], color: 'textDisabledButton', mt: '5px' }}>Bonus</Flex>\n              </Flex>\n            </Flex>\n          </Flex>\n        </Flex>\n      </Flex>\n    </Flex>\n  )\n}\n\nexport default HotBondCard\n"],"names":["_jsx","_jsxs"],"mappings":"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"}

package/dist/views/BuyBond/BuyComponent.js

@@ -46,9 +46,9 @@ import Flex from '../../components/uikit-sdk/Flex/index.js';
 import Text from '../../components/uikit-sdk/Text/index.js';
 import Button from '../../components/uikit-sdk/Button/Button.js';
 import { formatNumberSI } from '../../utils/formatNumber.js';
-import Svg from '../../components/uikit-sdk/Svg/index.js';
 import TooltipBubble from '../../components/uikit-sdk/TooltipBubble/index.js';
 import GetUpToComponent from './components/GetUpToComponent/GetUpToComponent.js';
+import QuestionCircle from '../../components/uikit-sdk/Svg/Icons/QuestionCircle.js';
 
 const PROMOTION_TRACKING_SUFFIXES = {
     [Promotions.WelcomeBonus]: 'welcome-bonus',
@@ -389,11 +389,11 @@ const BuyComponent = ({ onDismiss, bondAddress, bondChain, handlePurchasedBond,
                                     display: ['inline-flex', 'inline-flex', 'inline-flex', 'none'],
                                     alignItems: 'center',
                                     verticalAlign: 'middle',
-                                }, children: jsx(TooltipBubble, { className: "tooltip-bubble", body: jsx(Flex, { children: `If the bond gets filled before April 21st, all buyers get a 2% $pmUSD bonus (5% total bonus). Under the same condition, RAAC Bot NFT holders get an extra 2% on top (7% total bonus).` }), width: '200px', placement: "topRight", transformTip: "translate(12%, -8%)", children: jsx(Flex, { sx: { opacity: 0.6 }, children: jsx(Svg, { icon: "questionCircle", width: "12px" }) }) }) }), jsx("span", { sx: {
+                                }, children: jsx(TooltipBubble, { className: "tooltip-bubble", body: jsx(Flex, { children: `If the bond gets filled before April 21st, all buyers get a 2% $pmUSD bonus (5% total bonus). Under the same condition, RAAC Bot NFT holders get an extra 2% on top (7% total bonus).` }), width: '200px', placement: "topRight", transformTip: "translate(12%, -8%)", children: jsx(Flex, { sx: { opacity: 0.6 }, children: jsx(QuestionCircle, { width: "12px" }) }) }) }), jsx("span", { sx: {
                                     display: ['none', 'none', 'none', 'inline-flex'],
                                     alignItems: 'center',
                                     verticalAlign: 'middle',
-                                }, children: jsx(TooltipBubble, { className: "tooltip-bubble", body: jsx(Flex, { children: `If the bond gets filled before April 21st, all buyers get a 2% $pmUSD bonus (5% total bonus). Under the same condition, RAAC Bot NFT holders get an extra 2% on top (7% total bonus).` }), width: '280px', placement: "topRight", transformTip: "translate(10%, -11%)", children: jsx(Flex, { sx: { opacity: 0.6 }, children: jsx(Svg, { icon: "questionCircle", width: "12px" }) }) }) })] }) })), bondData?.warningCard && (jsx(Flex, { sx: {
+                                }, children: jsx(TooltipBubble, { className: "tooltip-bubble", body: jsx(Flex, { children: `If the bond gets filled before April 21st, all buyers get a 2% $pmUSD bonus (5% total bonus). Under the same condition, RAAC Bot NFT holders get an extra 2% on top (7% total bonus).` }), width: '280px', placement: "topRight", transformTip: "translate(10%, -11%)", children: jsx(Flex, { sx: { opacity: 0.6 }, children: jsx(QuestionCircle, { width: "12px" }) }) }) })] }) })), bondData?.warningCard && (jsx(Flex, { sx: {
                         width: '100%',
                         background: '#DE62F366',
                         mt: '10px',