@ape.swap/bonds-sdk 6.2.11 → 6.2.13

package/dist/views/YourBondsModal/components/TransferBondModal/TransferActionAptos.d.ts

@@ -1,8 +1,7 @@
-import React from 'react';
 import { UserBill } from '../../../../types/yourbonds';
 declare const TransferActionAptos: ({ userBill, toAddress, disabled, }: {
     userBill?: UserBill;
     toAddress?: string;
     disabled?: boolean;
-}) => React.JSX.Element;
+}) => import("react/jsx-runtime").JSX.Element;
 export default TransferActionAptos;

package/dist/views/YourBondsModal/components/TransferBondModal/TransferActionAptos.js

@@ -1,4 +1,4 @@
-import { jsx } from 'theme-ui/jsx-runtime';
+import { jsx } from 'react/jsx-runtime';
 import Button from '../../../../components/uikit-sdk/Button/Button.js';
 
 // TODO(APTOS): replace with the real transfer flow — sign a
@@ -11,7 +11,7 @@ userBill,
 toAddress, 
 // eslint-disable-next-line @typescript-eslint/no-unused-vars
 disabled, }) => {
-    return (jsx(Button, { disabled: true, sx: { fontSize: '14px', width: '100%' }, children: "Transfer not yet supported on Aptos" }));
+    return (jsx(Button, { disabled: true, className: "ape:text-[14px] ape:w-full", children: "Transfer not yet supported on Aptos" }));
 };
 
 export { TransferActionAptos as default };

package/dist/views/YourBondsModal/components/TransferBondModal/TransferActionAptos.js.map

@@ -1 +1 @@
-{"version":3,"file":"TransferActionAptos.js","sources":["../../../../../src/views/YourBondsModal/components/TransferBondModal/TransferActionAptos.tsx"],"sourcesContent":["import React from 'react'\nimport { UserBill } from '../../../../types/yourbonds'\nimport Button from '../../../../components/uikit-sdk/Button/Button'\n\n// TODO(APTOS): replace with the real transfer flow — sign a\n// `bond_nft::transfer(market, bill_id, to)` entry function call and refetch\n// user bonds, mirroring the Solana path.\nconst TransferActionAptos = ({\n  // eslint-disable-next-line @typescript-eslint/no-unused-vars\n  userBill,\n  // eslint-disable-next-line @typescript-eslint/no-unused-vars\n  toAddress,\n  // eslint-disable-next-line @typescript-eslint/no-unused-vars\n  disabled,\n}: {\n  userBill?: UserBill\n  toAddress?: string\n  disabled?: boolean\n}) => {\n  return (\n    <Button disabled sx={{ fontSize: '14px', width: '100%' }}>\n      Transfer not yet supported on Aptos\n    </Button>\n  )\n}\n\nexport default TransferActionAptos\n"],"names":["_jsx"],"mappings":";;;AAIA;AACA;AACA;AACA,MAAM,mBAAmB,GAAG,CAAC;AAC3B;AACA,QAAQ;AACR;AACA,SAAS;AACT;AACA,QAAQ,GAKT,KAAI;AACH,IAAA,QACEA,GAAA,CAAC,MAAM,IAAC,QAAQ,EAAA,IAAA,EAAC,EAAE,EAAE,EAAE,QAAQ,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,EAAA,QAAA,EAAA,qCAAA,EAAA,CAE/C;AAEb;;;;"}
+{"version":3,"file":"TransferActionAptos.js","sources":["../../../../../src/views/YourBondsModal/components/TransferBondModal/TransferActionAptos.tsx"],"sourcesContent":["import React from 'react'\nimport { UserBill } from '../../../../types/yourbonds'\nimport Button from '../../../../components/uikit-sdk/Button/Button'\n\n// TODO(APTOS): replace with the real transfer flow — sign a\n// `bond_nft::transfer(market, bill_id, to)` entry function call and refetch\n// user bonds, mirroring the Solana path.\nconst TransferActionAptos = ({\n  // eslint-disable-next-line @typescript-eslint/no-unused-vars\n  userBill,\n  // eslint-disable-next-line @typescript-eslint/no-unused-vars\n  toAddress,\n  // eslint-disable-next-line @typescript-eslint/no-unused-vars\n  disabled,\n}: {\n  userBill?: UserBill\n  toAddress?: string\n  disabled?: boolean\n}) => {\n  return (\n    <Button disabled className=\"ape:text-[14px] ape:w-full\">\n      Transfer not yet supported on Aptos\n    </Button>\n  )\n}\n\nexport default TransferActionAptos\n"],"names":["_jsx"],"mappings":";;;AAIA;AACA;AACA;AACA,MAAM,mBAAmB,GAAG,CAAC;AAC3B;AACA,QAAQ;AACR;AACA,SAAS;AACT;AACA,QAAQ,GAKT,KAAI;IACH,QACEA,GAAA,CAAC,MAAM,EAAA,EAAC,QAAQ,EAAA,IAAA,EAAC,SAAS,EAAC,4BAA4B,EAAA,QAAA,EAAA,qCAAA,EAAA,CAE9C;AAEb;;;;"}

package/dist/views/YourBondsModal/components/TransferBondModal/TransferActionSolana.d.ts

@@ -3,5 +3,5 @@ declare const TransferAction: ({ userBill, toAddress, disabled, }: {
     userBill?: UserBill;
     toAddress?: string;
     disabled?: boolean;
-}) => import("react").JSX.Element;
+}) => import("react/jsx-runtime").JSX.Element;
 export default TransferAction;

package/dist/views/YourBondsModal/components/TransferBondModal/TransferActionSolana.js

@@ -1,4 +1,4 @@
-import { jsx } from 'theme-ui/jsx-runtime';
+import { jsx } from 'react/jsx-runtime';
 import { useState } from 'react';
 import { ChainId } from '@ape.swap/apeswap-lists';
 import { usePopups } from '../../../../state/popups/usePopups.js';

package/dist/views/YourBondsModal/components/TransferBondModal/TransferActionSui.d.ts

@@ -1,9 +1,8 @@
-import React from 'react';
 import { UserBill } from '../../../../types/yourbonds';
 declare const TransferActionSui: ({ userBill, toAddress, disabled, onDismiss, }: {
     userBill?: UserBill;
     toAddress?: string;
     disabled?: boolean;
     onDismiss?: () => void;
-}) => React.JSX.Element;
+}) => import("react/jsx-runtime").JSX.Element;
 export default TransferActionSui;

package/dist/views/YourBondsModal/components/TransferBondModal/TransferActionSui.js

@@ -1,4 +1,4 @@
-import { jsx } from 'theme-ui/jsx-runtime';
+import { jsx } from 'react/jsx-runtime';
 import { useState } from 'react';
 import { Transaction } from '@mysten/sui/transactions';
 import { ChainId } from '@ape.swap/apeswap-lists';

package/dist/views/YourBondsModal/components/TransferBondModal/index.js

@@ -1,4 +1,4 @@
-import { jsxs, jsx } from 'theme-ui/jsx-runtime';
+import { jsxs, jsx } from 'react/jsx-runtime';
 import React, { useState } from 'react';
 import Flex from '../../../../components/uikit-sdk/Flex/index.js';
 import Modal from '../../../../components/uikit-sdk/Modal/index.js';
@@ -23,10 +23,10 @@ const TransferModal = ({ onDismiss, userBill }) => {
     const chainId = bond?.chainId;
     const pending = chainId &&
         getBalanceNumber(userBill?.payout ?? 0, bond?.earnToken?.decimals?.[chainId] ?? 18)?.toFixed(4);
-    return (jsxs(Modal, { onDismiss: onDismiss, title: "Transfer Bond", sx: { width: '450px' }, children: [jsx(Flex, { sx: { mt: '20px' }, children: jsxs(Flex, { sx: { fontWeight: 700, justifyContent: 'space-between', width: '100%' }, children: ["Transferring:", jsxs("span", { sx: { fontSize: '14px', color: 'textDisabledButton', fontWeight: 400 }, children: [bond?.earnToken?.symbol, " Bond # ", userBill?.id] })] }) }), jsx(Flex, { sx: { flexDirection: 'column', alignItems: 'center', mt: '10px', mr: '10px' }, children: jsxs(Flex, { sx: { mt: '5px' }, children: [jsxs(Flex, { sx: { flexDirection: 'column', mr: '20px' }, children: [jsx(Text, { sx: { textAlign: 'center', width: '100%', fontSize: '12px', opacity: 0.6 }, children: "Vesting time" }), getTimeLeftForFullyVested(userBill) > 0 ? `Ends in ${getPendingVestingString(userBill)}` : `Fully Vested`] }), jsxs(Flex, { sx: { flexDirection: 'column', ml: '20px' }, children: [jsx(Text, { sx: { textAlign: 'center', width: '100%', fontSize: '12px', opacity: 0.6 }, children: "Tokens" }), jsxs(Flex, { children: [jsx(TokenImage, { symbol: userBill?.bond?.showcaseTokenName ?? userBill?.bond?.earnToken?.symbol, size: 20, chain: userBill?.bond?.chainId }), jsx(Text, { sx: { fontWeight: 700, ml: '5px' }, children: pending })] })] })] }) }), jsxs(Flex, { sx: { flexDirection: 'column', mt: '30px' }, children: [jsx(Text, { sx: { fontWeight: 700 }, children: "Receiving Address:" }), jsx(Input, { mt: "10px", size: "lg", placeholder: 'Paste the address here', value: toAddress, onChange: (e) => setToAddress(e.target.value), style: { width: '100%', border: 'none' } })] }), jsx(Flex, { sx: { width: '100%', fontWeight: 700, fontSize: '13px', color: 'error', mt: '15px', ml: '30px' }, children: "WARNING" }), jsxs(Flex, { onClick: () => setConfirmSend(!confirmSend), sx: { cursor: 'pointer', alignItems: 'center' }, children: [jsx(Checkbox, { checked: confirmSend, onChange: (event) => {
+    return (jsxs(Modal, { onDismiss: onDismiss, title: "Transfer Bond", className: "ape:w-[450px]", children: [jsx(Flex, { className: "ape:mt-[20px]", children: jsxs(Flex, { className: "ape:font-bold ape:justify-between ape:w-full", children: ["Transferring:", jsxs("span", { className: "ape:text-[14px] ape:font-normal", style: { color: 'var(--ape-color-text-disabled-button)' }, children: [bond?.earnToken?.symbol, " Bond # ", userBill?.id] })] }) }), jsx(Flex, { className: "ape:flex-col ape:items-center ape:mt-[10px] ape:mr-[10px]", children: jsxs(Flex, { className: "ape:mt-[5px]", children: [jsxs(Flex, { className: "ape:flex-col ape:mr-[20px]", children: [jsx(Text, { className: "ape:text-center ape:w-full ape:opacity-60", size: "12px", children: "Vesting time" }), getTimeLeftForFullyVested(userBill) > 0 ? `Ends in ${getPendingVestingString(userBill)}` : `Fully Vested`] }), jsxs(Flex, { className: "ape:flex-col ape:ml-[20px]", children: [jsx(Text, { className: "ape:text-center ape:w-full ape:opacity-60", size: "12px", children: "Tokens" }), jsxs(Flex, { children: [jsx(TokenImage, { symbol: userBill?.bond?.showcaseTokenName ?? userBill?.bond?.earnToken?.symbol, size: 20, chain: userBill?.bond?.chainId }), jsx(Text, { weight: 700, className: "ape:ml-[5px]", children: pending })] })] })] }) }), jsxs(Flex, { className: "ape:flex-col ape:mt-[30px]", children: [jsx(Text, { weight: 700, children: "Receiving Address:" }), jsx(Input, { mt: "10px", size: "lg", placeholder: 'Paste the address here', value: toAddress, onChange: (e) => setToAddress(e.target.value), style: { width: '100%', border: 'none' } })] }), jsx(Flex, { className: "ape:w-full ape:font-bold ape:text-[13px] ape:mt-[15px] ape:ml-[30px]", style: { color: 'var(--ape-color-error)' }, children: "WARNING" }), jsxs(Flex, { onClick: () => setConfirmSend(!confirmSend), className: "ape:cursor-pointer ape:items-center", children: [jsx(Checkbox, { checked: confirmSend, onChange: (event) => {
                             setConfirmSend(!confirmSend);
                             event.stopPropagation();
-                        } }), jsx(Text, { sx: { ml: '10px', fontSize: '12px', fontWeight: 500, lineHeight: '18px', color: 'error' }, children: "I understand the new wallet gains ownership of all unclaimed assets." })] }), jsx(Flex, { sx: { justifyContent: 'center', mt: '15px' }, children: chainId === ChainId.SOL ? (jsx(TransferAction, { userBill: userBill, toAddress: toAddress, disabled: !confirmSend || !toAddress })) : chainId === ChainId.APTOS ? (jsx(TransferActionAptos, { userBill: userBill, toAddress: toAddress, disabled: !confirmSend || !toAddress })) : chainId === ChainId.SUI ? (jsx(TransferActionSui, { userBill: userBill, toAddress: toAddress, disabled: !confirmSend || !toAddress, onDismiss: onDismiss })) : (jsx(TransferAction$1, { userBill: userBill, toAddress: toAddress, disabled: !confirmSend || !toAddress })) })] }));
+                        } }), jsx(Text, { className: "ape:ml-[10px] ape:text-[12px] ape:font-medium", style: { lineHeight: '18px', color: 'var(--ape-color-error)' }, children: "I understand the new wallet gains ownership of all unclaimed assets." })] }), jsx(Flex, { className: "ape:justify-center ape:mt-[15px]", children: chainId === ChainId.SOL ? (jsx(TransferAction, { userBill: userBill, toAddress: toAddress, disabled: !confirmSend || !toAddress })) : chainId === ChainId.APTOS ? (jsx(TransferActionAptos, { userBill: userBill, toAddress: toAddress, disabled: !confirmSend || !toAddress })) : chainId === ChainId.SUI ? (jsx(TransferActionSui, { userBill: userBill, toAddress: toAddress, disabled: !confirmSend || !toAddress, onDismiss: onDismiss })) : (jsx(TransferAction$1, { userBill: userBill, toAddress: toAddress, disabled: !confirmSend || !toAddress })) })] }));
 };
 var TransferBondModal = React.memo(TransferModal);
 

