@layerswap/widget 1.0.2 → 1.0.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/esm/components/ErrorFallback.js +1 -1
- package/dist/esm/components/Icons/QRIcon.js +1 -1
- package/dist/esm/components/Input/Address/AddressPicker/ManualAddressInput.js +1 -1
- package/dist/esm/components/Input/Address/AddressPicker/index.js +9 -9
- package/dist/esm/components/Input/Amount/PriceImpact.js +2 -2
- package/dist/esm/components/Input/Amount/ReceiveAmount.js +1 -1
- package/dist/esm/components/Input/Amount/index.js +1 -1
- package/dist/esm/components/Input/RoutePicker/Routes.js +1 -5
- package/dist/esm/components/Input/TransferCEX.js +1 -1
- package/dist/esm/components/Menu/MenuList.js +3 -4
- package/dist/esm/components/Modal/leaflet.js +3 -3
- package/dist/esm/components/Modal/modal.js +6 -16
- package/dist/esm/components/Modal/modalWithoutAnimation.js +2 -2
- package/dist/esm/components/Modal/vaulModal.js +1 -1
- package/dist/esm/components/Pages/Campaigns/Details/Leaderboard.js +2 -2
- package/dist/esm/components/Pages/Swap/Form/ExchangeForm.js +13 -14
- package/dist/esm/components/Pages/Swap/Form/FeeDetails/RefuelModal.js +12 -12
- package/dist/esm/components/Pages/Swap/Form/FeeDetails/index.js +5 -5
- package/dist/esm/components/Pages/Swap/Form/FormWrapper.js +2 -3
- package/dist/esm/components/Pages/Swap/Form/NetworkExchangeTabs.js +1 -1
- package/dist/esm/components/Pages/Swap/Form/SecondaryComponents/validationError/ErrorDisplay.js +1 -1
- package/dist/esm/components/Pages/Swap/Form/index.js +1 -1
- package/dist/esm/components/Pages/Swap/Withdraw/Failed.js +1 -1
- package/dist/esm/components/Pages/Swap/Withdraw/ManualWithdraw.js +1 -1
- package/dist/esm/components/Pages/Swap/Withdraw/NotFound.js +1 -1
- package/dist/esm/components/Pages/Swap/Withdraw/Processing/Processing.js +3 -5
- package/dist/esm/components/Pages/Swap/Withdraw/Summary/Summary.js +1 -1
- package/dist/esm/components/Pages/Swap/Withdraw/Wallet/index.js +2 -2
- package/dist/esm/components/Pages/Swap/Withdraw/messages/TransactionMessages.js +3 -3
- package/dist/esm/components/Pages/SwapHistory/HistorySummary.js +1 -1
- package/dist/esm/components/Pages/SwapHistory/StatusIcons.js +3 -3
- package/dist/esm/components/Pages/SwapHistory/SwapDetailsComponent.js +1 -1
- package/dist/esm/components/Wallet/WalletModal/ConnectorsList.js +1 -1
- package/dist/esm/components/Widget/Footer.js +1 -1
- package/dist/esm/components/Widget/Index.js +3 -2
- package/dist/esm/components/shadcn/tooltip.js +4 -1
- package/dist/esm/components/themeWrapper.js +2 -2
- package/dist/esm/context/LayerswapProvider.js +2 -1
- package/dist/esm/helpers/{getSettings.js → getSettings/getSettings.js} +1 -16
- package/dist/esm/helpers/getSettings/index.js +2 -0
- package/dist/esm/helpers/getSettings/useSettings.js +17 -0
- package/dist/esm/lib/AppSettings.js +1 -0
- package/dist/esm/lib/apiClients/index.js +2 -1
- package/dist/index.css +1 -1
- package/dist/tsconfig.tsbuildinfo +1 -1
- package/dist/types/components/Icons/QRIcon.d.ts +2 -1
- package/dist/types/components/Icons/QRIcon.d.ts.map +1 -1
- package/dist/types/components/Input/Address/AddressPicker/index.d.ts.map +1 -1
- package/dist/types/components/Input/Amount/PriceImpact.d.ts.map +1 -1
- package/dist/types/components/Input/RoutePicker/Routes.d.ts.map +1 -1
- package/dist/types/components/Menu/index.d.ts.map +1 -1
- package/dist/types/components/Modal/leaflet.d.ts +0 -1
- package/dist/types/components/Modal/leaflet.d.ts.map +1 -1
- package/dist/types/components/Modal/modal.d.ts +1 -2
- package/dist/types/components/Modal/modal.d.ts.map +1 -1
- package/dist/types/components/Pages/Campaigns/Details/Leaderboard.d.ts.map +1 -1
- package/dist/types/components/Pages/Swap/Form/ExchangeForm.d.ts.map +1 -1
- package/dist/types/components/Pages/Swap/Form/FeeDetails/RefuelModal.d.ts.map +1 -1
- package/dist/types/components/Pages/Swap/Form/FormWrapper.d.ts.map +1 -1
- package/dist/types/components/Pages/Swap/Form/NetworkExchangeTabs.d.ts.map +1 -1
- package/dist/types/components/Pages/Swap/Withdraw/Processing/Processing.d.ts.map +1 -1
- package/dist/types/components/Pages/Swap/Withdraw/messages/TransactionMessages.d.ts +2 -2
- package/dist/types/components/Pages/Swap/Withdraw/messages/TransactionMessages.d.ts.map +1 -1
- package/dist/types/components/Widget/Index.d.ts.map +1 -1
- package/dist/types/components/shadcn/tooltip.d.ts +2 -1
- package/dist/types/components/shadcn/tooltip.d.ts.map +1 -1
- package/dist/types/context/LayerswapProvider.d.ts +1 -0
- package/dist/types/context/LayerswapProvider.d.ts.map +1 -1
- package/dist/types/helpers/getSettings/getSettings.d.ts +7 -0
- package/dist/types/helpers/getSettings/getSettings.d.ts.map +1 -0
- package/dist/types/helpers/getSettings/index.d.ts +3 -0
- package/dist/types/helpers/getSettings/index.d.ts.map +1 -0
- package/dist/types/helpers/getSettings/useSettings.d.ts +6 -0
- package/dist/types/helpers/getSettings/useSettings.d.ts.map +1 -0
- package/dist/types/lib/AppSettings.d.ts +1 -0
- package/dist/types/lib/AppSettings.d.ts.map +1 -1
- package/dist/types/lib/apiClients/index.d.ts +2 -1
- package/dist/types/lib/apiClients/index.d.ts.map +1 -1
- package/package.json +1 -1
- package/dist/types/helpers/getSettings.d.ts +0 -12
- package/dist/types/helpers/getSettings.d.ts.map +0 -1
|
@@ -21,5 +21,5 @@ export default function ErrorFallback({ error, resetErrorBoundary }) {
|
|
|
21
21
|
boot();
|
|
22
22
|
show();
|
|
23
23
|
}, [boot, show]);
|
|
24
|
-
return (_jsx("div", { className: "styled-scroll", children: _jsx("main", { className: "styled-scroll", children: _jsxs("div", { className: "min-h-screen overflow-hidden relative font-robo", children: [_jsx("div", { className: "mx-auto max-w-lg bg-secondary-700 shadow-card rounded-lg w-full overflow-hidden relative px-6 pt-6 pb-2 h-[500px] min-h-[550px]", children: _jsxs(MessageComponent, { children: [_jsxs(MessageComponent.Content, { center: true, children: [_jsxs(MessageComponent.Header, { className: "mb-3", children: [_jsx("div", { className: "mx-auto mb-4 flex h-16 w-16 items-center justify-center rounded-full bg-red-600/20", children: _jsx(NotFoundIcon, {}) }), _jsx("h1", { className: "text-center text-2xl font-semibold text-
|
|
24
|
+
return (_jsx("div", { className: "styled-scroll", children: _jsx("main", { className: "styled-scroll", children: _jsxs("div", { className: "min-h-screen overflow-hidden relative font-robo", children: [_jsx("div", { className: "mx-auto max-w-lg bg-secondary-700 shadow-card rounded-lg w-full overflow-hidden relative px-6 pt-6 pb-2 h-[500px] min-h-[550px]", children: _jsxs(MessageComponent, { children: [_jsxs(MessageComponent.Content, { center: true, children: [_jsxs(MessageComponent.Header, { className: "mb-3", children: [_jsx("div", { className: "mx-auto mb-4 flex h-16 w-16 items-center justify-center rounded-full bg-red-600/20", children: _jsx(NotFoundIcon, {}) }), _jsx("h1", { className: "text-center text-2xl font-semibold text-primary-text", children: "Unable to complete the request" })] }), _jsx(MessageComponent.Description, { children: _jsxs("p", { className: "mx-auto text-center text-base font-normal leading-5 text-secondary-text px-9", children: [_jsx("span", { children: "Our team is informed and are now investigating the issue. Please try again, if the issue persists you can" }), _jsx("button", { type: "button", onClick: startIntercom, className: "mx-1 underline decoration-gray-400 underline-offset-2 hover:decoration-gray-200 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-[#0f1420] focus:ring-gray-400 rounded", children: _jsx("span", { children: "contact our support." }) })] }) })] }), _jsx(MessageComponent.Buttons, { children: _jsxs("div", { className: "flex flex-col w-full text-primary-text text-base space-y-2", children: [_jsx(SubmitButton, { style: { display: 'ruby' }, className: "py-3 text-center ", button_align: "right", text_align: "left", isDisabled: false, isSubmitting: false, onClick: () => resetErrorBoundary(), icon: _jsx(RotateCcw, { className: "h-5 w-5", "aria-hidden": "true" }), children: _jsx("span", { children: "Try Again" }) }), _jsxs("button", { onClick: resetErrorBoundary, type: "button", className: "w-full inline-flex items-center justify-center gap-2 rounded-xl bg-secondary-300 px-5 py-3 text-base font-semibold leading-6 hover:bg-secondary-400 focus:outline-none transition", children: [_jsx(Home, { className: "h-5 w-5", "aria-hidden": "true" }), _jsx("span", { children: "Back to app" })] })] }) })] }) }), _jsx("div", { id: "widget_root" })] }) }) }));
|
|
25
25
|
}
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
-
const QRIcon = (props) => (_jsxs("svg", { ...props, width: "28", height: "28", viewBox: "0 0 21 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [_jsx("path", { d: "M4.66043 11.2578H7.16043C7.85043 11.2578 8.43626 11.5053 8.91876 11.9995C9.41293 12.482 9.66043 13.0678 9.66043 13.7578V16.2578C9.66043 16.9478 9.41293 17.5403 8.91876 18.0353C8.6906 18.2695 8.41685 18.4545 8.11443 18.5787C7.81201 18.703 7.48733 18.7639 7.16043 18.7578H4.66043C4.33084 18.7627 4.00364 18.7013 3.69828 18.5772C3.39292 18.453 3.11564 18.2688 2.88293 18.0353C2.64948 17.8026 2.46522 17.5253 2.3411 17.22C2.21698 16.9146 2.15554 16.5874 2.16043 16.2578V13.7578C2.16043 13.0678 2.40209 12.482 2.88293 11.9995C3.37793 11.5053 3.97043 11.2578 4.66043 11.2578ZM7.16043 12.5078H4.66043C4.32209 12.5078 4.02876 12.6312 3.78209 12.8787C3.66137 12.9905 3.56579 13.1267 3.50172 13.2783C3.43764 13.4299 3.40652 13.5933 3.41043 13.7578V16.2578C3.41043 16.5962 3.53459 16.8895 3.78209 17.137C4.02876 17.3837 4.32209 17.5078 4.66043 17.5078H7.16043C7.51209 17.5078 7.80543 17.3837 8.03959 17.137C8.28709 16.8895 8.41043 16.5962 8.41043 16.2578V13.7578C8.41043 13.4062 8.28709 13.1128 8.03959 12.8787C7.92769 12.7581 7.79144 12.6627 7.63987 12.5987C7.4883 12.5348 7.32488 12.5038 7.16043 12.5078Z", fill: "
|
|
2
|
+
const QRIcon = (props) => (_jsxs("svg", { ...props, width: "28", height: "28", viewBox: "0 0 21 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [_jsx("path", { d: "M4.66043 11.2578H7.16043C7.85043 11.2578 8.43626 11.5053 8.91876 11.9995C9.41293 12.482 9.66043 13.0678 9.66043 13.7578V16.2578C9.66043 16.9478 9.41293 17.5403 8.91876 18.0353C8.6906 18.2695 8.41685 18.4545 8.11443 18.5787C7.81201 18.703 7.48733 18.7639 7.16043 18.7578H4.66043C4.33084 18.7627 4.00364 18.7013 3.69828 18.5772C3.39292 18.453 3.11564 18.2688 2.88293 18.0353C2.64948 17.8026 2.46522 17.5253 2.3411 17.22C2.21698 16.9146 2.15554 16.5874 2.16043 16.2578V13.7578C2.16043 13.0678 2.40209 12.482 2.88293 11.9995C3.37793 11.5053 3.97043 11.2578 4.66043 11.2578ZM7.16043 12.5078H4.66043C4.32209 12.5078 4.02876 12.6312 3.78209 12.8787C3.66137 12.9905 3.56579 13.1267 3.50172 13.2783C3.43764 13.4299 3.40652 13.5933 3.41043 13.7578V16.2578C3.41043 16.5962 3.53459 16.8895 3.78209 17.137C4.02876 17.3837 4.32209 17.5078 4.66043 17.5078H7.16043C7.51209 17.5078 7.80543 17.3837 8.03959 17.137C8.28709 16.8895 8.41043 16.5962 8.41043 16.2578V13.7578C8.41043 13.4062 8.28709 13.1128 8.03959 12.8787C7.92769 12.7581 7.79144 12.6627 7.63987 12.5987C7.4883 12.5348 7.32488 12.5038 7.16043 12.5078Z", fill: "currentColor" }), _jsx("path", { d: "M4.66104 2.07764H7.16104C7.85104 2.07764 8.43687 2.32514 8.91937 2.8193C9.41354 3.3018 9.66104 3.88764 9.66104 4.57764V7.07764C9.66104 7.76764 9.41354 8.36014 8.91937 8.85514C8.69121 9.08932 8.41746 9.27425 8.11504 9.39852C7.81262 9.52278 7.48794 9.58375 7.16104 9.57764H4.66104C4.33145 9.58253 4.00425 9.52108 3.69889 9.39696C3.39353 9.27284 3.11625 9.08858 2.88354 8.85514C2.65009 8.62243 2.46583 8.34515 2.34171 8.03979C2.21759 7.73443 2.15615 7.40722 2.16104 7.07764V4.57764C2.16104 3.88764 2.4027 3.3018 2.88354 2.8193C3.37854 2.32514 3.97104 2.07764 4.66104 2.07764ZM7.16104 3.32764H4.66104C4.3227 3.32764 4.02937 3.45097 3.7827 3.69847C3.66198 3.8103 3.56641 3.94651 3.50233 4.09809C3.43825 4.24966 3.40713 4.41312 3.41104 4.57764V7.07764C3.41104 7.41597 3.5352 7.7093 3.7827 7.9568C4.02937 8.20347 4.3227 8.32764 4.66104 8.32764H7.16104C7.5127 8.32764 7.80604 8.20347 8.0402 7.9568C8.2877 7.7093 8.41104 7.41597 8.41104 7.07764V4.57764C8.41104 4.22597 8.2877 3.93264 8.0402 3.69847C7.9283 3.57789 7.79205 3.48248 7.64048 3.41855C7.48891 3.35461 7.32549 3.32363 7.16104 3.32764Z", fill: "currentColor" }), _jsx("path", { d: "M13.8305 2.07764H16.3305C17.0205 2.07764 17.6063 2.32514 18.0888 2.8193C18.583 3.3018 18.8305 3.88764 18.8305 4.57764V7.07764C18.8305 7.76764 18.583 8.36014 18.0888 8.85514C17.8606 9.08932 17.5869 9.27425 17.2845 9.39852C16.982 9.52278 16.6574 9.58375 16.3305 9.57764H13.8305C13.5009 9.58253 13.1737 9.52108 12.8683 9.39696C12.563 9.27284 12.2857 9.08858 12.053 8.85514C11.8195 8.62243 11.6353 8.34515 11.5111 8.03979C11.387 7.73443 11.3256 7.40722 11.3305 7.07764V4.57764C11.3305 3.88764 11.5721 3.3018 12.053 2.8193C12.548 2.32514 13.1405 2.07764 13.8305 2.07764ZM16.3305 3.32764H13.8305C13.4921 3.32764 13.1988 3.45097 12.9521 3.69847C12.8314 3.8103 12.7358 3.94651 12.6718 4.09809C12.6077 4.24966 12.5766 4.41312 12.5805 4.57764V7.07764C12.5805 7.41597 12.7046 7.7093 12.9521 7.9568C13.1988 8.20347 13.4921 8.32764 13.8305 8.32764H16.3305C16.6821 8.32764 16.9755 8.20347 17.2096 7.9568C17.4571 7.7093 17.5805 7.41597 17.5805 7.07764V4.57764C17.5805 4.22597 17.4571 3.93264 17.2096 3.69847C17.0977 3.57789 16.9615 3.48248 16.8099 3.41855C16.6583 3.35461 16.4949 3.32363 16.3305 3.32764Z", fill: "currentColor" }), _jsx("path", { d: "M4.89463 4.83198C4.73879 4.98782 4.66046 5.18365 4.66046 5.41782L4.66129 6.25782C4.65987 6.47602 4.74357 6.68618 4.89463 6.84365C5.06463 6.99949 5.26629 7.07782 5.50046 7.07782H6.34046C6.4459 7.07958 6.55059 7.05971 6.64805 7.01943C6.74551 6.97916 6.83369 6.91933 6.90713 6.84365C7.07629 6.67449 7.16046 6.47865 7.16046 6.25782V5.41782C7.16296 5.30768 7.14161 5.1983 7.09789 5.09719C7.05416 4.99607 6.98909 4.9056 6.90713 4.83198C6.75046 4.66282 6.56129 4.57782 6.34046 4.57782H5.50046C5.38747 4.57653 5.27541 4.59842 5.17121 4.64213C5.06701 4.68585 4.97288 4.75046 4.89463 4.83198Z", fill: "currentColor" }), _jsx("path", { d: "M14.0746 4.83198C14.2438 4.66282 14.4396 4.57782 14.6605 4.57782H15.5005C15.6107 4.57542 15.7201 4.5969 15.8212 4.64077C15.9223 4.68464 16.0127 4.74987 16.0863 4.83198C16.1684 4.90552 16.2336 4.99596 16.2775 5.09708C16.3214 5.1982 16.3428 5.30762 16.3405 5.41782V6.25782C16.3403 6.36764 16.3177 6.47627 16.2739 6.57701C16.2302 6.67776 16.1664 6.7685 16.0863 6.84365C16.0098 6.92059 15.9183 6.98106 15.8176 7.02133C15.7168 7.06161 15.6089 7.08083 15.5005 7.07782H14.6605C14.4396 7.07782 14.2438 6.99948 14.0746 6.84365C13.9188 6.67448 13.8405 6.47865 13.8405 6.25782V5.41782C13.8374 5.30936 13.8567 5.20143 13.8969 5.10068C13.9372 4.99993 13.9977 4.90848 14.0746 4.83198Z", fill: "currentColor" }), _jsx("path", { d: "M5.17121 13.8221C5.27541 13.7784 5.38747 13.7565 5.50046 13.7578H6.34046C6.44759 13.7567 6.5537 13.7788 6.6515 13.8225C6.74931 13.8662 6.83651 13.9306 6.90713 14.0111C6.9877 14.0818 7.05205 14.169 7.09577 14.2668C7.1395 14.3646 7.16157 14.4707 7.16046 14.5778V15.4178C7.16186 15.5307 7.1401 15.6428 7.09653 15.747C7.05296 15.8512 6.9885 15.9453 6.90713 16.0236C6.83362 16.0992 6.74541 16.1588 6.64795 16.199C6.55049 16.2391 6.44584 16.2588 6.34046 16.257H5.50046C5.26629 16.257 5.06463 16.1795 4.89463 16.0236C4.73879 15.8536 4.66129 15.652 4.66129 15.4178V14.5786C4.65943 14.4733 4.67917 14.3686 4.7193 14.2712C4.75943 14.1737 4.8191 14.0855 4.89463 14.012C4.97288 13.9305 5.06701 13.8658 5.17121 13.8221Z", fill: "currentColor" }), _jsx("path", { d: "M15.5195 16.2378C15.4029 16.1078 15.2595 16.0428 15.0904 16.0428C15.0057 16.0403 14.9214 16.0565 14.8436 16.0902C14.7659 16.1239 14.6965 16.1743 14.6404 16.2378C14.5237 16.3553 14.4654 16.4986 14.4654 16.6678V17.9178C14.4639 18.0847 14.5266 18.2458 14.6404 18.3678C14.6995 18.4262 14.7699 18.4718 14.8473 18.5019C14.9247 18.532 15.0074 18.5459 15.0904 18.5428C15.1701 18.5445 15.2493 18.5298 15.3231 18.4997C15.3969 18.4696 15.4637 18.4247 15.5195 18.3678C15.5812 18.3102 15.6304 18.2405 15.6641 18.1631C15.6978 18.0857 15.7152 18.0022 15.7154 17.9178V16.6678C15.7154 16.4986 15.6504 16.3553 15.5195 16.2378Z", fill: "currentColor" }), _jsx("path", { d: "M18.5759 16.4311C18.6096 16.5054 18.6265 16.5862 18.6254 16.6678V17.9178C18.6254 18.0022 18.6081 18.0856 18.5745 18.163C18.541 18.2404 18.492 18.3101 18.4304 18.3678C18.3129 18.4845 18.1696 18.5428 18.0004 18.5428C17.8313 18.5428 17.6813 18.4845 17.5504 18.3678C17.4338 18.237 17.3754 18.087 17.3754 17.9178V16.6678C17.3737 16.588 17.3883 16.5087 17.4184 16.4347C17.4485 16.3607 17.4934 16.2937 17.5504 16.2378C17.6082 16.1763 17.6779 16.1273 17.7553 16.0937C17.8327 16.0602 17.9161 16.0429 18.0004 16.0428C18.082 16.0418 18.1629 16.0587 18.2372 16.0924C18.3115 16.1261 18.3775 16.1758 18.4304 16.2378C18.4925 16.2908 18.5422 16.3568 18.5759 16.4311Z", fill: "currentColor" }), _jsx("path", { d: "M12.8437 12.7811C12.8054 12.8203 12.7854 12.8653 12.7854 12.9178V17.9178C12.7866 18.0848 12.7237 18.2459 12.6096 18.3678C12.5507 18.4259 12.4805 18.4714 12.4035 18.5015C12.3264 18.5316 12.2439 18.5457 12.1612 18.5428C11.9912 18.5428 11.8412 18.4845 11.7112 18.3678C11.5937 18.237 11.5354 18.087 11.5354 17.9178V12.9178C11.5326 12.7251 11.5693 12.5338 11.6432 12.3558C11.7172 12.1778 11.8268 12.0168 11.9654 11.8828C12.2521 11.5961 12.5971 11.4528 13.0004 11.4528H14.2504C14.4432 11.45 14.6344 11.4867 14.8124 11.5606C14.9905 11.6346 15.1514 11.7442 15.2854 11.8828C15.5721 12.1695 15.7154 12.5145 15.7154 12.9178V14.1678C15.7171 14.225 15.7376 14.2801 15.7737 14.3245C15.7913 14.343 15.8125 14.3577 15.8361 14.3678C15.8596 14.3778 15.8849 14.3829 15.9104 14.3828H17.1604C17.1891 14.3843 17.2178 14.3799 17.2448 14.3698C17.2717 14.3598 17.2963 14.3444 17.3171 14.3245C17.3532 14.2801 17.3737 14.225 17.3754 14.1678V12.0778C17.3738 11.9981 17.3884 11.9189 17.4185 11.8451C17.4486 11.7713 17.4935 11.7045 17.5504 11.6486C17.608 11.587 17.6777 11.5378 17.7551 11.5041C17.8325 11.4704 17.916 11.453 18.0004 11.4528C18.0821 11.4519 18.1629 11.4689 18.2373 11.5028C18.3116 11.5366 18.3775 11.5864 18.4304 11.6486C18.4924 11.7015 18.542 11.7674 18.5757 11.8415C18.6094 11.9157 18.6263 11.9964 18.6254 12.0778V14.1678C18.6254 14.5711 18.4821 14.9161 18.1954 15.2028C17.9096 15.4895 17.5646 15.6328 17.1604 15.6328H15.9104C15.5071 15.6328 15.1621 15.4895 14.8754 15.2028C14.6021 14.9161 14.4654 14.5711 14.4654 14.1678V12.9178C14.4654 12.8653 14.4396 12.8203 14.3871 12.7811C14.3479 12.7286 14.3029 12.7028 14.2504 12.7028H13.0004C12.9487 12.7028 12.8962 12.7286 12.8437 12.7811Z", fill: "currentColor" })] }));
|
|
3
3
|
export default QRIcon;
|
|
@@ -37,7 +37,7 @@ const ManualAddressInput = ({ manualAddress, setManualAddress, setNewAddress, va
|
|
|
37
37
|
if (e.key === 'Enter') {
|
|
38
38
|
handleSaveNewAddress();
|
|
39
39
|
}
|
|
40
|
-
}, className: 'pr-12 disabled:cursor-not-allowed grow h-12 border border-secondary-800 focus:border-primary leading-4 placeholder:text-primary-text-tertiary/80 focus:placeholder:text-left placeholder:font-normal focus:placeholder:pl-0 placeholder:pl-8 block font-semibold w-full !bg-secondary-500 rounded-lg truncate hover:overflow-x-scroll focus:ring-0 focus:outline-hidden' }), !isFocused && !manualAddress &&
|
|
40
|
+
}, className: 'pr-12 disabled:cursor-not-allowed grow h-12 border border-secondary-800 focus:border-primary leading-4 placeholder:text-primary-text-tertiary/80 focus:placeholder:text-left placeholder:font-normal pl-3 focus:placeholder:pl-0 placeholder:pl-8 block font-semibold w-full !bg-secondary-500 rounded-lg truncate hover:overflow-x-scroll focus:ring-0 focus:outline-hidden' }), !isFocused && !manualAddress &&
|
|
41
41
|
_jsx(Pencil, { className: "h-5 w-5 text-primary-text-tertiary absolute inset-y-0 top-[calc(50%-10px)] left-4" }), manualAddress &&
|
|
42
42
|
_jsx("button", { type: "button", className: "absolute top-[calc(50%-10px)] right-4 hover:bg-secondary-400", onClick: handleRemoveNewDepositeAddress, children: _jsx(FilledX, { className: "h-5 w-5" }) })] }), errorMessage &&
|
|
43
43
|
_jsx("div", { className: "basis-full w-full text-start text-xs text-primary", children: errorMessage }), manualAddress && !errorMessage &&
|
|
@@ -5,13 +5,13 @@ import { isValidAddress } from "../../../../lib/address/validator";
|
|
|
5
5
|
import useWallet from "../../../../hooks/useWallet";
|
|
6
6
|
import { addressFormat } from "../../../../lib/address/formatter";
|
|
7
7
|
import ManualAddressInput from "./ManualAddressInput";
|
|
8
|
-
import Modal from "../../../../components/Modal/modal";
|
|
9
8
|
import ConnectWalletButton from "../../../../components/Common/ConnectWalletButton";
|
|
10
9
|
import AddressBook from "./AddressBook";
|
|
11
10
|
import AddressButton from "./AddressButton";
|
|
12
11
|
import { useInitialSettings } from "../../../../context/settings";
|
|
13
12
|
import ConnectedWallets from "./ConnectedWallets";
|
|
14
13
|
import { useSelectedAccount, useUpdateBalanceAccount } from "../../../../context/balanceAccounts";
|
|
14
|
+
import VaulDrawer from "../../../../components/Modal/vaulModal";
|
|
15
15
|
export var AddressGroup;
|
|
16
16
|
(function (AddressGroup) {
|
|
17
17
|
AddressGroup["ConnectedWallet"] = "Connected wallet";
|
|
@@ -99,14 +99,14 @@ const AddressPicker = forwardRef(function Address({ showAddressModal, setShowAdd
|
|
|
99
99
|
inputReference?.current?.focus();
|
|
100
100
|
}
|
|
101
101
|
}, [canFocus]);
|
|
102
|
-
return (_jsxs(_Fragment, { children: [_jsx(AddressButton, { addressItem: destinationAddressItem, openAddressModal: () => setShowAddressModal(true), connectedWallet: connectedWallet, partner: partner, destination: destination, children: children({ destination, addressItem: destinationAddressItem, connectedWallet: connectedWallet, partner }) }), _jsx(
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
102
|
+
return (_jsxs(_Fragment, { children: [_jsx(AddressButton, { addressItem: destinationAddressItem, openAddressModal: () => setShowAddressModal(true), connectedWallet: connectedWallet, partner: partner, destination: destination, children: children({ destination, addressItem: destinationAddressItem, connectedWallet: connectedWallet, partner }) }), _jsx(VaulDrawer, { header: 'Send To', show: showAddressModal, setShow: setShowAddressModal, modalId: "address", children: _jsx(VaulDrawer.Snap, { id: "item-1", children: _jsx("div", { className: 'w-full flex flex-col justify-between h-full text-primary-text min-h-[200px]', children: _jsxs("div", { className: 'flex flex-col self-center grow w-full space-y-5 h-full', children: [destination
|
|
103
|
+
&& provider
|
|
104
|
+
&& !connectedWallets.length &&
|
|
105
|
+
_jsx(ConnectWalletButton, { provider: provider, onConnect: onConnect }), _jsx(ManualAddressInput, { manualAddress: manualAddress, setManualAddress: setManualAddress, setNewAddress: (props) => { setNewAddress(props); updateDestAddress(props?.address); }, values: values, partner: partner, name: name, inputReference: inputReference, setFieldValue: setFieldValue, close: close, addresses: groupedAddresses, connectedWallet: connectedWallet }), destination
|
|
106
|
+
&& provider
|
|
107
|
+
&& !manualAddress &&
|
|
108
|
+
_jsx(ConnectedWallets, { provider: provider, notCompatibleWallets: unAvailableWallets, onClick: (props) => handleSelectAddress(props.address), onConnect: onConnect, destination: destination, destination_address: destination_address }), addressBookAddresses && addressBookAddresses?.length > 0 && !manualAddress && destination &&
|
|
109
|
+
_jsx(AddressBook, { addressBook: addressBookAddresses, onSelectAddress: handleSelectAddress, destination: destination, destination_address: destination_address, partner: partner })] }) }) }) })] }));
|
|
110
110
|
});
|
|
111
111
|
const resolveAddressGroups = ({ address_book, destination, wallets, newAddress, addressFromQuery, }) => {
|
|
112
112
|
if (!destination)
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
2
2
|
import { useMemo } from "react";
|
|
3
3
|
import { Triangle } from "lucide-react";
|
|
4
|
-
import { Tooltip, TooltipContent, TooltipTrigger } from "../../../components/shadcn/tooltip";
|
|
4
|
+
import { Tooltip, TooltipArrow, TooltipContent, TooltipTrigger } from "../../../components/shadcn/tooltip";
|
|
5
5
|
import clsx from 'clsx';
|
|
6
6
|
export const PriceImpact = ({ receiveAmount, requestedAmount, sourceTokenPriceUsd, destinationTokenPriceUsd, serviceFee, bridgeFee, className, }) => {
|
|
7
7
|
const toAmountUSD = useMemo(() => {
|
|
@@ -41,7 +41,7 @@ export const PriceImpact = ({ receiveAmount, requestedAmount, sourceTokenPriceUs
|
|
|
41
41
|
}, [fromAmountUSD, toAmountUSD]);
|
|
42
42
|
if (priceImpact === undefined)
|
|
43
43
|
return null;
|
|
44
|
-
return (_jsx(_Fragment, { children: _jsxs(Tooltip, { openOnClick: true, children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx("span", { className: clsx("flex text-secondary-text items-center cursor-default hover:text-primary-text", className), children: _jsxs("span", { className: "flex items-center gap-0.5", children: [_jsx("span", { children: "(" }), _jsx(Triangle, { fill: "currentColor", className: `w-3.5 h-3.5 stroke-1 fill-current transition-transform ${priceImpact < 0 ? "rotate-180" : ""}` }), _jsxs("span", { children: ["$", Math.abs(priceImpact).toFixed(2)] }), _jsx("span", { children: ")" })] }) }) }), _jsxs(TooltipContent, { arrowClasses: "!bg-secondary-500 !fill-secondary-500", side: "top", align: "center", className: "!bg-secondary-500 !border-secondary-500 !text-secondary-text text-xs font-normal rounded-xl !p-4 shadow-
|
|
44
|
+
return (_jsx(_Fragment, { children: _jsxs(Tooltip, { openOnClick: true, children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx("span", { className: clsx("flex text-secondary-text items-center cursor-default hover:text-primary-text", className), children: _jsxs("span", { className: "flex items-center gap-0.5", children: [_jsx("span", { children: "(" }), _jsx(Triangle, { fill: "currentColor", className: `w-3.5 h-3.5 stroke-1 fill-current transition-transform ${priceImpact < 0 ? "rotate-180" : ""}` }), _jsxs("span", { children: ["$", Math.abs(priceImpact).toFixed(2)] }), _jsx("span", { children: ")" })] }) }) }), _jsxs(TooltipContent, { arrowClasses: "!bg-secondary-500 !fill-secondary-500", side: "top", align: "center", className: "!bg-secondary-500 !border-secondary-500 !text-secondary-text text-xs font-normal rounded-xl !p-4 shadow-card", children: [_jsxs("p", { className: "text-primary-text font-medium text-sm flex items-baseline space-x-0.5 mb-1", children: [_jsx("span", { children: "Price impact:" }), _jsx("span", { children: formatCurrency(priceImpact) }), _jsx("span", { className: "text-secondary-text text-xs font-normal", children: priceImpactPercentage ? `(${priceImpact < 0 ? "-" : "+"}${Math.abs(priceImpactPercentage)}%)` : "" })] }), _jsx("p", { children: "This is the difference in total USD value" }), _jsx("p", { children: "between the assets you send and the assets you receive." }), _jsxs("ul", { className: "mt-3 space-y-2 ", children: [_jsxs("li", { className: "list-none flex justify-between", children: [_jsx("span", { children: "Market impact" }), _jsx("span", { className: "text-primary-text", children: _jsx("span", { children: formatCurrency(marketImpact) }) })] }), _jsxs("li", { className: "list-none flex justify-between", children: [_jsx("span", { children: "Bridge expenses" }), _jsxs("span", { className: "text-primary-text", children: [_jsx("span", { children: bridgeExpenses?.toFixed(2) !== (0).toFixed(2) ? "-$" : "$" }), _jsx("span", { children: Math.abs(Number(bridgeExpenses)).toFixed(2) })] })] }), _jsxs("li", { className: "list-none flex justify-between", children: [_jsx("span", { children: "Layerswap fees" }), _jsxs("span", { className: "text-primary-text", children: [_jsx("span", { children: layerswapFees?.toFixed(2) !== (0).toFixed(2) ? "-$" : "$" }), _jsx("span", { children: Math.abs(Number(layerswapFees)).toFixed(2) })] })] })] }), _jsx(TooltipArrow, { className: "!bg-secondary-500 !fill-secondary-500" })] })] }) }));
|
|
45
45
|
};
|
|
46
46
|
const formatCurrency = (value, decimals = 2) => {
|
|
47
47
|
if (value === undefined || isNaN(value))
|
|
@@ -6,5 +6,5 @@ export const ReceiveAmount = ({ source_token, destination_token, fee, isFeeLoadi
|
|
|
6
6
|
const receive_amount = fee?.quote.receive_amount;
|
|
7
7
|
const receiveAmountInUsd = receive_amount && destination_token && fee.quote?.destination_token?.price_in_usd ? (receive_amount * fee.quote.destination_token.price_in_usd).toFixed(2) : undefined;
|
|
8
8
|
const quote = fee?.quote;
|
|
9
|
-
return (_jsx(_Fragment, { children: _jsxs("div", { className: "flex flex-col min-w-0 font-normal border-0 text-[28px] leading-7 text-primary-text w-full relative truncate", children: [_jsx("div", { className: "flex items-center justify-start w-full relative", children: _jsx("div", { className: clsx("w-full flex items-center
|
|
9
|
+
return (_jsx(_Fragment, { children: _jsxs("div", { className: "flex flex-col min-w-0 font-normal border-0 text-[28px] leading-7 text-primary-text w-full relative truncate", children: [_jsx("div", { className: "flex items-center justify-start w-full relative", children: _jsx("div", { className: clsx("w-full flex items-center pt-2 pr-3", { "animate-pulse-stronger": isFeeLoading }, { "text-secondary-text": !receive_amount }), children: _jsx(NumberFlow, { value: receive_amount || 0, trend: 0, format: { maximumFractionDigits: fee?.quote.destination_token?.decimals || 2 } }) }) }), _jsxs("div", { className: "flex items-baseline space-x-2 h-5", children: [_jsx("span", { className: "text-base leading-5 font-medium text-secondary-text h-5", children: _jsx(NumberFlow, { className: "p-0", value: Number(receiveAmountInUsd) || 0, format: { style: 'currency', currency: 'USD', maximumFractionDigits: receiveAmountInUsd ? 2 : 0 }, trend: 0 }) }), _jsx(PriceImpact, { className: "h-5 text-base leading-5", bridgeFee: quote?.blockchain_fee, destinationTokenPriceUsd: quote?.destination_token?.price_in_usd, receiveAmount: quote?.receive_amount, requestedAmount: quote?.requested_amount, serviceFee: quote?.service_fee, sourceTokenPriceUsd: quote?.source_token?.price_in_usd })] })] }) }));
|
|
10
10
|
};
|
|
@@ -38,7 +38,7 @@ const AmountField = forwardRef(function AmountField({ usdPosition = "bottom", ac
|
|
|
38
38
|
const disabled = Boolean(fromExchange && !toCurrency);
|
|
39
39
|
return (_jsx(_Fragment, { children: _jsxs("div", { className: clsx("flex flex-col bg-secondary-500 space-y-0.5 relative w-full group", className, {
|
|
40
40
|
'focus-within:[&_.usd-suffix]:invisible': usdPosition === "right"
|
|
41
|
-
}), children: [_jsx(NumericInput, { disabled: disabled, placeholder: placeholder, step: isNaN(step) ? 0.01 : step, name: name, ref: amountRef, precision: fromCurrency?.precision, tempValue: actionValue, className: "w-full text-[28px] leading-[34px] rounded-xl text-primary-text focus:outline-none focus:border-none focus:ring-0 duration-300 ease-in-out !bg-secondary-500 !font-normal group-[.exchange-amount-field]:px-2.5 group-[.exchange-amount-field]:pb-2 group-[.exchange-amount-field]:pr-2 group-[.exchange-amount-field]:bg-secondary-300! pl-0", onChange: e => {
|
|
41
|
+
}), children: [_jsx(NumericInput, { disabled: disabled, placeholder: placeholder, step: isNaN(step) ? 0.01 : step, name: name, ref: amountRef, precision: fromCurrency?.precision, tempValue: actionValue, className: "w-full text-[28px] leading-[34px] pt-2 rounded-xl text-primary-text focus:outline-none focus:border-none focus:ring-0 duration-300 ease-in-out !bg-secondary-500 !font-normal group-[.exchange-amount-field]:px-2.5 group-[.exchange-amount-field]:pb-2 group-[.exchange-amount-field]:pr-2 group-[.exchange-amount-field]:bg-secondary-300! pl-0", onChange: e => {
|
|
42
42
|
/^[0-9]*[.,]?[0-9]*$/.test(e.target.value) && handleChange(e);
|
|
43
43
|
} }), _jsx("div", { className: clsx("usd-suffix text-base leading-5 font-medium text-secondary-text pointer-events-none", {
|
|
44
44
|
"absolute bottom-3": usdPosition === "right",
|
|
@@ -27,11 +27,7 @@ export const NetworkTokenTitle = (props) => {
|
|
|
27
27
|
return _jsx(SelectItem.DetailedTitle, { title: item.symbol, secondaryImageAlt: route.display_name, secondary: _jsxs("div", { className: "flex items-center gap-1", children: [_jsx("span", { children: route.display_name }), _jsx("div", { className: "transition-all duration-300 opacity-0 group-hover:opacity-100 group-hover:delay-400 click-delay-on-hover", children: item.contract ?
|
|
28
28
|
_jsx(ExtendedAddress, { network: route, isForCurrency: true, showDetails: true, address: item.contract, logo: item.logo, title: item.symbol, description: item.display_asset, children: _jsxs("div", { className: "flex items-center gap-1 text-secondary-text text-xs cursor-pointer hover:text-primary-text", children: [_jsxs("p", { className: "max-w-[90px] truncate", children: [_jsx("span", { children: "\u2022" }), " ", _jsx("span", { children: item.display_asset || item.symbol })] }), _jsx(Info, { className: "h-3 w-3" })] }) })
|
|
29
29
|
:
|
|
30
|
-
_jsxs("p", { className: "flex items-center gap-1 text-xs text-secondary-text", children: [_jsx("span", { children: "\u2022" }), _jsx("span", { className: "truncate max-w-[80px]", children: item.display_asset || item.symbol })] }) })] }), secondaryLogoSrc: route.logo, children: (allbalancesLoaded && tokenbalance && Number(tokenbalance?.amount)
|
|
31
|
-
'text-lg leading-[22px]': type === 'suggested_token',
|
|
32
|
-
}), children: formatUsd(usdAmount) })), _jsx("div", { className: clsx({
|
|
33
|
-
'text-xs leading-4': type == 'suggested_token',
|
|
34
|
-
}), children: formatted_balance_amount })] })) : !allbalancesLoaded ? (_jsx("span", { className: "px-0.5", children: "-" })) : (_jsx(_Fragment, {})) });
|
|
30
|
+
_jsxs("p", { className: "flex items-center gap-1 text-xs text-secondary-text", children: [_jsx("span", { children: "\u2022" }), _jsx("span", { className: "truncate max-w-[80px]", children: item.display_asset || item.symbol })] }) })] }), secondaryLogoSrc: route.logo, children: (allbalancesLoaded && tokenbalance && Number(tokenbalance?.amount) > 0) ? (_jsxs("span", { className: "text-sm text-secondary-text text-right my-auto leading-4 font-medium", children: [Number(usdAmount) > 0 && (_jsx("div", { className: clsx("text-primary-text text-base", { '!text-lg !leading-[22px]': type === 'suggested_token' }), children: formatUsd(usdAmount) })), _jsx("div", { className: 'text-xs leading-4', children: formatted_balance_amount })] })) : !allbalancesLoaded ? (_jsx("span", { className: "px-0.5", children: "-" })) : (_jsx(_Fragment, {})) });
|
|
35
31
|
};
|
|
36
32
|
export const NetworkRouteSelectItemDisplay = (props) => {
|
|
37
33
|
const { item, direction, allbalancesLoaded, hideTokenImages } = props;
|
|
@@ -7,7 +7,7 @@ const TransferCEX = ({ direction }) => {
|
|
|
7
7
|
const exchangeNetwork = (direction === 'from' ? from : to);
|
|
8
8
|
const sourceLogo = fromExchange ? fromExchange.logo : from?.logo;
|
|
9
9
|
const destinationLogo = toExchange ? toExchange.logo : to?.logo;
|
|
10
|
-
const learnMoreUrl = fromExchange ? 'https://
|
|
10
|
+
const learnMoreUrl = fromExchange ? 'https://learn.layerswap.io/user-docs/layerswap-app/transfer-from-cex/' : 'https://learn.layerswap.io/user-docs/layerswap-app/transfer-to-cex/';
|
|
11
11
|
return (_jsx("div", { className: "font-normal flex flex-col w-full relative z-10 my-3 pb-4 border-b-2 border-b-secondary", children: _jsxs("div", { className: "w-full px-2.5 space-y-2", children: [_jsx("div", { className: "flex items-center mb-", children: _jsxs("p", { className: "text-primary-text-tertiary text-base leading-5", children: [_jsx("span", { children: "Please select an intermediary network available on " }), _jsxs("span", { children: [fromExchange ? fromExchange.display_name : toExchange?.display_name, "\u00A0"] }), _jsx("span", { children: "to be used for " }), _jsx("span", { children: fromExchange ? 'withdrawal' : 'deposit' }), _jsx("span", { children: "." }), _jsx("a", { target: '_blank', href: learnMoreUrl, className: 'text-primary-text-tertiary underline hover:no-underline decoration-primary-text-tertiary ml-1 cursor-pointer', children: "Learn more" })] }) }), _jsxs("div", { className: "relative flex items-center space-x-2 py-2", children: [_jsx("div", { className: "shrink-0 h-6 w-6 relative", children: sourceLogo && _jsx(ImageWithFallback, { src: sourceLogo, alt: "Project Logo", height: "40", width: "40", loading: "eager", className: "rounded-md object-contain" }) }), _jsx("div", { className: "w-full h-[2px] bg-primary-text-tertiary my-2 line line-left" }), _jsx("div", { className: "shrink-0 h-8 w-8 relative", children: exchangeNetwork ? _jsx(ImageWithFallback, { src: exchangeNetwork.logo, alt: "Project Logo", height: "40", width: "40", loading: "eager", className: "rounded-md object-contain" }) : _jsx("div", { className: "mainImage flex justify-center items-center bg-secondary-400 h-full w-full rounded-md", children: _jsx("span", { className: "font-bold text-primary-text-tertiary text-xl", children: "?" }) }) }), _jsx("div", { className: "w-full h-[2px] bg-primary-text-tertiary my-2 line line-right" }), _jsx("div", { className: "shrink-0 h-6 w-6 relative", children: destinationLogo && _jsx(ImageWithFallback, { src: destinationLogo, alt: "Project Logo", height: "40", width: "40", loading: "eager", className: "rounded-md object-contain" }) })] })] }) }));
|
|
12
12
|
};
|
|
13
13
|
export default TransferCEX;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
-
import { BookOpen, Gift, Map,
|
|
2
|
+
import { BookOpen, Gift, Map, ScrollText, LibraryIcon, Shield, Users, MessageSquarePlus } from "lucide-react";
|
|
3
3
|
import { useState } from "react";
|
|
4
4
|
import { useIntercom } from "react-use-intercom";
|
|
5
5
|
import ChatIcon from "../Icons/ChatIcon";
|
|
@@ -19,14 +19,13 @@ const MenuList = ({ goToStep }) => {
|
|
|
19
19
|
const handleCloseFeedback = () => {
|
|
20
20
|
setOpenFeedbackModal(false);
|
|
21
21
|
};
|
|
22
|
-
return _jsx("div", { className: "text-sm font-medium focus:outline-hidden h-full", children: _jsxs(Menu, { children: [_jsx(WalletsMenu, {}), _jsx(Menu.Group, { children: _jsxs(_Fragment, { children: [window.location.pathname != '/' &&
|
|
23
|
-
_jsx(Menu.Item, { pathname: '/', icon: _jsx(Home, { className: "h-5 w-5" }), children: "Home" }), window.location.pathname != '/transactions' &&
|
|
22
|
+
return _jsx("div", { className: "text-sm font-medium focus:outline-hidden h-full", children: _jsxs(Menu, { children: [_jsx(WalletsMenu, {}), _jsx(Menu.Group, { children: _jsxs(_Fragment, { children: [window.location.pathname != '/transactions' &&
|
|
24
23
|
_jsx(Menu.Item, { onClick: () => goToStep(MenuStep.Transactions, "/transactions"), icon: _jsx(ScrollText, { className: "h-5 w-5" }), children: "Transactions" }), window.location.pathname != '/campaigns' &&
|
|
25
24
|
_jsx(Menu.Item, { onClick: () => goToStep(MenuStep.Campaigns, '/campaigns'), icon: _jsx(Gift, { className: "h-5 w-5" }), children: "Campaigns" })] }) }), _jsxs(Menu.Group, { children: [_jsx(Menu.Item, { onClick: () => {
|
|
26
25
|
boot();
|
|
27
26
|
show();
|
|
28
27
|
update();
|
|
29
|
-
}, target: "_blank", icon: _jsx(ChatIcon, { strokeWidth: 2, className: "h-5 w-5" }), children: "Help" }), _jsx(Menu.Item, { pathname: 'https://
|
|
28
|
+
}, target: "_blank", icon: _jsx(ChatIcon, { strokeWidth: 2, className: "h-5 w-5" }), children: "Help" }), _jsx(Menu.Item, { pathname: 'https://learn.layerswap.io/', target: "_blank", icon: _jsx(BookOpen, { className: "h-5 w-5" }), children: "Docs for Users" }), _jsx(Menu.Item, { pathname: 'https://learn.layerswap.io/user-docs/partners-and-integrations/', target: "_blank", icon: _jsx(Users, { className: "h-5 w-5" }), children: "Docs for Partners" })] }), _jsxs(Menu.Group, { children: [_jsx(Menu.Item, { pathname: 'https://learn.layerswap.io/user-docs/more-information/privacy-policy/', target: "_blank", icon: _jsx(Shield, { className: "h-5 w-5" }), children: "Privacy Policy" }), _jsx(Menu.Item, { pathname: 'https://learn.layerswap.io/user-docs/more-information/terms-of-services/', target: "_blank", icon: _jsx(LibraryIcon, { className: "h-5 w-5" }), children: "Terms of Service" })] }), _jsx(Menu.Group, { children: _jsx(Popover, { opener: _jsx(Menu.Item, { onClick: () => setOpenFeedbackModal(true), target: "_blank", icon: _jsx(MessageSquarePlus, { className: "h-5 w-5" }), children: "Suggest a Feature" }), isNested: true, show: openFeedbackModal, header: "Suggest a Feature", setShow: setOpenFeedbackModal, popoverId: "feedback", children: _jsx("div", { className: "p-0 md:max-w-md", children: _jsx(SendFeedback, { onSend: handleCloseFeedback }) }) }) }), _jsxs("div", { className: "space-y-3 w-full", children: [_jsx("hr", { className: "border-secondary-500" }), _jsx("p", { className: "text-primary-text-tertiary flex justify-center my-3", children: "Media links & suggestions:" })] }), _jsx("div", { className: "grid grid-cols-2 gap-2 justify-center", children: navigation.social.map((item, index) => (_jsx("a", { target: "_blank", href: item.href, className: `flex relative bg-secondary-500 hover:bg-secondary-400 rounded-xl cursor-pointer select-none items-center outline-hidden text-primary-text ${item.className}`, rel: "noopener noreferrer", children: _jsxs("div", { className: "p-2 w-full flex justify-center gap-1", children: [_jsx(item.icon, { className: "h-5 w-5", "aria-hidden": "true" }), _jsx("p", { children: item.name })] }) }, index))) })] }) });
|
|
30
29
|
};
|
|
31
30
|
const navigation = {
|
|
32
31
|
social: [
|
|
@@ -6,11 +6,11 @@ import IconButton from '../Buttons/iconButton';
|
|
|
6
6
|
import { X } from 'lucide-react';
|
|
7
7
|
import useWindowDimensions from '../../hooks/useWindowDimensions';
|
|
8
8
|
// TODO handle overflow when height is set to 'fit'
|
|
9
|
-
export const Leaflet = forwardRef(function Leaflet({ show, setShow, children, title, className, height, position, onClose
|
|
9
|
+
export const Leaflet = forwardRef(function Leaflet({ show, setShow, children, title, className, height, position, onClose }, topmostRef) {
|
|
10
10
|
const mobileModalRef = useRef(null);
|
|
11
11
|
const controls = useAnimation();
|
|
12
12
|
const transitionProps = { type: "spring", stiffness: 500, damping: 40 };
|
|
13
|
-
const { isMobile } = useWindowDimensions();
|
|
13
|
+
const { isMobileWithPortal: isMobile } = useWindowDimensions();
|
|
14
14
|
const handleDragEnd = useCallback(async (_, info) => {
|
|
15
15
|
const offset = info.offset.y;
|
|
16
16
|
const velocity = info.velocity.y;
|
|
@@ -60,5 +60,5 @@ export const Leaflet = forwardRef(function Leaflet({ show, setShow, children, ti
|
|
|
60
60
|
default:
|
|
61
61
|
wrapperHeightClass = '';
|
|
62
62
|
}
|
|
63
|
-
return (_jsxs("div", { ref: topmostRef, children: [_jsx(motion.div, { className: `${position} inset-0 z-40 bg-black/50 block`, initial: { opacity: 0 }, animate: { opacity: 1 }, exit: { opacity: 0 }, onClick: handleCloseModal }, "backdrop"), _jsx(motion.div, { ref: mobileModalRef, animate: controls, className: `max-h-full overflow-y-hidden group ${position} inset-x-0 bottom-0 z-40 w-full ${height != 'full' ? 'rounded-t-
|
|
63
|
+
return (_jsxs("div", { ref: topmostRef, children: [_jsx(motion.div, { className: `${position} inset-0 z-40 bg-black/50 block`, initial: { opacity: 0 }, animate: { opacity: 1 }, exit: { opacity: 0 }, onClick: handleCloseModal }, "backdrop"), _jsx(motion.div, { ref: mobileModalRef, animate: controls, className: `max-h-full overflow-y-hidden group ${position} inset-x-0 bottom-0 z-40 w-full ${height != 'full' ? 'rounded-t-xl' : ''} bg-secondary-900 ${wrapperHeightClass} ${className} shadow-lg`, initial: { y: "20%" }, exit: { y: "100%" }, transition: transitionProps, drag: height != 'full' ? "y" : false, dragDirectionLock: true, onDragEnd: handleDragEnd, dragElastic: { top: 0, bottom: 1 }, dragConstraints: { top: 0, bottom: 0 }, children: _jsxs("div", { className: `py-3 overflow-y-auto flex flex-col h-full z-40 ${height != 'full' ? 'bg-secondary-900 rounded-t-2xl ' : ''} pb-6`, children: [_jsxs("div", { className: `px-6 pb-2 flex justify-between items-center ${height != 'full' && 'hover:cursor-grab'}`, children: [_jsx("div", { className: "text-lg text-secondary-text font-semibold", children: _jsx("div", { children: title }) }), _jsx("div", { className: '-mr-2', children: _jsx(IconButton, { onClick: handleCloseModal, icon: _jsx(X, { strokeWidth: 3 }) }) })] }), _jsx("div", { className: 'select-text max-h-full overflow-y-auto overflow-x-hidden styled-scroll px-6 h-full', id: "virtualListContainer", children: children })] }) }, "mobile-modal")] }));
|
|
64
64
|
});
|
|
@@ -1,29 +1,19 @@
|
|
|
1
1
|
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { AnimatePresence } from "framer-motion";
|
|
2
3
|
import { useEffect, useRef, useState } from "react";
|
|
3
4
|
import useWindowDimensions from "../../hooks/useWindowDimensions";
|
|
4
5
|
import { Leaflet } from "./leaflet";
|
|
5
6
|
import ReactPortal from "../Common/ReactPortal";
|
|
6
|
-
const Modal = (({ header, height, className, children, subHeader, show, setShow, modalId, onClose
|
|
7
|
-
const {
|
|
7
|
+
const Modal = (({ header, height, className, children, subHeader, show, setShow, modalId, onClose }) => {
|
|
8
|
+
const { isMobileWithPortal, isDesktop } = useWindowDimensions();
|
|
8
9
|
const mobileModalRef = useRef(null);
|
|
9
10
|
//Fixes draggebles closing
|
|
10
11
|
const [delayedShow, setDelayedShow] = useState();
|
|
11
12
|
useEffect(() => {
|
|
12
13
|
setDelayedShow(show);
|
|
13
14
|
}, [show]);
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
setShow(false);
|
|
18
|
-
onClose && onClose();
|
|
19
|
-
}
|
|
20
|
-
};
|
|
21
|
-
document.addEventListener("keydown", handleKeyDown);
|
|
22
|
-
return () => {
|
|
23
|
-
document.removeEventListener("keydown", handleKeyDown);
|
|
24
|
-
};
|
|
25
|
-
}, [delayedShow, onClose]);
|
|
26
|
-
return (_jsxs(_Fragment, { children: [isDesktop && (_jsx(ReactPortal, { wrapperId: "widget", children: delayedShow &&
|
|
27
|
-
_jsx(Leaflet, { position: "absolute", height: height ?? 'full', show: delayedShow, setShow: setShow, title: header, description: subHeader, className: className, onClose: onClose, walletComp: walletComp, children: children }, modalId) })), isMobile && delayedShow && (_jsx(Leaflet, { position: "fixed", height: height == 'full' ? '80%' : height == 'fit' ? 'fit' : (height == '80%' || height == '90%') ? height : 'full', ref: mobileModalRef, show: delayedShow, setShow: setShow, title: header, description: subHeader, className: className, onClose: onClose, walletComp: walletComp, children: children }, modalId))] }));
|
|
15
|
+
return (_jsxs(_Fragment, { children: [(isDesktop || (!isDesktop && !isMobileWithPortal)) && (_jsx(ReactPortal, { wrapperId: "widget_root", children: _jsx(AnimatePresence, { children: delayedShow &&
|
|
16
|
+
_jsx(Leaflet, { position: "absolute", height: height ?? 'full', show: delayedShow, setShow: setShow, title: header, description: subHeader, className: className, onClose: onClose, children: children }, modalId) }) })), isMobileWithPortal && (_jsx(AnimatePresence, { children: delayedShow &&
|
|
17
|
+
_jsx(Leaflet, { position: "fixed", height: height == 'full' ? '80%' : height == 'fit' ? 'fit' : (height == '80%' || height == '90%') ? height : 'full', ref: mobileModalRef, show: delayedShow, setShow: setShow, title: header, description: subHeader, className: className, onClose: onClose, children: children }, modalId) }))] }));
|
|
28
18
|
});
|
|
29
19
|
export default Modal;
|
|
@@ -35,7 +35,7 @@ export const ModalContent = (props) => {
|
|
|
35
35
|
}, [isOpen]);
|
|
36
36
|
if (!isOpen)
|
|
37
37
|
return null;
|
|
38
|
-
const modalElement = (_jsxs("div", { className: clsx("absolute inset-0 z-50 bg-secondary-700 rounded-t-3xl sm:rounded-3xl flex flex-col", className), children: [(header || showCloseButton) && (_jsx("div", { className: "w-full relative", children: _jsxs("div", { className: "flex items-center w-full text-left justify-between px-4 pt-2 pb-2 gap-x-2 sm:gap-x-1", children: [_jsx("div", { className: "flex-1 text-lg text-secondary-text font-semibold w-full flex justify-end", children: header }), showCloseButton && (_jsx(IconButton, { onClick: closeModal, className: "active:animate-press-down", icon: _jsx(X, { strokeWidth:
|
|
38
|
+
const modalElement = (_jsxs("div", { className: clsx("absolute inset-0 z-50 bg-secondary-700 rounded-t-3xl sm:rounded-3xl flex flex-col", className), children: [(header || showCloseButton) && (_jsx("div", { className: "w-full relative", children: _jsxs("div", { className: "flex items-center w-full text-left justify-between px-4 pt-2 pb-2 gap-x-2 sm:gap-x-1", children: [_jsx("div", { className: "flex-1 text-lg text-secondary-text font-semibold w-full flex justify-end", children: header }), showCloseButton && (_jsx(IconButton, { onClick: closeModal, className: "active:animate-press-down", icon: _jsx(X, { strokeWidth: 2 }) }))] }) })), _jsx("div", { className: "flex flex-col w-full h-full max-h-[90dvh] px-4 styled-scroll overflow-x-hidden overflow-y-auto relative pb-3", children: typeof children === 'function' ? children({ closeModal, shouldFocus }) : children })] }));
|
|
39
39
|
const widgetElement = document.getElementById('widget');
|
|
40
40
|
if (!widgetElement) {
|
|
41
41
|
console.warn('Widget element not found, modal will not render');
|
|
@@ -52,5 +52,5 @@ export const ModalTrigger = (props) => {
|
|
|
52
52
|
isDesktop && setShouldFocus(true);
|
|
53
53
|
onClick?.();
|
|
54
54
|
}
|
|
55
|
-
return (_jsx("div", { className: "
|
|
55
|
+
return (_jsx("div", { className: "rounded-2xl flex items-center relative w-full self-end", children: _jsx("button", { type: "button", onClick: openModal, disabled: disabled, className: clsx("rounded-2xl focus-peer:ring-primary focus-peer:border-secondary-400 focus-peer:border focus-peer:ring-1 focus:outline-none disabled:cursor-not-allowed relative grow flex items-center text-left justify-bottom w-full px-2 pr-0 bg-secondary-300 hover:bg-secondary-200 font-semibold", className), children: children }) }));
|
|
56
56
|
};
|
|
@@ -87,7 +87,7 @@ const Comp = ({ children, show, setShow, header, description, onClose, onAnimati
|
|
|
87
87
|
'border-none! rounded-none!': snap === 1,
|
|
88
88
|
'!fixed sm:!absolute': AppSettings.ThemeData?.enablePortal == true,
|
|
89
89
|
}), children: [_jsxs("div", { ref: headerRef, className: 'w-full relative', children: [isMobileWithoutPortal &&
|
|
90
|
-
_jsx("div", { className: "flex justify-center w-full mt-2 mb-[6px]", children: _jsx(Drawer.Handle, { className: '!w-12 !bg-primary-text-tertiary' }) }), _jsxs("div", { className: 'flex items-center w-full text-left justify-between px-4 sm:pt-2 pb-2', children: [_jsx(Drawer.Title, { className: "text-lg text-secondary-text font-semibold w-full", children: header }), _jsx(Drawer.Close, { asChild: true, children: _jsx("div", { children: _jsx(IconButton, { className: 'inline-flex active:animate-press-down', icon: _jsx(X, { strokeWidth:
|
|
90
|
+
_jsx("div", { className: "flex justify-center w-full mt-2 mb-[6px]", children: _jsx(Drawer.Handle, { className: '!w-12 !bg-primary-text-tertiary' }) }), _jsxs("div", { className: 'flex items-center w-full text-left justify-between px-4 sm:pt-2 pb-2', children: [_jsx(Drawer.Title, { className: "text-lg text-secondary-text font-semibold w-full", children: header }), _jsx(Drawer.Close, { asChild: true, children: _jsx("div", { children: _jsx(IconButton, { className: 'inline-flex active:animate-press-down', icon: _jsx(X, { strokeWidth: 2 }) }) }) })] }), description &&
|
|
91
91
|
_jsx(Drawer.Description, { className: "text-sm mt-2 text-secondary-text px-4", children: description })] }), _jsxs("div", { className: clsx('flex flex-col w-full h-fit max-h-[90dvh] px-4 styled-scroll overflow-x-hidden relative', {
|
|
92
92
|
'overflow-y-auto h-full': snap === 1,
|
|
93
93
|
'overflow-hidden': snap !== 1,
|
|
@@ -8,10 +8,10 @@ import ClickTooltip from "../../../../components/Common/ClickTooltip";
|
|
|
8
8
|
import shortenAddress from "../../../../components/utils/ShortenAddress";
|
|
9
9
|
import { truncateDecimals } from "../../../../components/utils/RoundDecimals";
|
|
10
10
|
import AddressIcon from "../../../../components/Common/AddressIcon";
|
|
11
|
-
import Modal from "../../../../components/Modal/modal";
|
|
12
11
|
import { ImageWithFallback } from "../../../../components/Common/ImageWithFallback";
|
|
13
12
|
import { useSelectedAccount } from "../../../../context/balanceAccounts";
|
|
14
13
|
import { useWallet } from "../../../../exports";
|
|
14
|
+
import VaulDrawer from "../../../../components/Modal/vaulModal";
|
|
15
15
|
const Component = ({ campaign }) => {
|
|
16
16
|
const [openTopModal, setOpenTopModal] = useState(false);
|
|
17
17
|
const selectedSourceAccount = useSelectedAccount("from", campaign.network?.name);
|
|
@@ -33,7 +33,7 @@ const Component = ({ campaign }) => {
|
|
|
33
33
|
return _jsx(_Fragment, {});
|
|
34
34
|
}
|
|
35
35
|
return _jsxs("div", { className: "space-y-2", children: [leaderboard?.leaderboard?.length > 0 &&
|
|
36
|
-
_jsxs("div", { className: "flex items-center justify-between", children: [_jsx("p", { className: "font-bold text-left leading-5 text-primary-text", children: "Leaderboard" }), _jsx("button", { onClick: handleOpenTopModal, type: "button", className: " leading-4 text-base text-primary underline hover:no-underline hover:text-primary/80", children: "Top 10" })] }), _jsx("p", { className: "text-sm text-secondary-text", children: "Users who earn the most throughout the program will be featured here." }), _jsx(LeaderbordComponent, { campaign: campaign, leaderboardData: leaderboardData, rewardsData: rewardsData, address: address, lines: 3 }), _jsx(
|
|
36
|
+
_jsxs("div", { className: "flex items-center justify-between", children: [_jsx("p", { className: "font-bold text-left leading-5 text-primary-text", children: "Leaderboard" }), _jsx("button", { onClick: handleOpenTopModal, type: "button", className: " leading-4 text-base text-primary underline hover:no-underline hover:text-primary/80", children: "Top 10" })] }), _jsx("p", { className: "text-sm text-secondary-text", children: "Users who earn the most throughout the program will be featured here." }), _jsx(LeaderbordComponent, { campaign: campaign, leaderboardData: leaderboardData, rewardsData: rewardsData, address: address, lines: 3 }), _jsx(VaulDrawer, { header: 'Leaderboard', show: openTopModal, setShow: setOpenTopModal, modalId: "leaderBoard", children: _jsx(VaulDrawer.Snap, { id: "item-1", children: _jsx(LeaderbordComponent, { campaign: campaign, leaderboardData: leaderboardData, rewardsData: rewardsData, address: address, className: "text-secondary-text" }) }) })] });
|
|
37
37
|
};
|
|
38
38
|
const LeaderbordComponent = ({ campaign, leaderboardData, rewardsData, address, lines, className }) => {
|
|
39
39
|
const leaderboard = leaderboardData?.data;
|
|
@@ -44,20 +44,19 @@ const ExchangeForm = ({ partner }) => {
|
|
|
44
44
|
const handleActionHover = (value) => {
|
|
45
45
|
setActionTempValue(value);
|
|
46
46
|
};
|
|
47
|
-
return (_jsxs(_Fragment, { children: [_jsx(DepositMethodComponent, {}), _jsxs(Form, { className: "h-full grow flex flex-col flex-1 justify-between w-full gap-3", children: [
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
_jsx(
|
|
60
|
-
: _jsx(_Fragment, {}), _jsx(QuoteDetails, { swapValues: values, quote: quote, isQuoteLoading: isQuoteLoading })] }), _jsx(Widget.Footer, { showPoweredBy: true, children: _jsx(FormButton, { shouldConnectWallet: false, values: values, disabled: !isValid || isSubmitting || !quote || isQuoteLoading, error: error, isSubmitting: isSubmitting, partner: partner }) })] })] }));
|
|
47
|
+
return (_jsxs(_Fragment, { children: [_jsx(DepositMethodComponent, {}), _jsxs(Form, { className: "h-full grow flex flex-col flex-1 justify-between w-full gap-3", children: [_jsx(Widget.Content, { children: _jsxs("div", { className: "flex flex-col w-full space-y-3 relative", children: [_jsxs("div", { className: "space-y-2", children: [_jsx("label", { htmlFor: "From", className: "block font-normal text-secondary-text text-base leading-5", children: "Send from" }), _jsx("div", { className: "relative", children: _jsx(CexPicker, {}) })] }), _jsxs("div", { className: "space-y-2 leading-4", children: [_jsx("label", { htmlFor: "From", className: "block font-normal text-secondary-text text-base leading-5", children: "Send to" }), _jsx("div", { className: "relative group exchange-picker", children: _jsx(RoutePicker, { direction: "to", isExchange: true }) }), _jsx("div", { className: "hover:bg-secondary-300 bg-secondary-500 rounded-2xl p-3", children: _jsx(Address, { partner: partner, children: ({ addressItem }) => {
|
|
48
|
+
const addressProviderIcon = (partner?.is_wallet && addressItem?.group === AddressGroup.FromQuery && partner?.logo) ? partner.logo : undefined;
|
|
49
|
+
return _jsx(_Fragment, { children: addressItem ? _jsx(_Fragment, { children: _jsx(AddressButton, { address: addressItem.address, network: destination, wallet: wallet, addressProviderIcon: addressProviderIcon }) })
|
|
50
|
+
: destination_address ? _jsx(_Fragment, { children: _jsx(AddressButton, { address: destination_address }) })
|
|
51
|
+
:
|
|
52
|
+
_jsxs("span", { className: "flex items-center", children: [_jsx(SelectedEchangePlaceholder, { placeholder: 'Enter destination address' }), _jsx("span", { className: "absolute right-0 px-1 pr-5 pointer-events-none text-primary-text", children: _jsx(ChevronDown, { className: "h-4 w-4 text-secondary-text", "aria-hidden": "true" }) })] }) });
|
|
53
|
+
} }) })] }), _jsxs("div", { className: "bg-secondary-500 rounded-2xl p-3 group space-y-2", onClick: setShowQuickActions, ref: parentRef, children: [_jsxs("div", { className: "flex justify-between items-center", children: [_jsx("label", { htmlFor: "From", className: "block font-normal text-secondary-text text-base ml-2 leading-5", children: "Enter amount" }), from && fromCurrency && minAllowedAmount && maxAmountFromApi &&
|
|
54
|
+
_jsx("div", { className: clsx({
|
|
55
|
+
"hidden": !showQuickActions,
|
|
56
|
+
"block": showQuickActions,
|
|
57
|
+
}, "group-hover:block"), children: _jsx(MinMax, { from: from, fromCurrency: fromCurrency, limitsMinAmount: minAllowedAmount, limitsMaxAmount: maxAmountFromApi, onActionHover: handleActionHover, depositMethod: "deposit_address" }) })] }), _jsx("div", { className: "relative group exchange-amount-field", children: _jsx(AmountField, { className: "pb-0! rounded-xl!", fee: quote, usdPosition: "right", actionValue: actionTempValue }) })] }), routeValidation.message
|
|
58
|
+
? _jsx(ValidationError, {})
|
|
59
|
+
: null, _jsx(QuoteDetails, { swapValues: values, quote: quote, isQuoteLoading: isQuoteLoading })] }) }), _jsx(Widget.Footer, { showPoweredBy: true, children: _jsx(FormButton, { shouldConnectWallet: false, values: values, disabled: !isValid || isSubmitting || !quote || isQuoteLoading, error: error, isSubmitting: isSubmitting, partner: partner }) })] })] }));
|
|
61
60
|
};
|
|
62
61
|
export default ExchangeForm;
|
|
63
62
|
const AddressButton = ({ address, network, wallet, addressProviderIcon }) => {
|
|
@@ -1,25 +1,25 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
2
|
-
import Modal from '../../../../../components/Modal/modal';
|
|
3
2
|
import { truncateDecimals } from '../../../../../components/utils/RoundDecimals';
|
|
4
3
|
import { useFormikContext } from 'formik';
|
|
5
4
|
import { useBalance } from '../../../../../lib/balances/useBalance';
|
|
6
5
|
import GasIcon from '../../../../../components/Icons/GasIcon';
|
|
6
|
+
import VaulDrawer from '../../../../../components/Modal/vaulModal';
|
|
7
7
|
const RefuelModal = ({ openModal, setOpenModal, fee }) => {
|
|
8
8
|
const { values, } = useFormikContext();
|
|
9
9
|
const { to, toAsset: toCurrency, refuel, destination_address } = values || {};
|
|
10
10
|
const nativeAsset = to?.token;
|
|
11
11
|
const { balances } = useBalance(destination_address, to);
|
|
12
12
|
const destNativeTokenBalance = balances?.find(b => b.token === nativeAsset?.symbol && b.network === to?.name);
|
|
13
|
-
return (_jsx(
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
13
|
+
return (_jsx(VaulDrawer, { show: openModal, setShow: setOpenModal, modalId: "refuel", children: _jsx(VaulDrawer.Snap, { id: "item-1", children: _jsxs("div", { className: "flex flex-col items-center gap-2 text-center space-y-3", children: [_jsx("div", { className: "relative z-10 flex items-center justify-center rounded-xl p-3 bg-secondary-500", children: _jsx(GasIcon, { className: "h-[52px] w-[52px] text-primary-200", "aria-hidden": "true" }) }), _jsx("p", { className: "text-2xl", children: "About Refuel" }), _jsx("p", { className: "text-secondary-text max-w-sm", children: fee && refuel ?
|
|
14
|
+
_jsx(_Fragment, { children: _jsxs("span", { children: [_jsx("span", { children: "We'll convert" }), " ", _jsxs("span", { children: ["$", fee?.refuel?.amount_in_usd] }), " ", _jsx("span", { children: "of your transfer into" }), " ", _jsx("span", { children: nativeAsset?.symbol }), " ", _jsx("span", { children: "so you can start using your funds on the destination chain immediately." })] }) })
|
|
15
|
+
:
|
|
16
|
+
_jsx(_Fragment, { children: _jsxs("span", { children: [_jsx("span", { children: "We'll convert a small portion of your transfer into" }), " ", _jsx("span", { children: nativeAsset?.symbol }), " ", _jsx("span", { children: "so you can start using your funds on the destination chain immediately." })] }) }) }), (refuel || Number(destNativeTokenBalance?.amount) >= 0) ?
|
|
17
|
+
_jsxs("div", { className: "flex flex-col space-y-2 w-full bg-secondary-700 overflow-hidden ", children: [Number(destNativeTokenBalance?.amount) >= 0 ?
|
|
18
|
+
_jsx("div", { className: "gap-4 flex relative items-center outline-hidden w-full text-primary-text px-4 py-3 bg-secondary-500 rounded-xl", children: _jsxs("div", { className: "flex items-center justify-between w-full", children: [_jsx("div", { className: "text-secondary-text", children: _jsx("span", { children: "Current balance" }) }), _jsx("p", { className: 'text-end', children: _jsxs("span", { children: [truncateDecimals(destNativeTokenBalance?.amount, nativeAsset?.precision), " ", nativeAsset?.symbol] }) })] }) })
|
|
19
|
+
:
|
|
20
|
+
null, (toCurrency?.refuel && nativeAsset) ?
|
|
21
|
+
_jsx("div", { className: "gap-4 flex relative items-center outline-hidden w-full text-primary-text px-4 py-3 bg-secondary-500 rounded-xl", children: _jsxs("div", { className: "flex items-center justify-between w-full", children: [_jsx("div", { className: "text-secondary-text", children: "You will receive" }), _jsx("p", { children: _jsxs("span", { children: [truncateDecimals(toCurrency.refuel?.amount, nativeAsset.precision), " ", nativeAsset?.symbol] }) })] }) })
|
|
22
|
+
:
|
|
23
|
+
null] }) : null] }) }) }));
|
|
24
24
|
};
|
|
25
25
|
export default RefuelModal;
|
|
@@ -43,10 +43,10 @@ export const DetailsButton = ({ quote: quoteData, isQuoteLoading, swapValues: va
|
|
|
43
43
|
const averageCompletionTime = quote?.avg_completion_time;
|
|
44
44
|
const shouldCheckNFT = reward?.campaign_type === "for_nft_holders" && !!reward?.nft_contract_address;
|
|
45
45
|
const { balance: nftBalance, isLoading, error } = useSWRNftBalance(destinationAddress || '', destination, reward?.nft_contract_address || '');
|
|
46
|
-
return (_jsxs("div", { className: 'flex items-center gap-1 space-x-3', children: [gasFeeInUsd
|
|
46
|
+
return (_jsxs("div", { className: 'flex items-center gap-1 space-x-3', children: [gasFeeInUsd ?
|
|
47
47
|
_jsxs(_Fragment, { children: [_jsxs("div", { className: clsx("inline-flex items-center gap-1", { "animate-pulse-strong": isQuoteLoading }), children: [_jsx("div", { className: 'p-0.5', children: !values.fromExchange ?
|
|
48
|
-
_jsx(GasIcon, { className: 'h-4 w-4 text-secondary-text' }) : _jsx(ExchangeGasIcon, { className: 'h-5 w-5 text-secondary-text' }) }), _jsx(NumberFlow, { className: "text-primary-text text-sm leading-6", value: gasFeeInUsd < 0.01 ? '0.01' : gasFeeInUsd, format: { style: 'currency', currency: 'USD' }, prefix: gasFeeInUsd < 0.01 ? '<' : undefined })] }), _jsx("div", { className: "w-px h-3 bg-primary-text-tertiary rounded-2xl" })] }), averageCompletionTime
|
|
49
|
-
_jsx(_Fragment, { children: _jsxs("div", { className: clsx("text-right inline-flex items-center gap-1 text-sm", { "animate-pulse-strong": isQuoteLoading }), children: [_jsx("div", { className: 'p-0.5', children: _jsx(Clock, { className: 'h-4 w-4 text-secondary-text' }) }), _jsx(AverageCompletionTime, { className: "text-primary-text", avgCompletionTime: quote.avg_completion_time })] }) }), reward &&
|
|
50
|
-
(!shouldCheckNFT || (!isLoading && !error && nftBalance !== undefined && nftBalance > 0))
|
|
51
|
-
_jsxs(_Fragment, { children: [_jsx("div", { className: "w-px h-3 bg-primary-text-tertiary rounded-2xl" }), _jsxs("div", { className: 'text-right text-primary-text inline-flex items-center gap-1', children: [_jsx(CupIcon, { alt: "Reward", width: 16, height: 16 }), _jsx(NumberFlow, { value: reward?.amount_in_usd < 0.01 ? '0.01' : reward?.amount_in_usd, format: { style: 'currency', currency: 'USD' }, prefix: reward?.amount_in_usd < 0.01 ? '<' : undefined })] })] })] }));
|
|
48
|
+
_jsx(GasIcon, { className: 'h-4 w-4 text-secondary-text' }) : _jsx(ExchangeGasIcon, { className: 'h-5 w-5 text-secondary-text' }) }), _jsx(NumberFlow, { className: "text-primary-text text-sm leading-6", value: gasFeeInUsd < 0.01 ? '0.01' : gasFeeInUsd, format: { style: 'currency', currency: 'USD' }, prefix: gasFeeInUsd < 0.01 ? '<' : undefined })] }), _jsx("div", { className: "w-px h-3 bg-primary-text-tertiary rounded-2xl" })] }) : null, averageCompletionTime ?
|
|
49
|
+
_jsx(_Fragment, { children: _jsxs("div", { className: clsx("text-right inline-flex items-center gap-1 text-sm", { "animate-pulse-strong": isQuoteLoading }), children: [_jsx("div", { className: 'p-0.5', children: _jsx(Clock, { className: 'h-4 w-4 text-secondary-text' }) }), _jsx(AverageCompletionTime, { className: "text-primary-text", avgCompletionTime: quote.avg_completion_time })] }) }) : null, (reward &&
|
|
50
|
+
(!shouldCheckNFT || (!isLoading && !error && nftBalance !== undefined && nftBalance > 0))) ?
|
|
51
|
+
_jsxs(_Fragment, { children: [_jsx("div", { className: "w-px h-3 bg-primary-text-tertiary rounded-2xl" }), _jsxs("div", { className: 'text-right text-primary-text inline-flex items-center gap-1', children: [_jsx(CupIcon, { alt: "Reward", width: 16, height: 16 }), _jsx(NumberFlow, { value: reward?.amount_in_usd < 0.01 ? '0.01' : reward?.amount_in_usd, format: { style: 'currency', currency: 'USD' }, prefix: reward?.amount_in_usd < 0.01 ? '<' : undefined })] })] }) : null] }));
|
|
52
52
|
};
|
|
@@ -6,7 +6,6 @@ import { useSwapDataState, useSwapDataUpdate } from "../../../../context/swap";
|
|
|
6
6
|
import ConnectNetwork from "../../../../components/Pages/Swap/Form/SecondaryComponents/ConnectNetwork";
|
|
7
7
|
import toast from "react-hot-toast";
|
|
8
8
|
import { generateSwapInitialValues, generateSwapInitialValuesFromSwap } from "../../../../lib/generateSwapInitialValues";
|
|
9
|
-
import Modal from "../../../../components/Modal/modal";
|
|
10
9
|
import { LSAPIKnownErrorCode } from "../../../../Models/ApiError";
|
|
11
10
|
import { useInitialSettings } from "../../../../context/settings";
|
|
12
11
|
import useWallet from "../../../../hooks/useWallet";
|
|
@@ -100,8 +99,8 @@ export default function FormWrapper({ children, type, partner }) {
|
|
|
100
99
|
const handleWalletWithdrawalSuccess = useCallback(() => {
|
|
101
100
|
setWalletWihdrawDone(true);
|
|
102
101
|
}, []);
|
|
103
|
-
return _jsx(_Fragment, { children: _jsx(Formik, { innerRef: formikRef, initialValues: initialValues, validateOnMount: true, onSubmit: handleSubmit, children: _jsxs(_Fragment, { children: [_jsx(
|
|
104
|
-
|
|
102
|
+
return _jsx(_Fragment, { children: _jsx(Formik, { innerRef: formikRef, initialValues: initialValues, validateOnMount: true, onSubmit: handleSubmit, children: _jsxs(_Fragment, { children: [_jsx(VaulDrawer, { show: showConnectNetworkModal, setShow: setShowConnectNetworkModal, header: `${networkToConnect?.DisplayName} connect`, modalId: "showNetwork", children: _jsx(VaulDrawer.Snap, { id: "item-1", children: networkToConnect &&
|
|
103
|
+
_jsx(ConnectNetwork, { NetworkDisplayName: networkToConnect?.DisplayName, AppURL: networkToConnect?.AppURL }) }) }), _jsx(VaulDrawer, { show: swapModalOpen, setShow: handleShowSwapModal, header: `Complete the swap`, modalId: "showSwap", className: !swapBasicData?.use_deposit_address ? "openwithdrawalmodal" : "", children: _jsx(VaulDrawer.Snap, { id: "item-1", children: _jsx(SwapDetails, { type: "contained", onWalletWithdrawalSuccess: handleWalletWithdrawalSuccess, partner: partner }) }) }), children] }) }) });
|
|
105
104
|
}
|
|
106
105
|
const handleCreateSwap = async ({ query, values, partner, setShowSwapModal, createSwap, setNetworkToConnect, setShowConnectNetworkModal, setSwapId, setSubmitedFormValues }) => {
|
|
107
106
|
setSubmitedFormValues(values);
|
|
@@ -33,7 +33,7 @@ export const TabsContent = ({ value, children }) => {
|
|
|
33
33
|
const ctx = useContext(TabsContext);
|
|
34
34
|
if (!ctx)
|
|
35
35
|
throw new Error('TabsContent must be used within <Tabs>');
|
|
36
|
-
return _jsx(_Fragment, { children: value === ctx.activeId && (_jsx(
|
|
36
|
+
return _jsx(_Fragment, { children: value === ctx.activeId && (_jsx(_Fragment, { children: children })) });
|
|
37
37
|
};
|
|
38
38
|
export const NetworkExchangeTabs = () => {
|
|
39
39
|
return _jsxs(TabsList, { children: [_jsx(TabsTrigger, { label: "Swap", Icon: NetworkTabIcon, value: "cross-chain" }), _jsx(TabsTrigger, { label: "Deposit from CEX", Icon: ExchangeTabIcon, value: "exchange" })] });
|
package/dist/esm/components/Pages/Swap/Form/SecondaryComponents/validationError/ErrorDisplay.js
CHANGED
|
@@ -13,5 +13,5 @@ export const defaultErrors = {
|
|
|
13
13
|
};
|
|
14
14
|
export const ErrorDisplay = (props) => {
|
|
15
15
|
const { message, details } = { ...defaultErrors[props?.errorName || ''], ...props };
|
|
16
|
-
return (_jsx("div", { className: "px-2 py-3 rounded-2xl bg-secondary-400", children: _jsxs("div", { className: "flex items-start gap-2", children: [_jsx("span", { className: "shrink-0", children: details?.icon }), _jsxs("div", { className: "flex flex-col gap-1", children: [_jsx("p", { className: "text-
|
|
16
|
+
return (_jsx("div", { className: "px-2 py-3 rounded-2xl bg-secondary-400", children: _jsxs("div", { className: "flex items-start gap-2", children: [_jsx("span", { className: "shrink-0", children: details?.icon }), _jsxs("div", { className: "flex flex-col gap-1", children: [_jsx("p", { className: "text-primary-text font-medium leading-4 text-base mt-0.5", children: details?.title }), message ? _jsx("p", { className: "text-secondary-text text-sm leading-[18px]", children: message }) : null] })] }) }));
|
|
17
17
|
};
|
|
@@ -4,7 +4,7 @@ import { useEffect } from 'react';
|
|
|
4
4
|
import SwapForm from "./Form";
|
|
5
5
|
import { SWRConfig, mutate } from 'swr';
|
|
6
6
|
export const Swap = () => {
|
|
7
|
-
return (_jsx("div", { className: "text-primary-text", children: _jsx(SWRConfig, { value: { use: [updatePendingCount] }, children: _jsx(SwapForm, {}) }) }));
|
|
7
|
+
return (_jsx("div", { className: "text-primary-text h-full", children: _jsx(SWRConfig, { value: { use: [updatePendingCount] }, children: _jsx(SwapForm, {}) }) }));
|
|
8
8
|
};
|
|
9
9
|
const swapsStatuses = {};
|
|
10
10
|
function updatePendingCount(useSWRNext) {
|
|
@@ -29,7 +29,7 @@ const Expired = ({ onGetHelp }) => {
|
|
|
29
29
|
return (_jsxs("div", { children: [_jsx("span", { className: 'text-md text-left text-xs md:text-sm text-primary-text', children: "The transfer wasn't completed during the allocated timeframe." }), _jsxs("span", { className: 'text-secondary-text', children: [_jsx("span", { children: " If you've already sent crypto for this swap, your funds are safe, " }), _jsx("span", { className: 'underline hover:cursor-pointer', onClick: () => onGetHelp(), children: "please contact our support." })] })] }));
|
|
30
30
|
};
|
|
31
31
|
const Delay = () => {
|
|
32
|
-
return (_jsxs("div", { children: [_jsxs("p", { className: 'text-md ', children: [_jsx("span", { children: "This usually means that the exchange needs additional verification." }), _jsx("a", { target: '_blank', href: "https://
|
|
32
|
+
return (_jsxs("div", { children: [_jsxs("p", { className: 'text-md ', children: [_jsx("span", { children: "This usually means that the exchange needs additional verification." }), _jsx("a", { target: '_blank', href: "https://learn.layerswap.io/user-docs/why-is-coinbase-transfer-taking-so-long/", className: 'disabled:text-primary-text/40 disabled:bg-primary-900 disabled:cursor-not-allowed ml-1 underline hover:no-underline cursor-pointer', rel: "noopener noreferrer", children: "Learn More" })] }), _jsxs("ul", { className: "list-inside list-decimal font-light space-y-1 mt-2 text-left text-primary-text ", children: [_jsx("li", { children: "Check your email for details from Coinbase" }), _jsx("li", { children: "Check your Coinbase account's transfer history" })] })] }));
|
|
33
33
|
};
|
|
34
34
|
const Canceled = ({ onGetHelp }) => {
|
|
35
35
|
return (_jsx("div", { children: _jsxs("p", { className: 'text-md text-left text-primary-text', children: [_jsx("span", { children: "The transaction was cancelled by your request." }), _jsxs("span", { className: 'text-secondary-text', children: [_jsx("span", { children: " If you've already sent crypto for this swap, your funds are safe," }), _jsx("span", { className: 'underline hover:cursor-pointer', onClick: () => onGetHelp(), children: " please contact our support." })] })] }) }));
|