package/dist/views/YourBondsModal/components/TransferBondModal/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../src/views/YourBondsModal/components/TransferBondModal/index.tsx"],"sourcesContent":["import React, { useState } from 'react'\nimport Flex from '../../../../components/uikit-sdk/Flex'\nimport Modal from '../../../../components/uikit-sdk/Modal'\nimport Text from '../../../../components/uikit-sdk/Text'\nimport Checkbox from '../../../../components/uikit-sdk/Checkbox'\nimport { UserBill } from '../../../../types/yourbonds'\nimport { getBalanceNumber } from '../../../../utils/getBalanceNumber'\nimport { ChainId } from '@ape.swap/apeswap-lists'\nimport TokenImage from '../../../../components/uikit-sdk/TokenImage'\nimport Input from '../../../../components/uikit-sdk/Input/Input'\nimport TransferAction from './TransferAction'\nimport { getPendingVestingString, getTimeLeftForFullyVested } from '../../../../utils/displayHelpers'\nimport TransferActionSolana from './TransferActionSolana'\nimport TransferActionAptos from './TransferActionAptos'\nimport TransferActionSui from './TransferActionSui'\n\ninterface TransferBillModalProps {\n  onDismiss?: () => void\n  userBill?: UserBill\n}\n\nconst TransferModal: React.FC<TransferBillModalProps> = ({ onDismiss, userBill }) => {\n  // State\n  const [confirmSend, setConfirmSend] = useState(false)\n  const [toAddress, setToAddress] = useState('')\n\n  // Data\n  const bond = userBill?.bond\n  const chainId = bond?.chainId\n  const pending =\n    chainId &&\n    getBalanceNumber(userBill?.payout ?? 0, bond?.earnToken?.decimals?.[chainId as ChainId] ?? 18)?.toFixed(4)\n\n  return (\n    <Modal onDismiss={onDismiss} title=\"Transfer Bond\" sx={{ width: '450px' }}>\n      <Flex sx={{ mt: '20px' }}>\n        <Flex sx={{ fontWeight: 700, justifyContent: 'space-between', width: '100%' }}>\n          Transferring:\n          <span sx={{ fontSize: '14px', color: 'textDisabledButton', fontWeight: 400 }}>\n            {bond?.earnToken?.symbol} Bond # {userBill?.id}\n          </span>\n        </Flex>\n      </Flex>\n      <Flex sx={{ flexDirection: 'column', alignItems: 'center', mt: '10px', mr: '10px' }}>\n        <Flex sx={{ mt: '5px' }}>\n          <Flex sx={{ flexDirection: 'column', mr: '20px' }}>\n            <Text sx={{ textAlign: 'center', width: '100%', fontSize: '12px', opacity: 0.6 }}>Vesting time</Text>\n            {getTimeLeftForFullyVested(userBill) > 0 ? `Ends in ${getPendingVestingString(userBill)}` : `Fully Vested`}\n          </Flex>\n          <Flex sx={{ flexDirection: 'column', ml: '20px' }}>\n            <Text sx={{ textAlign: 'center', width: '100%', fontSize: '12px', opacity: 0.6 }}>Tokens</Text>\n            <Flex>\n              <TokenImage\n                symbol={userBill?.bond?.showcaseTokenName ?? userBill?.bond?.earnToken?.symbol}\n                size={20}\n                chain={userBill?.bond?.chainId}\n              />\n              <Text sx={{ fontWeight: 700, ml: '5px' }}>{pending}</Text>\n            </Flex>\n          </Flex>\n        </Flex>\n      </Flex>\n      <Flex sx={{ flexDirection: 'column', mt: '30px' }}>\n        <Text sx={{ fontWeight: 700 }}>Receiving Address:</Text>\n        <Input\n          mt=\"10px\"\n          size=\"lg\"\n          placeholder={'Paste the address here'}\n          value={toAddress}\n          onChange={(e: any) => setToAddress(e.target.value)}\n          style={{ width: '100%', border: 'none' }}\n        />\n      </Flex>\n      <Flex sx={{ width: '100%', fontWeight: 700, fontSize: '13px', color: 'error', mt: '15px', ml: '30px' }}>\n        WARNING\n      </Flex>\n      <Flex onClick={() => setConfirmSend(!confirmSend)} sx={{ cursor: 'pointer', alignItems: 'center' }}>\n        <Checkbox\n          checked={confirmSend}\n          onChange={(event: React.MouseEvent) => {\n            setConfirmSend(!confirmSend)\n            event.stopPropagation()\n          }}\n        />\n        <Text sx={{ ml: '10px', fontSize: '12px', fontWeight: 500, lineHeight: '18px', color: 'error' }}>\n          I understand the new wallet gains ownership of all unclaimed assets.\n        </Text>\n      </Flex>\n      <Flex sx={{ justifyContent: 'center', mt: '15px' }}>\n        {chainId === ChainId.SOL ? (\n          <TransferActionSolana userBill={userBill} toAddress={toAddress} disabled={!confirmSend || !toAddress} />\n        ) : chainId === ChainId.APTOS ? (\n          <TransferActionAptos userBill={userBill} toAddress={toAddress} disabled={!confirmSend || !toAddress} />\n        ) : chainId === ChainId.SUI ? (\n          <TransferActionSui\n            userBill={userBill}\n            toAddress={toAddress}\n            disabled={!confirmSend || !toAddress}\n            onDismiss={onDismiss}\n          />\n        ) : (\n          <TransferAction userBill={userBill} toAddress={toAddress} disabled={!confirmSend || !toAddress} />\n        )}\n      </Flex>\n    </Modal>\n  )\n}\n\nexport default React.memo(TransferModal)\n"],"names":["_jsxs","_jsx","TransferActionSolana","TransferAction"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../../../../src/views/YourBondsModal/components/TransferBondModal/index.tsx"],"sourcesContent":["import React, { useState } from 'react'\nimport Flex from '../../../../components/uikit-sdk/Flex'\nimport Modal from '../../../../components/uikit-sdk/Modal'\nimport Text from '../../../../components/uikit-sdk/Text'\nimport Checkbox from '../../../../components/uikit-sdk/Checkbox'\nimport { UserBill } from '../../../../types/yourbonds'\nimport { getBalanceNumber } from '../../../../utils/getBalanceNumber'\nimport { ChainId } from '@ape.swap/apeswap-lists'\nimport TokenImage from '../../../../components/uikit-sdk/TokenImage'\nimport Input from '../../../../components/uikit-sdk/Input/Input'\nimport TransferAction from './TransferAction'\nimport { getPendingVestingString, getTimeLeftForFullyVested } from '../../../../utils/displayHelpers'\nimport TransferActionSolana from './TransferActionSolana'\nimport TransferActionAptos from './TransferActionAptos'\nimport TransferActionSui from './TransferActionSui'\n\ninterface TransferBillModalProps {\n  onDismiss?: () => void\n  userBill?: UserBill\n}\n\nconst TransferModal: React.FC<TransferBillModalProps> = ({ onDismiss, userBill }) => {\n  // State\n  const [confirmSend, setConfirmSend] = useState(false)\n  const [toAddress, setToAddress] = useState('')\n\n  // Data\n  const bond = userBill?.bond\n  const chainId = bond?.chainId\n  const pending =\n    chainId &&\n    getBalanceNumber(userBill?.payout ?? 0, bond?.earnToken?.decimals?.[chainId as ChainId] ?? 18)?.toFixed(4)\n\n  return (\n    <Modal onDismiss={onDismiss} title=\"Transfer Bond\" className=\"ape:w-[450px]\">\n      <Flex className=\"ape:mt-[20px]\">\n        <Flex className=\"ape:font-bold ape:justify-between ape:w-full\">\n          Transferring:\n          <span className=\"ape:text-[14px] ape:font-normal\" style={{ color: 'var(--ape-color-text-disabled-button)' }}>\n            {bond?.earnToken?.symbol} Bond # {userBill?.id}\n          </span>\n        </Flex>\n      </Flex>\n      <Flex className=\"ape:flex-col ape:items-center ape:mt-[10px] ape:mr-[10px]\">\n        <Flex className=\"ape:mt-[5px]\">\n          <Flex className=\"ape:flex-col ape:mr-[20px]\">\n            <Text className=\"ape:text-center ape:w-full ape:opacity-60\" size=\"12px\">Vesting time</Text>\n            {getTimeLeftForFullyVested(userBill) > 0 ? `Ends in ${getPendingVestingString(userBill)}` : `Fully Vested`}\n          </Flex>\n          <Flex className=\"ape:flex-col ape:ml-[20px]\">\n            <Text className=\"ape:text-center ape:w-full ape:opacity-60\" size=\"12px\">Tokens</Text>\n            <Flex>\n              <TokenImage\n                symbol={userBill?.bond?.showcaseTokenName ?? userBill?.bond?.earnToken?.symbol}\n                size={20}\n                chain={userBill?.bond?.chainId}\n              />\n              <Text weight={700} className=\"ape:ml-[5px]\">{pending}</Text>\n            </Flex>\n          </Flex>\n        </Flex>\n      </Flex>\n      <Flex className=\"ape:flex-col ape:mt-[30px]\">\n        <Text weight={700}>Receiving Address:</Text>\n        <Input\n          mt=\"10px\"\n          size=\"lg\"\n          placeholder={'Paste the address here'}\n          value={toAddress}\n          onChange={(e: any) => setToAddress(e.target.value)}\n          style={{ width: '100%', border: 'none' }}\n        />\n      </Flex>\n      <Flex\n        className=\"ape:w-full ape:font-bold ape:text-[13px] ape:mt-[15px] ape:ml-[30px]\"\n        style={{ color: 'var(--ape-color-error)' }}\n      >\n        WARNING\n      </Flex>\n      <Flex onClick={() => setConfirmSend(!confirmSend)} className=\"ape:cursor-pointer ape:items-center\">\n        <Checkbox\n          checked={confirmSend}\n          onChange={(event: React.MouseEvent) => {\n            setConfirmSend(!confirmSend)\n            event.stopPropagation()\n          }}\n        />\n        <Text\n          className=\"ape:ml-[10px] ape:text-[12px] ape:font-medium\"\n          style={{ lineHeight: '18px', color: 'var(--ape-color-error)' }}\n        >\n          I understand the new wallet gains ownership of all unclaimed assets.\n        </Text>\n      </Flex>\n      <Flex className=\"ape:justify-center ape:mt-[15px]\">\n        {chainId === ChainId.SOL ? (\n          <TransferActionSolana userBill={userBill} toAddress={toAddress} disabled={!confirmSend || !toAddress} />\n        ) : chainId === ChainId.APTOS ? (\n          <TransferActionAptos userBill={userBill} toAddress={toAddress} disabled={!confirmSend || !toAddress} />\n        ) : chainId === ChainId.SUI ? (\n          <TransferActionSui\n            userBill={userBill}\n            toAddress={toAddress}\n            disabled={!confirmSend || !toAddress}\n            onDismiss={onDismiss}\n          />\n        ) : (\n          <TransferAction userBill={userBill} toAddress={toAddress} disabled={!confirmSend || !toAddress} />\n        )}\n      </Flex>\n    </Modal>\n  )\n}\n\nexport default React.memo(TransferModal)\n"],"names":["_jsxs","_jsx","TransferActionSolana","TransferAction"],"mappings":"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"}

package/dist/views/YourBondsModal/components/YourBondModalHeader/YourBondModalHeader.d.ts

@@ -1,7 +1,6 @@
-import React from 'react';
 import { UserBill } from '../../../../types/yourbonds';
 declare const YourBondModalHeader: ({ userBill, onDismiss }: {
     userBill?: UserBill;
     onDismiss?: () => void;
-}) => React.JSX.Element;
+}) => import("react/jsx-runtime").JSX.Element;
 export default YourBondModalHeader;

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

@@ -1,7 +1,6 @@
-import { jsx, jsxs, Fragment } from 'theme-ui/jsx-runtime';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import TokenImage from '../../../../components/uikit-sdk/TokenImage/index.js';
 import { useIsMobile } from '../../../../hooks/useIsMobile.js';
-import { Box } from 'theme-ui';
 import ProfitCard from '../../../YourBonds/components/ProfitCard/ProfitCard.js';
 import useModal from '../../../../hooks/useModal.js';
 import TransferBondModal from '../TransferBondModal/index.js';
@@ -18,28 +17,7 @@ const YourBondModalHeader = ({ userBill, onDismiss }) => {
     const payoutTokenSymbol = userBill?.bond?.showcaseTokenName ?? userBill?.bond?.earnToken.symbol;
     // Modals
     const [onTransferBondModal] = useModal(jsx(TransferBondModal, { userBill: userBill }), true, true, `transferModal${userBill?.id}}`);
-    return (jsxs(Flex, { sx: { width: '100%', justifyContent: 'space-between', alignItems: 'center' }, children: [jsxs(Flex, { sx: { alignItems: 'center', gap: '7px' }, children: [payoutTokenSymbol ? (jsxs(Fragment, { children: [jsx(TokenImage, { symbol: payoutTokenSymbol, size: 30, chain: userBill?.bond?.chainId }), jsx(Box, { sx: {
-                                    fontSize: ['16px', '16px', '16px', '18px'],
-                                    fontWeight: 700,
-                                    opacity: 0.7,
-                                    overflow: 'hidden',
-                                    whiteSpace: 'nowrap',
-                                    textOverflow: 'ellipsis',
-                                    maxWidth: '100px',
-                                }, children: payoutTokenSymbol })] })) : (jsxs(Fragment, { children: [jsx(Skeleton, { animation: "waves", sx: {
-                                    width: '30px',
-                                    height: '30px',
-                                    borderRadius: '55px',
-                                    mr: '10px',
-                                } }), jsx(Skeleton, { animation: "waves", sx: {
-                                    width: '100px',
-                                    borderRadius: 'normal',
-                                } })] })), jsx(ProfitCard, { userBond: userBill }), jsx(Text, { sx: {
-                            color: 'text',
-                            opacity: '0.6',
-                            fontSize: ['11px', '11px', '11px', '14px'],
-                            display: ['none', 'none', 'none', 'flex'],
-                        }, children: userBill?.id && `#${userBill.id}` })] }), jsxs(Flex, { sx: { gap: '7px' }, children: [jsx(Button, { onClick: onTransferBondModal, disabled: !userBill, sx: { height: '22px', fontSize: '12px', fontWeight: 600, p: '2px 6px' }, children: "TRANSFER" }), jsx(Flex, { className: "svg-close", onClick: onDismiss, sx: { cursor: 'pointer', p: '2px 5px' }, children: jsx(Close, { width: isMobile ? '12px' : '18px' }) })] })] }));
+    return (jsxs(Flex, { className: "ape:w-full ape:justify-between ape:items-center", children: [jsxs(Flex, { className: "ape:items-center ape:gap-[7px]", children: [payoutTokenSymbol ? (jsxs(Fragment, { children: [jsx(TokenImage, { symbol: payoutTokenSymbol, size: 30, chain: userBill?.bond?.chainId }), jsx("div", { className: "ape:text-[16px] ape:md:text-[18px] ape:font-bold ape:opacity-70 ape:overflow-hidden ape:whitespace-nowrap ape:text-ellipsis ape:max-w-[100px]", children: payoutTokenSymbol })] })) : (jsxs(Fragment, { children: [jsx(Skeleton, { animation: "waves", style: { width: '30px', height: '30px', borderRadius: '55px', marginRight: '10px' } }), jsx(Skeleton, { animation: "waves", style: { width: '100px', borderRadius: 'var(--ape-radius-normal)' } })] })), jsx(ProfitCard, { userBond: userBill }), jsx(Text, { className: "ape:opacity-60 ape:text-[11px] ape:md:text-[14px] ape:hidden ape:md:flex", children: userBill?.id && `#${userBill.id}` })] }), jsxs(Flex, { className: "ape:gap-[7px]", children: [jsx(Button, { onClick: onTransferBondModal, disabled: !userBill, className: "ape:h-[22px] ape:text-[12px]! ape:font-semibold ape:p-[2px_6px]", children: "TRANSFER" }), jsx(Flex, { className: "svg-close ape:cursor-pointer ape:p-[2px_5px]", onClick: onDismiss, children: jsx(Close, { width: isMobile ? '12px' : '18px' }) })] })] }));
 };
 
 export { YourBondModalHeader as default };

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

@@ -1 +1 @@
-{"version":3,"file":"YourBondModalHeader.js","sources":["../../../../../src/views/YourBondsModal/components/YourBondModalHeader/YourBondModalHeader.tsx"],"sourcesContent":["import React from 'react'\nimport TokenImage from '../../../../components/uikit-sdk/TokenImage'\nimport { UserBill } from '../../../../types/yourbonds'\nimport { useIsMobile } from '../../../../hooks/useIsMobile'\nimport { Box } from 'theme-ui'\nimport ProfitCard from '../../../YourBonds/components/ProfitCard/ProfitCard'\nimport useModal from '../../../../hooks/useModal'\nimport TransferBondModal from '../TransferBondModal'\nimport Flex from '../../../../components/uikit-sdk/Flex'\nimport Skeleton from '../../../../components/uikit-sdk/Skeleton'\nimport Button from '../../../../components/uikit-sdk/Button/Button'\nimport Text from '../../../../components/uikit-sdk/Text'\nimport Close from '../../../../components/uikit-sdk/Svg/Icons/Close'\n\nconst YourBondModalHeader = ({ userBill, onDismiss }: { userBill?: UserBill; onDismiss?: () => void }) => {\n  // Hooks\n  const isMobile = useIsMobile()\n\n  // Static Data\n  const payoutTokenSymbol = userBill?.bond?.showcaseTokenName ?? userBill?.bond?.earnToken.symbol\n\n  // Modals\n  const [onTransferBondModal] = useModal(\n    <TransferBondModal userBill={userBill} />,\n    true,\n    true,\n    `transferModal${userBill?.id}}`,\n  )\n\n  return (\n    <Flex sx={{ width: '100%', justifyContent: 'space-between', alignItems: 'center' }}>\n      <Flex sx={{ alignItems: 'center', gap: '7px' }}>\n        {payoutTokenSymbol ? (\n          <>\n            <TokenImage symbol={payoutTokenSymbol} size={30} chain={userBill?.bond?.chainId} />\n            <Box\n              sx={{\n                fontSize: ['16px', '16px', '16px', '18px'],\n                fontWeight: 700,\n                opacity: 0.7,\n                overflow: 'hidden',\n                whiteSpace: 'nowrap',\n                textOverflow: 'ellipsis',\n                maxWidth: '100px',\n              }}\n            >\n              {payoutTokenSymbol}\n            </Box>\n          </>\n        ) : (\n          <>\n            <Skeleton\n              animation=\"waves\"\n              sx={{\n                width: '30px',\n                height: '30px',\n                borderRadius: '55px',\n                mr: '10px',\n              }}\n            />\n            <Skeleton\n              animation=\"waves\"\n              sx={{\n                width: '100px',\n                borderRadius: 'normal',\n              }}\n            />\n          </>\n        )}\n        <ProfitCard userBond={userBill} />\n        <Text\n          sx={{\n            color: 'text',\n            opacity: '0.6',\n            fontSize: ['11px', '11px', '11px', '14px'],\n            display: ['none', 'none', 'none', 'flex'],\n          }}\n        >\n          {userBill?.id && `#${userBill.id}`}\n        </Text>\n      </Flex>\n      <Flex sx={{ gap: '7px' }}>\n        <Button\n          onClick={onTransferBondModal}\n          disabled={!userBill}\n          sx={{ height: '22px', fontSize: '12px', fontWeight: 600, p: '2px 6px' }}\n        >\n          TRANSFER\n        </Button>\n        <Flex className=\"svg-close\" onClick={onDismiss} sx={{ cursor: 'pointer', p: '2px 5px' }}>\n          <Close width={isMobile ? '12px' : '18px'} />\n        </Flex>\n      </Flex>\n    </Flex>\n  )\n}\n\nexport default YourBondModalHeader\n"],"names":["_jsx","_jsxs","_Fragment"],"mappings":"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"}
+{"version":3,"file":"YourBondModalHeader.js","sources":["../../../../../src/views/YourBondsModal/components/YourBondModalHeader/YourBondModalHeader.tsx"],"sourcesContent":["import React from 'react'\nimport TokenImage from '../../../../components/uikit-sdk/TokenImage'\nimport { UserBill } from '../../../../types/yourbonds'\nimport { useIsMobile } from '../../../../hooks/useIsMobile'\nimport ProfitCard from '../../../YourBonds/components/ProfitCard/ProfitCard'\nimport useModal from '../../../../hooks/useModal'\nimport TransferBondModal from '../TransferBondModal'\nimport Flex from '../../../../components/uikit-sdk/Flex'\nimport Skeleton from '../../../../components/uikit-sdk/Skeleton'\nimport Button from '../../../../components/uikit-sdk/Button/Button'\nimport Text from '../../../../components/uikit-sdk/Text'\nimport Close from '../../../../components/uikit-sdk/Svg/Icons/Close'\n\nconst YourBondModalHeader = ({ userBill, onDismiss }: { userBill?: UserBill; onDismiss?: () => void }) => {\n  // Hooks\n  const isMobile = useIsMobile()\n\n  // Static Data\n  const payoutTokenSymbol = userBill?.bond?.showcaseTokenName ?? userBill?.bond?.earnToken.symbol\n\n  // Modals\n  const [onTransferBondModal] = useModal(\n    <TransferBondModal userBill={userBill} />,\n    true,\n    true,\n    `transferModal${userBill?.id}}`,\n  )\n\n  return (\n    <Flex className=\"ape:w-full ape:justify-between ape:items-center\">\n      <Flex className=\"ape:items-center ape:gap-[7px]\">\n        {payoutTokenSymbol ? (\n          <>\n            <TokenImage symbol={payoutTokenSymbol} size={30} chain={userBill?.bond?.chainId} />\n            <div className=\"ape:text-[16px] ape:md:text-[18px] ape:font-bold ape:opacity-70 ape:overflow-hidden ape:whitespace-nowrap ape:text-ellipsis ape:max-w-[100px]\">\n              {payoutTokenSymbol}\n            </div>\n          </>\n        ) : (\n          <>\n            <Skeleton animation=\"waves\" style={{ width: '30px', height: '30px', borderRadius: '55px', marginRight: '10px' }} />\n            <Skeleton animation=\"waves\" style={{ width: '100px', borderRadius: 'var(--ape-radius-normal)' }} />\n          </>\n        )}\n        <ProfitCard userBond={userBill} />\n        <Text\n          className=\"ape:opacity-60 ape:text-[11px] ape:md:text-[14px] ape:hidden ape:md:flex\"\n        >\n          {userBill?.id && `#${userBill.id}`}\n        </Text>\n      </Flex>\n      <Flex className=\"ape:gap-[7px]\">\n        <Button\n          onClick={onTransferBondModal}\n          disabled={!userBill}\n          className=\"ape:h-[22px] ape:text-[12px]! ape:font-semibold ape:p-[2px_6px]\"\n        >\n          TRANSFER\n        </Button>\n        <Flex className=\"svg-close ape:cursor-pointer ape:p-[2px_5px]\" onClick={onDismiss}>\n          <Close width={isMobile ? '12px' : '18px'} />\n        </Flex>\n      </Flex>\n    </Flex>\n  )\n}\n\nexport default YourBondModalHeader\n"],"names":["_jsx","_jsxs","_Fragment"],"mappings":";;;;;;;;;;;;AAaA,MAAM,mBAAmB,GAAG,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAmD,KAAI;;AAEvG,IAAA,MAAM,QAAQ,GAAG,WAAW,EAAE;;AAG9B,IAAA,MAAM,iBAAiB,GAAG,QAAQ,EAAE,IAAI,EAAE,iBAAiB,IAAI,QAAQ,EAAE,IAAI,EAAE,SAAS,CAAC,MAAM;;IAG/F,MAAM,CAAC,mBAAmB,CAAC,GAAG,QAAQ,CACpCA,GAAA,CAAC,iBAAiB,EAAA,EAAC,QAAQ,EAAE,QAAQ,GAAI,EACzC,IAAI,EACJ,IAAI,EACJ,CAAA,aAAA,EAAgB,QAAQ,EAAE,EAAE,CAAA,CAAA,CAAG,CAChC;AAED,IAAA,QACEC,IAAA,CAAC,IAAI,IAAC,SAAS,EAAC,iDAAiD,EAAA,QAAA,EAAA,CAC/DA,IAAA,CAAC,IAAI,EAAA,EAAC,SAAS,EAAC,gCAAgC,EAAA,QAAA,EAAA,CAC7C,iBAAiB,IAChBA,IAAA,CAAAC,QAAA,EAAA,EAAA,QAAA,EAAA,CACEF,IAAC,UAAU,EAAA,EAAC,MAAM,EAAE,iBAAiB,EAAE,IAAI,EAAE,EAAE,EAAE,KAAK,EAAE,QAAQ,EAAE,IAAI,EAAE,OAAO,GAAI,EACnFA,GAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,+IAA+I,YAC3J,iBAAiB,EAAA,CACd,IACL,KAEHC,4BACED,GAAA,CAAC,QAAQ,IAAC,SAAS,EAAC,OAAO,EAAC,KAAK,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,YAAY,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,EAAE,GAAI,EACnHA,GAAA,CAAC,QAAQ,EAAA,EAAC,SAAS,EAAC,OAAO,EAAC,KAAK,EAAE,EAAE,KAAK,EAAE,OAAO,EAAE,YAAY,EAAE,0BAA0B,EAAE,GAAI,CAAA,EAAA,CAClG,CACJ,EACDA,GAAA,CAAC,UAAU,IAAC,QAAQ,EAAE,QAAQ,EAAA,CAAI,EAClCA,IAAC,IAAI,EAAA,EACH,SAAS,EAAC,0EAA0E,YAEnF,QAAQ,EAAE,EAAE,IAAI,CAAA,CAAA,EAAI,QAAQ,CAAC,EAAE,EAAE,EAAA,CAC7B,CAAA,EAAA,CACF,EACPC,IAAA,CAAC,IAAI,IAAC,SAAS,EAAC,eAAe,EAAA,QAAA,EAAA,CAC7BD,GAAA,CAAC,MAAM,EAAA,EACL,OAAO,EAAE,mBAAmB,EAC5B,QAAQ,EAAE,CAAC,QAAQ,EACnB,SAAS,EAAC,iEAAiE,EAAA,QAAA,EAAA,UAAA,EAAA,CAGpE,EACTA,GAAA,CAAC,IAAI,IAAC,SAAS,EAAC,8CAA8C,EAAC,OAAO,EAAE,SAAS,EAAA,QAAA,EAC/EA,IAAC,KAAK,EAAA,EAAC,KAAK,EAAE,QAAQ,GAAG,MAAM,GAAG,MAAM,EAAA,CAAI,GACvC,CAAA,EAAA,CACF,CAAA,EAAA,CACF;AAEX;;;;"}

package/dist/views/YourBondsModalYield/YourBondsModalYield.d.ts

@@ -1,7 +1,6 @@
-import React from 'react';
 import { PreTGEUserBonds } from '../../state/bonds/useUserBondsPreTGE';
 declare const YourBondsModalYield: ({ userBill, onDismiss }: {
     userBill?: PreTGEUserBonds;
     onDismiss?: () => void;
-}) => React.JSX.Element;
+}) => import("react/jsx-runtime").JSX.Element;
 export default YourBondsModalYield;

package/dist/views/YourBondsModalYield/YourBondsModalYield.js

@@ -1,4 +1,4 @@
-import { jsx, jsxs, Fragment } from 'theme-ui/jsx-runtime';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { useState, useCallback, useEffect } from 'react';
 import TokenImage from '../../components/uikit-sdk/TokenImage/index.js';
 import { formatNumberSI } from '../../utils/formatNumber.js';
@@ -128,77 +128,7 @@ const YourBondsModalYield = ({ userBill, onDismiss }) => {
             refetch();
         }
     }, [isSuccess, refetch]);
-    return (jsx(Modal, { sx: {
-            width: '400px',
-            overflowY: 'unset !important',
-            background: 'white2',
-            p: '0px',
-            top: '56%',
-        }, onDismiss: onDismiss, children: jsx(Flex, { sx: {
-                flexDirection: 'column',
-                borderRadius: 'normal',
-                position: 'relative',
-                background: 'white2',
-                p: '20px',
-            }, children: jsxs(Flex, { sx: { flexDirection: 'column' }, children: [jsx(YourBondModalHeader, { userBill: userBill, onDismiss: onDismiss }), jsxs(Flex, { sx: { mt: '10px', flexDirection: 'column', gap: '10px' }, children: [jsxs(Flex, { sx: { width: '100%', gap: '15px', position: 'relative' }, children: [jsxs(Flex, { sx: {
-                                            background: 'white3',
-                                            borderRadius: 'normal',
-                                            justifyContent: 'space-between',
-                                            p: '10px',
-                                            width: '65%',
-                                            alignItems: 'center',
-                                            fontSize: '14px',
-                                        }, children: [jsx(Flex, { children: "Deposit" }), jsx(Flex, { sx: { alignItems: 'center', gap: '5px' }, children: saleFinalized && hasRedeemed ? (jsxs(Fragment, { children: [jsx(TokenImage, { symbol: userBill?.underlyingEarnToken?.symbol, size: 18 }), formatNumberSI(depositedAssets), jsxs("span", { sx: { color: 'textDisabledButton', fontSize: '12px' }, children: ["($", formatNumberSI(depositedAssetsUSD), ")"] })] })) : (jsxs(Fragment, { children: [jsx(TokenImage, { symbol: userBill?.lpToken.symbol, size: 18 }), formatNumberSI(depositUSD)] })) })] }), jsx(Flex, { sx: { position: 'absolute', top: '50%', left: '65%', transform: 'translateY(-50%) translateX(-50%)' }, children: jsx(Arrow, { direction: "right", width: '5px' }) }), jsxs(Flex, { sx: {
-                                            background: 'white3',
-                                            borderRadius: 'normal',
-                                            justifyContent: 'space-between',
-                                            p: '10px',
-                                            width: '34%',
-                                            alignItems: 'center',
-                                            fontSize: '14px',
-                                        }, children: [jsx(Flex, { children: "APR" }), jsxs(Flex, { sx: { color: 'success', fontWeight: 700 }, children: [userBill?.yieldData?.apr?.toFixed(), "%"] })] })] }), jsxs(Flex, { sx: {
-                                    flexDirection: 'column',
-                                    fontSize: '12px',
-                                    fontWeight: 400,
-                                }, children: [jsx(Flex, { sx: {
-                                            width: '100%',
-                                            justifyContent: 'space-between',
-                                            alignItems: 'center',
-                                            p: '4px 10px',
-                                            background: 'white4',
-                                            height: '26px',
-                                            borderRadius: '10px 10px 0 0',
-                                        }, children: hasRedeemed ? (jsxs(Fragment, { children: [jsxs(Flex, { sx: { alignItems: 'center', gap: '5px' }, children: [jsx(Flex, { sx: { opacity: 0.6 }, children: "Vault Ends" }), jsx(TooltipBubble, { className: "tooltip-bubble", body: jsx(Flex, { children: "This is the date when reward distribution finishes." }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, 0%)", children: jsx(Flex, { className: "block-header icon", children: jsx(QuestionCircle, { width: "12px", color: 'textDisabledButton' }) }) })] }), jsx(Flex, { sx: { alignItems: 'center' }, children: formatUTCDate(new Date((userBill?.yieldData?.rewardDistributionEnd ?? 0) * 1000)) })] })) : (jsxs(Fragment, { children: [jsxs(Flex, { sx: { alignItems: 'center', gap: '5px' }, children: [jsx(Flex, { sx: { opacity: 0.6 }, children: "Yield starts in" }), jsx(TooltipBubble, { className: "tooltip-bubble", body: jsx(Flex, { children: "Time left for the vault to start accruing rewards." }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, 0%)", children: jsx(Flex, { className: "block-header icon", children: jsx(QuestionCircle, { width: "12px", color: 'textDisabledButton' }) }) })] }), endTimeFinished && !canRedeem ? ('Soon...') : canRedeem ? ('Activate Yield') : (jsxs(Flex, { sx: { alignItems: 'center', gap: '5px' }, children: [redeemableInLong, jsx(TooltipBubble, { className: "tooltip-bubble", body: jsxs(Flex, { onClick: () => setUseLocal(!useLocal), sx: { cursor: 'pointer' }, children: ["Claimable at", ' ', formatUTCDate(new Date((userBill?.redeemTime ?? 0) * 1000), false, useLocal), ' ', useLocal ? 'Local' : 'UTC'] }), width: "230px", placement: "bottomRight", transformTip: "translate(10%, 0%)", children: jsx(Flex, { className: "block-header icon", children: jsx(QuestionCircle, { width: "12px", color: 'textDisabledButton' }) }) })] }))] })) }), jsxs(Flex, { sx: {
-                                            width: '100%',
-                                            justifyContent: 'space-between',
-                                            alignItems: 'center',
-                                            p: '4px 10px',
-                                            background: 'white3',
-                                            height: '26px',
-                                        }, children: [jsxs(Flex, { sx: { alignItems: 'center', gap: '5px' }, children: [jsx(Flex, { sx: { opacity: 0.6 }, children: "Claimable Rewards" }), jsx(TooltipBubble, { className: "tooltip-bubble", body: jsx(Flex, { children: "Amount of tokens that can be claimed in this moment" }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, 0%)", children: jsx(Flex, { className: "block-header icon", children: jsx(QuestionCircle, { width: "12px", color: 'textDisabledButton' }) }) })] }), jsxs(Flex, { sx: { alignItems: 'center' }, children: [jsx(TokenImage, { symbol: payoutSymbol, size: 18 }), jsx(Text, { sx: { fontSize: '12px', fontWeight: 700, ml: '10px' }, children: formatNumberSI(claimableRewards, 4) }), jsxs(Text, { sx: {
-                                                            fontSize: ['10px', '10px', '10px', '12px'],
-                                                            fontWeight: 400,
-                                                            ml: '10px',
-                                                            opacity: 0.6,
-                                                        }, children: ["($", formatNumberSI(claimableRewardsUSD), ")"] })] })] }), jsxs(Flex, { sx: {
-                                            width: '100%',
-                                            justifyContent: 'space-between',
-                                            alignItems: 'center',
-                                            p: '4px 10px',
-                                            background: 'white4',
-                                            height: '26px',
-                                            borderRadius: '0px 0px 10px 10px',
-                                        }, children: [jsxs(Flex, { sx: { alignItems: 'center', gap: '5px' }, children: [jsx(Flex, { sx: { opacity: 0.6 }, children: "Claimed " }), jsx(TooltipBubble, { className: "tooltip-bubble", body: jsx(Flex, { children: UserBillTooltipText.Claimed }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, 0%)", children: jsx(Flex, { className: "block-header icon", children: jsx(QuestionCircle, { width: "12px", color: 'textDisabledButton' }) }) })] }), jsxs(Flex, { sx: { alignItems: 'center' }, children: [jsx(TokenImage, { symbol: payoutSymbol, size: 18 }), jsx(Text, { sx: { fontSize: '12px', fontWeight: 700, ml: '10px' }, children: formatNumberSI(userBill?.yieldData?.claimed, 4) }), jsxs(Text, { sx: {
-                                                            fontSize: ['10px', '10px', '10px', '12px'],
-                                                            fontWeight: 400,
-                                                            ml: '10px',
-                                                            opacity: 0.6,
-                                                        }, children: ["($", formatNumberSI(claimedUSD), ")"] })] })] })] }), jsxs(Flex, { sx: {
-                                    width: '100%',
-                                    justifyContent: 'space-between',
-                                    gap: ['10px', '10px', '10px', '15px'],
-                                    height: '40px',
-                                }, children: [jsx(Button, { sx: { width: '65%' }, disabled: !saleFinalized || loading || isLoadingOnChain, load: loading || isLoadingOnChain, onClick: () => {
+    return (jsx(Modal, { className: "ape:w-[400px] ape:[overflow-y:unset]! ape:bg-white2 ape:p-0 ape:top-[56%]", onDismiss: onDismiss, children: jsx(Flex, { className: "ape:flex-col ape:rounded-normal ape:relative ape:bg-white2 ape:p-[20px]", children: jsxs(Flex, { className: "ape:flex-col", children: [jsx(YourBondModalHeader, { userBill: userBill, onDismiss: onDismiss }), jsxs(Flex, { className: "ape:mt-[10px] ape:flex-col ape:gap-[10px]", children: [jsxs(Flex, { className: "ape:w-full ape:gap-[15px] ape:relative", children: [jsxs(Flex, { className: "ape:bg-white3 ape:rounded-normal ape:justify-between ape:p-[10px] ape:w-[65%] ape:items-center ape:text-[14px]", children: [jsx(Flex, { children: "Deposit" }), jsx(Flex, { className: "ape:items-center ape:gap-[5px]", children: saleFinalized && hasRedeemed ? (jsxs(Fragment, { children: [jsx(TokenImage, { symbol: userBill?.underlyingEarnToken?.symbol, size: 18 }), formatNumberSI(depositedAssets), jsxs("span", { className: "ape:text-[12px]", style: { color: 'var(--ape-color-text-disabled-button)' }, children: ["($", formatNumberSI(depositedAssetsUSD), ")"] })] })) : (jsxs(Fragment, { children: [jsx(TokenImage, { symbol: userBill?.lpToken.symbol, size: 18 }), formatNumberSI(depositUSD)] })) })] }), jsx(Flex, { className: "ape:absolute ape:top-1/2 ape:left-[65%] ape:-translate-y-1/2 ape:-translate-x-1/2", children: jsx(Arrow, { direction: "right", width: '5px' }) }), jsxs(Flex, { className: "ape:bg-white3 ape:rounded-normal ape:justify-between ape:p-[10px] ape:w-[34%] ape:items-center ape:text-[14px]", children: [jsx(Flex, { children: "APR" }), jsxs(Flex, { className: "ape:font-bold", style: { color: 'var(--ape-color-success)' }, children: [userBill?.yieldData?.apr?.toFixed(), "%"] })] })] }), jsxs(Flex, { className: "ape:flex-col ape:text-[12px] ape:font-normal", children: [jsx(Flex, { className: "ape:w-full ape:justify-between ape:items-center ape:p-[4px_10px] ape:bg-white4 ape:h-[26px] ape:rounded-[10px_10px_0_0]", children: hasRedeemed ? (jsxs(Fragment, { children: [jsxs(Flex, { className: "ape:items-center ape:gap-[5px]", children: [jsx(Flex, { className: "ape:opacity-60", children: "Vault Ends" }), jsx(TooltipBubble, { className: "tooltip-bubble", body: jsx(Flex, { children: "This is the date when reward distribution finishes." }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, 0%)", children: jsx(Flex, { className: "block-header icon ape:text-white ape:font-normal ape:text-[12px]", children: jsx(QuestionCircle, { width: "12px", color: 'textDisabledButton' }) }) })] }), jsx(Flex, { className: "ape:items-center", children: formatUTCDate(new Date((userBill?.yieldData?.rewardDistributionEnd ?? 0) * 1000)) })] })) : (jsxs(Fragment, { children: [jsxs(Flex, { className: "ape:items-center ape:gap-[5px]", children: [jsx(Flex, { className: "ape:opacity-60", children: "Yield starts in" }), jsx(TooltipBubble, { className: "tooltip-bubble", body: jsx(Flex, { children: "Time left for the vault to start accruing rewards." }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, 0%)", children: jsx(Flex, { className: "block-header icon ape:text-white ape:font-normal ape:text-[12px]", children: jsx(QuestionCircle, { width: "12px", color: 'textDisabledButton' }) }) })] }), endTimeFinished && !canRedeem ? ('Soon...') : canRedeem ? ('Activate Yield') : (jsxs(Flex, { className: "ape:items-center ape:gap-[5px]", children: [redeemableInLong, jsx(TooltipBubble, { className: "tooltip-bubble", body: jsxs(Flex, { onClick: () => setUseLocal(!useLocal), className: "ape:cursor-pointer", children: ["Claimable at", ' ', formatUTCDate(new Date((userBill?.redeemTime ?? 0) * 1000), false, useLocal), ' ', useLocal ? 'Local' : 'UTC'] }), width: "230px", placement: "bottomRight", transformTip: "translate(10%, 0%)", children: jsx(Flex, { className: "block-header icon ape:text-white ape:font-normal ape:text-[12px]", children: jsx(QuestionCircle, { width: "12px", color: 'textDisabledButton' }) }) })] }))] })) }), jsxs(Flex, { className: "ape:w-full ape:justify-between ape:items-center ape:p-[4px_10px] ape:bg-white3 ape:h-[26px]", children: [jsxs(Flex, { className: "ape:items-center ape:gap-[5px]", children: [jsx(Flex, { className: "ape:opacity-60", children: "Claimable Rewards" }), jsx(TooltipBubble, { className: "tooltip-bubble", body: jsx(Flex, { children: "Amount of tokens that can be claimed in this moment" }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, 0%)", children: jsx(Flex, { className: "block-header icon ape:text-white ape:font-normal ape:text-[12px]", children: jsx(QuestionCircle, { width: "12px", color: 'textDisabledButton' }) }) })] }), jsxs(Flex, { className: "ape:items-center", children: [jsx(TokenImage, { symbol: payoutSymbol, size: 18 }), jsx(Text, { weight: 700, className: "ape:ml-[10px]", size: "12px", children: formatNumberSI(claimableRewards, 4) }), jsxs(Text, { weight: 400, className: "ape:ml-[10px] ape:opacity-60 ape:text-[10px] ape:md:text-[12px]", children: ["($", formatNumberSI(claimableRewardsUSD), ")"] })] })] }), jsxs(Flex, { className: "ape:w-full ape:justify-between ape:items-center ape:p-[4px_10px] ape:bg-white4 ape:h-[26px] ape:rounded-[0px_0px_10px_10px]", children: [jsxs(Flex, { className: "ape:items-center ape:gap-[5px]", children: [jsx(Flex, { className: "ape:opacity-60", children: "Claimed " }), jsx(TooltipBubble, { className: "tooltip-bubble", body: jsx(Flex, { children: UserBillTooltipText.Claimed }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, 0%)", children: jsx(Flex, { className: "block-header icon ape:text-white ape:font-normal ape:text-[12px]", children: jsx(QuestionCircle, { width: "12px", color: 'textDisabledButton' }) }) })] }), jsxs(Flex, { className: "ape:items-center", children: [jsx(TokenImage, { symbol: payoutSymbol, size: 18 }), jsx(Text, { weight: 700, className: "ape:ml-[10px]", size: "12px", children: formatNumberSI(userBill?.yieldData?.claimed, 4) }), jsxs(Text, { weight: 400, className: "ape:ml-[10px] ape:opacity-60 ape:text-[10px] ape:md:text-[12px]", children: ["($", formatNumberSI(claimedUSD), ")"] })] })] })] }), jsxs(Flex, { className: "ape:w-full ape:justify-between ape:gap-[10px] ape:md:gap-[15px] ape:h-[40px]", children: [jsx(Button, { className: "ape:w-[65%]", disabled: !saleFinalized || loading || isLoadingOnChain, load: loading || isLoadingOnChain, onClick: () => {
                                             if (chainId !== userBill?.chainId) {
                                                 switchChainAsync({ chainId: userBill?.chainId })
                                                     .then(() => {
@@ -213,7 +143,7 @@ const YourBondsModalYield = ({ userBill, onDismiss }) => {
                                             ? 'Activate yield'
                                             : hasRedeemed
                                                 ? 'Claim rewards'
-                                                : `Claimable ${endTimeFinished && !saleFinalized ? 'soon' : `in ${redeemableInShort}`}` }), jsx(Button, { sx: { width: '34%' }, disabled: !saleFinalized || !hasRedeemed, variant: "secondary", onClick: onOpenUnstakeModal, children: "Unstake" })] })] })] }) }) }));
+                                                : `Claimable ${endTimeFinished && !saleFinalized ? 'soon' : `in ${redeemableInShort}`}` }), jsx(Button, { className: "ape:w-[34%]", disabled: !saleFinalized || !hasRedeemed, variant: "secondary", onClick: onOpenUnstakeModal, children: "Unstake" })] })] })] }) }) }));
 };
 
 export { YourBondsModalYield as default };

package/dist/views/YourBondsModalYield/YourBondsModalYield.js.map

@@ -1 +1 @@
-{"version":3,"file":"YourBondsModalYield.js","sources":["../../../src/views/YourBondsModalYield/YourBondsModalYield.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useState } from 'react'\nimport TokenImage from '../../components/uikit-sdk/TokenImage'\nimport { formatNumberSI } from '../../utils/formatNumber'\nimport { UserBillTooltipText } from '../../config/constants/tooltips'\nimport YourBondModalHeader from './components/YourBondModalHeader/YourBondModalHeader'\nimport Modal from '../../components/uikit-sdk/Modal'\nimport Flex from '../../components/uikit-sdk/Flex'\nimport Button from '../../components/uikit-sdk/Button/Button'\nimport TooltipBubble from '../../components/uikit-sdk/TooltipBubble'\nimport Text from '../../components/uikit-sdk/Text'\nimport useUserBondsPreTGE, { PreTGEUserBonds } from '../../state/bonds/useUserBondsPreTGE'\nimport { getBalanceNumber } from '../../utils/getBalanceNumber'\nimport { formatUTCDate } from '../../utils/dates/formatDate'\nimport useEVMAccount from '../../hooks/accounts/useEVMAccount'\nimport { useSwitchChain, useWriteContract } from 'wagmi'\nimport LaunchBondABI_V_2_4_1 from '../../config/abi/launchBond_v2_4_1.json'\nimport Vault_Shares_ABI from '../../config/abi/Vault_Shares.json'\nimport { reportError } from '../../utils/reportError'\nimport { useSDKConfig } from '../../state/useSDKConfig'\nimport { usePopups } from '../../state/popups/usePopups'\nimport { useMonitorTx } from '../../hooks/useMonitorTx'\nimport { formatTimeLeft } from '../../utils/getTimePeriods'\nimport useModal from '../../hooks/useModal'\nimport UnstakeModalYield from './components/UnstakeModalYield/UnstakeModalYield'\nimport Arrow from '../../components/uikit-sdk/Svg/Icons/Arrow'\nimport QuestionCircle from '../../components/uikit-sdk/Svg/Icons/QuestionCircle'\n\nconst YourBondsModalYield = ({ userBill, onDismiss }: { userBill?: PreTGEUserBonds; onDismiss?: () => void }) => {\n  // Hooks\n  const { refetch } = useUserBondsPreTGE()\n  const { address: account, chainId } = useEVMAccount()\n  const { switchChainAsync } = useSwitchChain()\n  const { writeContractAsync } = useWriteContract()\n  const SDKConfig = useSDKConfig()\n  const { addToastError } = usePopups()\n\n  //State\n  const [loading, setLoading] = useState(false)\n  const [hash, setHash] = useState('')\n  const [useLocal, setUseLocal] = useState(false)\n  const { isLoading: isLoadingOnChain, isSuccess } = useMonitorTx(hash, userBill?.chainId)\n\n  // Static Data\n  const depositUSD = getBalanceNumber(\n    userBill?.accountInfo?.depositAmount ?? '0',\n    userBill?.lpToken.decimals[userBill?.chainId] ?? 18,\n  ) // assumes raise is in stables\n  const payoutSymbol = userBill?.underlyingEarnToken?.symbol\n  const claimableRewards = getBalanceNumber(userBill?.yieldData?.claimableRewards ?? '0')\n  const claimableRewardsUSD = claimableRewards * (userBill?.earnTokenPrice ?? 0)\n  const claimedUSD = (userBill?.yieldData?.claimed ?? 0) * (userBill?.earnTokenPrice ?? 0)\n  const saleFinalized = userBill?.finalized\n  const hasRedeemed = userBill?.accountInfo?.hasRedeemed\n  const canRedeem = saleFinalized && !hasRedeemed\n  const endTimeFinished = Date.now() > (userBill?.endTime ?? 0) * 1000\n  const depositedAssets = userBill?.yieldData?.depositedAssets ?? 0\n  const depositedAssetsUSD = depositedAssets * (userBill?.earnTokenPrice ?? 0)\n\n  const redeemableInLong = formatTimeLeft((userBill?.redeemTime ?? 0) - new Date().getTime() / 1000, true, false)\n  const redeemableInShort = formatTimeLeft((userBill?.redeemTime ?? 0) - new Date().getTime() / 1000, true, true)\n\n  // Handlers\n  const handleRedeemBond = async () => {\n    setLoading(true)\n    writeContractAsync({\n      address: userBill?.contractAddress[userBill?.chainId] as `0x${string}`,\n      abi: LaunchBondABI_V_2_4_1,\n      functionName: 'redeem',\n      chain: userBill?.chainId as any,\n      account,\n    })\n      .then((r) => {\n        setHash(r)\n      })\n      .catch((e) => {\n        console.error(e.message)\n        reportError({\n          apiUrl: SDKConfig?.urls?.apiV2,\n          error: e.message,\n          extraInfo: { type: 'redeemLaunchBond', error: e.message },\n          chainId: userBill?.chainId,\n          account,\n        })\n        addToastError(e.shortMessage)\n      })\n      .finally(() => setLoading(false))\n  }\n\n  const handleClaim = async () => {\n    setLoading(true)\n    setHash('')\n    if (!userBill?.userOwnedBillsData?.id) return\n    writeContractAsync({\n      address: userBill?.earnToken.address[userBill?.chainId] as `0x${string}`,\n      abi: Vault_Shares_ABI,\n      functionName: 'withdraw',\n      args: [userBill?.yieldData?.claimableRewards, account, account],\n      chain: userBill?.chainId as any,\n      account,\n    })\n      .then((r) => {\n        setHash(r)\n      })\n      .catch((e) => {\n        console.error(e.message)\n        reportError({\n          apiUrl: SDKConfig?.urls?.apiV2,\n          error: e.message,\n          extraInfo: { type: 'claimLaunchBond', error: e.message },\n          chainId: userBill?.chainId,\n          account,\n        })\n        addToastError(e.shortMessage)\n      })\n      .finally(() => setLoading(false))\n  }\n\n  const handleClick = () => {\n    if (hasRedeemed) {\n      handleClaim()\n    } else {\n      handleRedeemBond()\n    }\n  }\n\n  const handleModalClose = useCallback(() => {\n    console.log('refetch!')\n    refetch()\n    setTimeout(() => onDismiss?.(), 1500)\n  }, [refetch, onDismiss])\n\n  const [onOpenUnstakeModal] = useModal(\n    <UnstakeModalYield userBill={userBill} onSuccessFullTx={handleModalClose} />,\n    false,\n    false,\n    `unstakeModalYield${userBill?.contractAddress[userBill?.chainId]}`,\n  )\n\n  useEffect(() => {\n    if (isSuccess) {\n      console.log('refetch!')\n      refetch()\n    }\n  }, [isSuccess, refetch])\n\n  return (\n    <Modal\n      sx={{\n        width: '400px',\n        overflowY: 'unset !important',\n        background: 'white2',\n        p: '0px',\n        top: '56%',\n      }}\n      onDismiss={onDismiss}\n    >\n      <Flex\n        sx={{\n          flexDirection: 'column',\n          borderRadius: 'normal',\n          position: 'relative',\n          background: 'white2',\n          p: '20px',\n        }}\n      >\n        <Flex sx={{ flexDirection: 'column' }}>\n          <YourBondModalHeader userBill={userBill} onDismiss={onDismiss} />\n          <Flex sx={{ mt: '10px', flexDirection: 'column', gap: '10px' }}>\n            <Flex sx={{ width: '100%', gap: '15px', position: 'relative' }}>\n              <Flex\n                sx={{\n                  background: 'white3',\n                  borderRadius: 'normal',\n                  justifyContent: 'space-between',\n                  p: '10px',\n                  width: '65%',\n                  alignItems: 'center',\n                  fontSize: '14px',\n                }}\n              >\n                <Flex>Deposit</Flex>\n                <Flex sx={{ alignItems: 'center', gap: '5px' }}>\n                  {saleFinalized && hasRedeemed ? (\n                    <>\n                      <TokenImage symbol={userBill?.underlyingEarnToken?.symbol} size={18} />\n                      {formatNumberSI(depositedAssets)}\n                      <span sx={{ color: 'textDisabledButton', fontSize: '12px' }}>\n                        (${formatNumberSI(depositedAssetsUSD)})\n                      </span>\n                    </>\n                  ) : (\n                    <>\n                      <TokenImage symbol={userBill?.lpToken.symbol} size={18} />\n                      {formatNumberSI(depositUSD)}\n                    </>\n                  )}\n                </Flex>\n              </Flex>\n              <Flex\n                sx={{ position: 'absolute', top: '50%', left: '65%', transform: 'translateY(-50%) translateX(-50%)' }}\n              >\n                <Arrow direction=\"right\" width={'5px'} />\n              </Flex>\n              <Flex\n                sx={{\n                  background: 'white3',\n                  borderRadius: 'normal',\n                  justifyContent: 'space-between',\n                  p: '10px',\n                  width: '34%',\n                  alignItems: 'center',\n                  fontSize: '14px',\n                }}\n              >\n                <Flex>APR</Flex>\n                <Flex sx={{ color: 'success', fontWeight: 700 }}>{userBill?.yieldData?.apr?.toFixed()}%</Flex>\n              </Flex>\n            </Flex>\n            <Flex\n              sx={{\n                flexDirection: 'column',\n                fontSize: '12px',\n                fontWeight: 400,\n              }}\n            >\n              <Flex\n                sx={{\n                  width: '100%',\n                  justifyContent: 'space-between',\n                  alignItems: 'center',\n                  p: '4px 10px',\n                  background: 'white4',\n                  height: '26px',\n                  borderRadius: '10px 10px 0 0',\n                }}\n              >\n                {hasRedeemed ? (\n                  <>\n                    <Flex sx={{ alignItems: 'center', gap: '5px' }}>\n                      <Flex sx={{ opacity: 0.6 }}>Vault Ends</Flex>\n                      <TooltipBubble\n                        className=\"tooltip-bubble\"\n                        body={<Flex>This is the date when reward distribution finishes.</Flex>}\n                        width=\"230px\"\n                        placement=\"bottomLeft\"\n                        transformTip=\"translate(-5%, 0%)\"\n                      >\n                        <Flex className=\"block-header icon\">\n                          <QuestionCircle width=\"12px\" color={'textDisabledButton'} />\n                        </Flex>\n                      </TooltipBubble>\n                    </Flex>\n                    <Flex sx={{ alignItems: 'center' }}>\n                      {formatUTCDate(new Date((userBill?.yieldData?.rewardDistributionEnd ?? 0) * 1000))}\n                    </Flex>\n                  </>\n                ) : (\n                  <>\n                    <Flex sx={{ alignItems: 'center', gap: '5px' }}>\n                      <Flex sx={{ opacity: 0.6 }}>Yield starts in</Flex>\n                      <TooltipBubble\n                        className=\"tooltip-bubble\"\n                        body={<Flex>Time left for the vault to start accruing rewards.</Flex>}\n                        width=\"230px\"\n                        placement=\"bottomLeft\"\n                        transformTip=\"translate(-5%, 0%)\"\n                      >\n                        <Flex className=\"block-header icon\">\n                          <QuestionCircle width=\"12px\" color={'textDisabledButton'} />\n                        </Flex>\n                      </TooltipBubble>\n                    </Flex>\n                    {endTimeFinished && !canRedeem ? (\n                      'Soon...'\n                    ) : canRedeem ? (\n                      'Activate Yield'\n                    ) : (\n                      <Flex sx={{ alignItems: 'center', gap: '5px' }}>\n                        {redeemableInLong}\n                        <TooltipBubble\n                          className=\"tooltip-bubble\"\n                          body={\n                            <Flex onClick={() => setUseLocal(!useLocal)} sx={{ cursor: 'pointer' }}>\n                              Claimable at{' '}\n                              {formatUTCDate(new Date((userBill?.redeemTime ?? 0) * 1000), false, useLocal)}{' '}\n                              {useLocal ? 'Local' : 'UTC'}\n                            </Flex>\n                          }\n                          width=\"230px\"\n                          placement=\"bottomRight\"\n                          transformTip=\"translate(10%, 0%)\"\n                        >\n                          <Flex className=\"block-header icon\">\n                            <QuestionCircle width=\"12px\" color={'textDisabledButton'} />\n                          </Flex>\n                        </TooltipBubble>\n                      </Flex>\n                    )}\n                  </>\n                )}\n              </Flex>\n              <Flex\n                sx={{\n                  width: '100%',\n                  justifyContent: 'space-between',\n                  alignItems: 'center',\n                  p: '4px 10px',\n                  background: 'white3',\n                  height: '26px',\n                }}\n              >\n                <Flex sx={{ alignItems: 'center', gap: '5px' }}>\n                  <Flex sx={{ opacity: 0.6 }}>Claimable Rewards</Flex>\n                  <TooltipBubble\n                    className=\"tooltip-bubble\"\n                    body={<Flex>Amount of tokens that can be claimed in this moment</Flex>}\n                    width=\"230px\"\n                    placement=\"bottomLeft\"\n                    transformTip=\"translate(-5%, 0%)\"\n                  >\n                    <Flex className=\"block-header icon\">\n                      <QuestionCircle width=\"12px\" color={'textDisabledButton'} />\n                    </Flex>\n                  </TooltipBubble>\n                </Flex>\n                <Flex sx={{ alignItems: 'center' }}>\n                  <TokenImage symbol={payoutSymbol} size={18} />\n                  <Text sx={{ fontSize: '12px', fontWeight: 700, ml: '10px' }}>\n                    {formatNumberSI(claimableRewards, 4)}\n                  </Text>\n                  <Text\n                    sx={{\n                      fontSize: ['10px', '10px', '10px', '12px'],\n                      fontWeight: 400,\n                      ml: '10px',\n                      opacity: 0.6,\n                    }}\n                  >\n                    (${formatNumberSI(claimableRewardsUSD)})\n                  </Text>\n                </Flex>\n              </Flex>\n              <Flex\n                sx={{\n                  width: '100%',\n                  justifyContent: 'space-between',\n                  alignItems: 'center',\n                  p: '4px 10px',\n                  background: 'white4',\n                  height: '26px',\n                  borderRadius: '0px 0px 10px 10px',\n                }}\n              >\n                <Flex sx={{ alignItems: 'center', gap: '5px' }}>\n                  <Flex sx={{ opacity: 0.6 }}>Claimed </Flex>\n                  <TooltipBubble\n                    className=\"tooltip-bubble\"\n                    body={<Flex>{UserBillTooltipText.Claimed}</Flex>}\n                    width=\"230px\"\n                    placement=\"bottomLeft\"\n                    transformTip=\"translate(-5%, 0%)\"\n                  >\n                    <Flex className=\"block-header icon\">\n                      <QuestionCircle width=\"12px\" color={'textDisabledButton'} />\n                    </Flex>\n                  </TooltipBubble>\n                </Flex>\n                <Flex sx={{ alignItems: 'center' }}>\n                  <TokenImage symbol={payoutSymbol} size={18} />\n                  <Text sx={{ fontSize: '12px', fontWeight: 700, ml: '10px' }}>\n                    {formatNumberSI(userBill?.yieldData?.claimed, 4)}\n                  </Text>\n                  <Text\n                    sx={{\n                      fontSize: ['10px', '10px', '10px', '12px'],\n                      fontWeight: 400,\n                      ml: '10px',\n                      opacity: 0.6,\n                    }}\n                  >\n                    (${formatNumberSI(claimedUSD)})\n                  </Text>\n                </Flex>\n              </Flex>\n            </Flex>\n            <Flex\n              sx={{\n                width: '100%',\n                justifyContent: 'space-between',\n                gap: ['10px', '10px', '10px', '15px'],\n                height: '40px',\n              }}\n            >\n              <Button\n                sx={{ width: '65%' }}\n                disabled={!saleFinalized || loading || isLoadingOnChain}\n                load={loading || isLoadingOnChain}\n                onClick={() => {\n                  if (chainId !== userBill?.chainId) {\n                    switchChainAsync({ chainId: userBill?.chainId! })\n                      .then(() => {\n                        handleClick()\n                      })\n                      .catch()\n                  } else {\n                    handleClick()\n                  }\n                }}\n              >\n                {canRedeem\n                  ? 'Activate yield'\n                  : hasRedeemed\n                    ? 'Claim rewards'\n                    : `Claimable ${endTimeFinished && !saleFinalized ? 'soon' : `in ${redeemableInShort}`}`}\n              </Button>\n              <Button\n                sx={{ width: '34%' }}\n                disabled={!saleFinalized || !hasRedeemed}\n                variant=\"secondary\"\n                onClick={onOpenUnstakeModal}\n              >\n                Unstake\n              </Button>\n            </Flex>\n          </Flex>\n        </Flex>\n      </Flex>\n    </Modal>\n  )\n}\n\nexport default YourBondsModalYield\n"],"names":["_jsx","_jsxs","_Fragment"],"mappings":"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"}
+{"version":3,"file":"YourBondsModalYield.js","sources":["../../../src/views/YourBondsModalYield/YourBondsModalYield.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useState } from 'react'\nimport TokenImage from '../../components/uikit-sdk/TokenImage'\nimport { formatNumberSI } from '../../utils/formatNumber'\nimport { UserBillTooltipText } from '../../config/constants/tooltips'\nimport YourBondModalHeader from './components/YourBondModalHeader/YourBondModalHeader'\nimport Modal from '../../components/uikit-sdk/Modal'\nimport Flex from '../../components/uikit-sdk/Flex'\nimport Button from '../../components/uikit-sdk/Button/Button'\nimport TooltipBubble from '../../components/uikit-sdk/TooltipBubble'\nimport Text from '../../components/uikit-sdk/Text'\nimport useUserBondsPreTGE, { PreTGEUserBonds } from '../../state/bonds/useUserBondsPreTGE'\nimport { getBalanceNumber } from '../../utils/getBalanceNumber'\nimport { formatUTCDate } from '../../utils/dates/formatDate'\nimport useEVMAccount from '../../hooks/accounts/useEVMAccount'\nimport { useSwitchChain, useWriteContract } from 'wagmi'\nimport LaunchBondABI_V_2_4_1 from '../../config/abi/launchBond_v2_4_1.json'\nimport Vault_Shares_ABI from '../../config/abi/Vault_Shares.json'\nimport { reportError } from '../../utils/reportError'\nimport { useSDKConfig } from '../../state/useSDKConfig'\nimport { usePopups } from '../../state/popups/usePopups'\nimport { useMonitorTx } from '../../hooks/useMonitorTx'\nimport { formatTimeLeft } from '../../utils/getTimePeriods'\nimport useModal from '../../hooks/useModal'\nimport UnstakeModalYield from './components/UnstakeModalYield/UnstakeModalYield'\nimport Arrow from '../../components/uikit-sdk/Svg/Icons/Arrow'\nimport QuestionCircle from '../../components/uikit-sdk/Svg/Icons/QuestionCircle'\n\nconst YourBondsModalYield = ({ userBill, onDismiss }: { userBill?: PreTGEUserBonds; onDismiss?: () => void }) => {\n  // Hooks\n  const { refetch } = useUserBondsPreTGE()\n  const { address: account, chainId } = useEVMAccount()\n  const { switchChainAsync } = useSwitchChain()\n  const { writeContractAsync } = useWriteContract()\n  const SDKConfig = useSDKConfig()\n  const { addToastError } = usePopups()\n\n  //State\n  const [loading, setLoading] = useState(false)\n  const [hash, setHash] = useState('')\n  const [useLocal, setUseLocal] = useState(false)\n  const { isLoading: isLoadingOnChain, isSuccess } = useMonitorTx(hash, userBill?.chainId)\n\n  // Static Data\n  const depositUSD = getBalanceNumber(\n    userBill?.accountInfo?.depositAmount ?? '0',\n    userBill?.lpToken.decimals[userBill?.chainId] ?? 18,\n  ) // assumes raise is in stables\n  const payoutSymbol = userBill?.underlyingEarnToken?.symbol\n  const claimableRewards = getBalanceNumber(userBill?.yieldData?.claimableRewards ?? '0')\n  const claimableRewardsUSD = claimableRewards * (userBill?.earnTokenPrice ?? 0)\n  const claimedUSD = (userBill?.yieldData?.claimed ?? 0) * (userBill?.earnTokenPrice ?? 0)\n  const saleFinalized = userBill?.finalized\n  const hasRedeemed = userBill?.accountInfo?.hasRedeemed\n  const canRedeem = saleFinalized && !hasRedeemed\n  const endTimeFinished = Date.now() > (userBill?.endTime ?? 0) * 1000\n  const depositedAssets = userBill?.yieldData?.depositedAssets ?? 0\n  const depositedAssetsUSD = depositedAssets * (userBill?.earnTokenPrice ?? 0)\n\n  const redeemableInLong = formatTimeLeft((userBill?.redeemTime ?? 0) - new Date().getTime() / 1000, true, false)\n  const redeemableInShort = formatTimeLeft((userBill?.redeemTime ?? 0) - new Date().getTime() / 1000, true, true)\n\n  // Handlers\n  const handleRedeemBond = async () => {\n    setLoading(true)\n    writeContractAsync({\n      address: userBill?.contractAddress[userBill?.chainId] as `0x${string}`,\n      abi: LaunchBondABI_V_2_4_1,\n      functionName: 'redeem',\n      chain: userBill?.chainId as any,\n      account,\n    })\n      .then((r) => {\n        setHash(r)\n      })\n      .catch((e) => {\n        console.error(e.message)\n        reportError({\n          apiUrl: SDKConfig?.urls?.apiV2,\n          error: e.message,\n          extraInfo: { type: 'redeemLaunchBond', error: e.message },\n          chainId: userBill?.chainId,\n          account,\n        })\n        addToastError(e.shortMessage)\n      })\n      .finally(() => setLoading(false))\n  }\n\n  const handleClaim = async () => {\n    setLoading(true)\n    setHash('')\n    if (!userBill?.userOwnedBillsData?.id) return\n    writeContractAsync({\n      address: userBill?.earnToken.address[userBill?.chainId] as `0x${string}`,\n      abi: Vault_Shares_ABI,\n      functionName: 'withdraw',\n      args: [userBill?.yieldData?.claimableRewards, account, account],\n      chain: userBill?.chainId as any,\n      account,\n    })\n      .then((r) => {\n        setHash(r)\n      })\n      .catch((e) => {\n        console.error(e.message)\n        reportError({\n          apiUrl: SDKConfig?.urls?.apiV2,\n          error: e.message,\n          extraInfo: { type: 'claimLaunchBond', error: e.message },\n          chainId: userBill?.chainId,\n          account,\n        })\n        addToastError(e.shortMessage)\n      })\n      .finally(() => setLoading(false))\n  }\n\n  const handleClick = () => {\n    if (hasRedeemed) {\n      handleClaim()\n    } else {\n      handleRedeemBond()\n    }\n  }\n\n  const handleModalClose = useCallback(() => {\n    console.log('refetch!')\n    refetch()\n    setTimeout(() => onDismiss?.(), 1500)\n  }, [refetch, onDismiss])\n\n  const [onOpenUnstakeModal] = useModal(\n    <UnstakeModalYield userBill={userBill} onSuccessFullTx={handleModalClose} />,\n    false,\n    false,\n    `unstakeModalYield${userBill?.contractAddress[userBill?.chainId]}`,\n  )\n\n  useEffect(() => {\n    if (isSuccess) {\n      console.log('refetch!')\n      refetch()\n    }\n  }, [isSuccess, refetch])\n\n  return (\n    <Modal\n      className=\"ape:w-[400px] ape:[overflow-y:unset]! ape:bg-white2 ape:p-0 ape:top-[56%]\"\n      onDismiss={onDismiss}\n    >\n      <Flex className=\"ape:flex-col ape:rounded-normal ape:relative ape:bg-white2 ape:p-[20px]\">\n        <Flex className=\"ape:flex-col\">\n          <YourBondModalHeader userBill={userBill} onDismiss={onDismiss} />\n          <Flex className=\"ape:mt-[10px] ape:flex-col ape:gap-[10px]\">\n            <Flex className=\"ape:w-full ape:gap-[15px] ape:relative\">\n              <Flex className=\"ape:bg-white3 ape:rounded-normal ape:justify-between ape:p-[10px] ape:w-[65%] ape:items-center ape:text-[14px]\">\n                <Flex>Deposit</Flex>\n                <Flex className=\"ape:items-center ape:gap-[5px]\">\n                  {saleFinalized && hasRedeemed ? (\n                    <>\n                      <TokenImage symbol={userBill?.underlyingEarnToken?.symbol} size={18} />\n                      {formatNumberSI(depositedAssets)}\n                      <span\n                        className=\"ape:text-[12px]\"\n                        style={{ color: 'var(--ape-color-text-disabled-button)' }}\n                      >\n                        (${formatNumberSI(depositedAssetsUSD)})\n                      </span>\n                    </>\n                  ) : (\n                    <>\n                      <TokenImage symbol={userBill?.lpToken.symbol} size={18} />\n                      {formatNumberSI(depositUSD)}\n                    </>\n                  )}\n                </Flex>\n              </Flex>\n              <Flex className=\"ape:absolute ape:top-1/2 ape:left-[65%] ape:-translate-y-1/2 ape:-translate-x-1/2\">\n                <Arrow direction=\"right\" width={'5px'} />\n              </Flex>\n              <Flex className=\"ape:bg-white3 ape:rounded-normal ape:justify-between ape:p-[10px] ape:w-[34%] ape:items-center ape:text-[14px]\">\n                <Flex>APR</Flex>\n                <Flex className=\"ape:font-bold\" style={{ color: 'var(--ape-color-success)' }}>\n                  {userBill?.yieldData?.apr?.toFixed()}%\n                </Flex>\n              </Flex>\n            </Flex>\n            <Flex className=\"ape:flex-col ape:text-[12px] ape:font-normal\">\n              <Flex className=\"ape:w-full ape:justify-between ape:items-center ape:p-[4px_10px] ape:bg-white4 ape:h-[26px] ape:rounded-[10px_10px_0_0]\">\n                {hasRedeemed ? (\n                  <>\n                    <Flex className=\"ape:items-center ape:gap-[5px]\">\n                      <Flex className=\"ape:opacity-60\">Vault Ends</Flex>\n                      <TooltipBubble\n                        className=\"tooltip-bubble\"\n                        body={<Flex>This is the date when reward distribution finishes.</Flex>}\n                        width=\"230px\"\n                        placement=\"bottomLeft\"\n                        transformTip=\"translate(-5%, 0%)\"\n                      >\n                        <Flex className=\"block-header icon ape:text-white ape:font-normal ape:text-[12px]\">\n                          <QuestionCircle width=\"12px\" color={'textDisabledButton'} />\n                        </Flex>\n                      </TooltipBubble>\n                    </Flex>\n                    <Flex className=\"ape:items-center\">\n                      {formatUTCDate(new Date((userBill?.yieldData?.rewardDistributionEnd ?? 0) * 1000))}\n                    </Flex>\n                  </>\n                ) : (\n                  <>\n                    <Flex className=\"ape:items-center ape:gap-[5px]\">\n                      <Flex className=\"ape:opacity-60\">Yield starts in</Flex>\n                      <TooltipBubble\n                        className=\"tooltip-bubble\"\n                        body={<Flex>Time left for the vault to start accruing rewards.</Flex>}\n                        width=\"230px\"\n                        placement=\"bottomLeft\"\n                        transformTip=\"translate(-5%, 0%)\"\n                      >\n                        <Flex className=\"block-header icon ape:text-white ape:font-normal ape:text-[12px]\">\n                          <QuestionCircle width=\"12px\" color={'textDisabledButton'} />\n                        </Flex>\n                      </TooltipBubble>\n                    </Flex>\n                    {endTimeFinished && !canRedeem ? (\n                      'Soon...'\n                    ) : canRedeem ? (\n                      'Activate Yield'\n                    ) : (\n                      <Flex className=\"ape:items-center ape:gap-[5px]\">\n                        {redeemableInLong}\n                        <TooltipBubble\n                          className=\"tooltip-bubble\"\n                          body={\n                            <Flex onClick={() => setUseLocal(!useLocal)} className=\"ape:cursor-pointer\">\n                              Claimable at{' '}\n                              {formatUTCDate(new Date((userBill?.redeemTime ?? 0) * 1000), false, useLocal)}{' '}\n                              {useLocal ? 'Local' : 'UTC'}\n                            </Flex>\n                          }\n                          width=\"230px\"\n                          placement=\"bottomRight\"\n                          transformTip=\"translate(10%, 0%)\"\n                        >\n                          <Flex className=\"block-header icon ape:text-white ape:font-normal ape:text-[12px]\">\n                            <QuestionCircle width=\"12px\" color={'textDisabledButton'} />\n                          </Flex>\n                        </TooltipBubble>\n                      </Flex>\n                    )}\n                  </>\n                )}\n              </Flex>\n              <Flex className=\"ape:w-full ape:justify-between ape:items-center ape:p-[4px_10px] ape:bg-white3 ape:h-[26px]\">\n                <Flex className=\"ape:items-center ape:gap-[5px]\">\n                  <Flex className=\"ape:opacity-60\">Claimable Rewards</Flex>\n                  <TooltipBubble\n                    className=\"tooltip-bubble\"\n                    body={<Flex>Amount of tokens that can be claimed in this moment</Flex>}\n                    width=\"230px\"\n                    placement=\"bottomLeft\"\n                    transformTip=\"translate(-5%, 0%)\"\n                  >\n                    <Flex className=\"block-header icon ape:text-white ape:font-normal ape:text-[12px]\">\n                      <QuestionCircle width=\"12px\" color={'textDisabledButton'} />\n                    </Flex>\n                  </TooltipBubble>\n                </Flex>\n                <Flex className=\"ape:items-center\">\n                  <TokenImage symbol={payoutSymbol} size={18} />\n                  <Text weight={700} className=\"ape:ml-[10px]\" size=\"12px\">\n                    {formatNumberSI(claimableRewards, 4)}\n                  </Text>\n                  <Text weight={400} className=\"ape:ml-[10px] ape:opacity-60 ape:text-[10px] ape:md:text-[12px]\">\n                    (${formatNumberSI(claimableRewardsUSD)})\n                  </Text>\n                </Flex>\n              </Flex>\n              <Flex className=\"ape:w-full ape:justify-between ape:items-center ape:p-[4px_10px] ape:bg-white4 ape:h-[26px] ape:rounded-[0px_0px_10px_10px]\">\n                <Flex className=\"ape:items-center ape:gap-[5px]\">\n                  <Flex className=\"ape:opacity-60\">Claimed </Flex>\n                  <TooltipBubble\n                    className=\"tooltip-bubble\"\n                    body={<Flex>{UserBillTooltipText.Claimed}</Flex>}\n                    width=\"230px\"\n                    placement=\"bottomLeft\"\n                    transformTip=\"translate(-5%, 0%)\"\n                  >\n                    <Flex className=\"block-header icon ape:text-white ape:font-normal ape:text-[12px]\">\n                      <QuestionCircle width=\"12px\" color={'textDisabledButton'} />\n                    </Flex>\n                  </TooltipBubble>\n                </Flex>\n                <Flex className=\"ape:items-center\">\n                  <TokenImage symbol={payoutSymbol} size={18} />\n                  <Text weight={700} className=\"ape:ml-[10px]\" size=\"12px\">\n                    {formatNumberSI(userBill?.yieldData?.claimed, 4)}\n                  </Text>\n                  <Text weight={400} className=\"ape:ml-[10px] ape:opacity-60 ape:text-[10px] ape:md:text-[12px]\">\n                    (${formatNumberSI(claimedUSD)})\n                  </Text>\n                </Flex>\n              </Flex>\n            </Flex>\n            <Flex className=\"ape:w-full ape:justify-between ape:gap-[10px] ape:md:gap-[15px] ape:h-[40px]\">\n              <Button\n                className=\"ape:w-[65%]\"\n                disabled={!saleFinalized || loading || isLoadingOnChain}\n                load={loading || isLoadingOnChain}\n                onClick={() => {\n                  if (chainId !== userBill?.chainId) {\n                    switchChainAsync({ chainId: userBill?.chainId! })\n                      .then(() => {\n                        handleClick()\n                      })\n                      .catch()\n                  } else {\n                    handleClick()\n                  }\n                }}\n              >\n                {canRedeem\n                  ? 'Activate yield'\n                  : hasRedeemed\n                    ? 'Claim rewards'\n                    : `Claimable ${endTimeFinished && !saleFinalized ? 'soon' : `in ${redeemableInShort}`}`}\n              </Button>\n              <Button\n                className=\"ape:w-[34%]\"\n                disabled={!saleFinalized || !hasRedeemed}\n                variant=\"secondary\"\n                onClick={onOpenUnstakeModal}\n              >\n                Unstake\n              </Button>\n            </Flex>\n          </Flex>\n        </Flex>\n      </Flex>\n    </Modal>\n  )\n}\n\nexport default YourBondsModalYield\n"],"names":["_jsx","_jsxs","_Fragment"],"mappings":"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"}

package/dist/views/YourBondsModalYield/components/UnstakeModalYield/UnstakeModalYield.d.ts

@@ -1,8 +1,7 @@
-import React from 'react';
 import { PreTGEUserBonds } from '../../../../state/bonds/useUserBondsPreTGE';
 declare const UnstakeModalYield: ({ userBill, onSuccessFullTx, onDismiss, }: {
     userBill?: PreTGEUserBonds;
     onSuccessFullTx?: () => void;
     onDismiss?: () => void;
-}) => React.JSX.Element;
+}) => import("react/jsx-runtime").JSX.Element;
 export default UnstakeModalYield;

package/dist/views/YourBondsModalYield/components/UnstakeModalYield/UnstakeModalYield.js

@@ -1,4 +1,4 @@
-import { jsx, jsxs } from 'theme-ui/jsx-runtime';
+import { jsx, jsxs } from 'react/jsx-runtime';
 import { useState, useEffect } from 'react';
 import Modal from '../../../../components/uikit-sdk/Modal/index.js';
 import Flex from '../../../../components/uikit-sdk/Flex/index.js';
@@ -59,12 +59,7 @@ const UnstakeModalYield = ({ userBill, onSuccessFullTx, onDismiss, }) => {
             onSuccessFullTx?.();
         }
     }, [isSuccess, onSuccessFullTx]);
-    return (jsx(Modal, { sx: {
-            width: '400px',
-            overflowY: 'unset !important',
-            background: 'white2',
-            top: '56%',
-        }, title: 'Confirm Unstake', onDismiss: onDismiss, children: jsxs(Flex, { sx: { width: '100%', flexDirection: 'column' }, children: [jsx(Flex, { sx: { fontSize: ['16px', '16px', '16px', '20px'], fontWeight: [600, 600, 600, 700] }, children: "Are you sure you want to unstake?" }), jsx(Flex, { sx: { fontSize: '14px', fontWeight: 400, mt: '10px' }, children: `You'll lose the rewards that have not been accrued yet (${formatNumberSI(futureRewards)} ${userBill?.underlyingEarnToken?.symbol}).` }), jsxs(Flex, { sx: { width: '100%', mt: '15px', fontWeight: 400, fontSize: '14px', alignItems: 'center' }, children: [jsx(Checkbox, { checked: acknowledge, onChange: () => setAcknowledge(!acknowledge), sx: { mr: '10px' } }), "I understand and I want to proceed to unstake."] }), jsxs(Flex, { sx: { width: '100%', gap: '10px', mt: '15px' }, children: [jsx(Button, { sx: { width: '100%', fontSize: '14px', height: '35px' }, disabled: !acknowledge || loading || isLoadingOnChain, load: loading || isLoadingOnChain, onClick: handleUnstake, children: "Unstake" }), jsx(Button, { variant: "secondary", sx: { width: '100%', height: '35px', fontSize: '14px' }, onClick: onDismiss, children: "Cancel" })] })] }) }));
+    return (jsx(Modal, { className: "ape:w-[400px] ape:[overflow-y:unset]! ape:bg-white2 ape:top-[56%]", title: 'Confirm Unstake', onDismiss: onDismiss, children: jsxs(Flex, { className: "ape:w-full ape:flex-col", children: [jsx(Flex, { className: "ape:text-[16px] ape:md:text-[20px] ape:font-semibold ape:md:font-bold", children: "Are you sure you want to unstake?" }), jsx(Flex, { className: "ape:text-[14px] ape:font-normal ape:mt-[10px]", children: `You'll lose the rewards that have not been accrued yet (${formatNumberSI(futureRewards)} ${userBill?.underlyingEarnToken?.symbol}).` }), jsxs(Flex, { className: "ape:w-full ape:mt-[15px] ape:font-normal ape:text-[14px] ape:items-center", children: [jsx(Checkbox, { checked: acknowledge, onChange: () => setAcknowledge(!acknowledge), className: "ape:mr-[10px]" }), "I understand and I want to proceed to unstake."] }), jsxs(Flex, { className: "ape:w-full ape:gap-[10px] ape:mt-[15px]", children: [jsx(Button, { className: "ape:w-full ape:text-[14px]! ape:h-[35px]", disabled: !acknowledge || loading || isLoadingOnChain, load: loading || isLoadingOnChain, onClick: handleUnstake, children: "Unstake" }), jsx(Button, { variant: "secondary", className: "ape:w-full ape:h-[35px] ape:text-[14px]!", onClick: onDismiss, children: "Cancel" })] })] }) }));
 };
 
 export { UnstakeModalYield as default };