tek-wallet 0.0.763 → 0.0.764

package/dist/components/TekWallet/components/ui/SwapFunction/index.js

@@ -57,7 +57,6 @@ var SwiperControlled_1 = __importDefault(require("../SwiperControlled"));
 var react_2 = require("swiper/react");
 var material_1 = require("@mui/material");
 var Button_1 = __importDefault(require("../Button"));
-var RequireConnect_1 = __importDefault(require("../RequireConnect"));
 var ThemeProvider_1 = require("../../../providers/ThemeProvider");
 var ChildPageLayout_1 = __importDefault(require("../../layouts/ChildPageLayout"));
 var FromCard_1 = __importDefault(require("../../views/SwapView/components/FromCard"));
@@ -111,13 +110,13 @@ exports.SwapFunction = (0, react_1.forwardRef)(function (props, ref) {
             setNumber(null);
         }
     };
-    var gotoStep = function (step) {
+    var gotoStep = (0, react_1.useCallback)(function (step) {
         var _a;
         if (step === SwapStep.SELECT_SWAP) {
         }
         setCurrentStep(step);
         (_a = swiperRef.current) === null || _a === void 0 ? void 0 : _a.slideTo(step);
-    };
+    }, []);
     var handleSelectToken = function (token) {
         if (!selectedToken || selectedToken.id !== token.id) {
             setSelectedToken(token);
@@ -232,41 +231,41 @@ exports.SwapFunction = (0, react_1.forwardRef)(function (props, ref) {
             openHistory();
         }
     }, [isSwapPage, isHistoryPage, isHistoryDetailPage]);
-    return ((0, jsx_runtime_1.jsx)(RequireConnect_1.default, { children: (0, jsx_runtime_1.jsx)(DrawerComponent_1.default, { className: className, sx: sx, ref: drawerRef, trigger: props.children, onOpen: handleOnOpenSwap, onClose: handleOnCloseSwap, direction: DrawerComponent_1.DRAWER_DIRECTION.RIGHT, children: (0, jsx_runtime_1.jsx)(ChildPageLayout_1.default, { header: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(PageHeader_1.default, { title: SWAP_STEP_NAME[currentStep], overrideBack: handleBack, children: currentStep === SwapStep.SELECT_SWAP && ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g4 }), children: [(0, jsx_runtime_1.jsx)(material_1.SvgIcon, { sx: { width: 18, height: 18 }, children: SvgPath_1.IC_HELP }), (0, jsx_runtime_1.jsx)(material_1.Divider, { orientation: "vertical", sx: {
-                                        height: "1rem",
-                                        width: "1px",
-                                        backgroundColor: theme.palette.border.accent3,
-                                        marginLeft: theme.mixins.customMargin.m4,
-                                        marginRight: theme.mixins.customMargin.m4,
-                                    } }), (0, jsx_runtime_1.jsx)(DrawerComponent_1.default, { ref: historyRef, trigger: (0, jsx_runtime_1.jsx)(material_1.SvgIcon, { sx: { width: 18, height: 18 }, children: SvgPath_1.IC_HISTORY }), direction: DrawerComponent_1.DRAWER_DIRECTION.RIGHT, onOpen: handleOnOpenHistory, onClose: handleOnCloseHistory, children: (0, jsx_runtime_1.jsx)(HistorySwap_1.default, { onClose: closeHistory }) })] })) }) }), footer: currentStep === SwapStep.SELECT_SWAP && ((0, jsx_runtime_1.jsx)(BottomActionLayout_1.default, { children: (0, jsx_runtime_1.jsx)(SwapToken_1.default
+    return ((0, jsx_runtime_1.jsx)(DrawerComponent_1.default, { className: className, sx: sx, ref: drawerRef, trigger: props.children, onOpen: handleOnOpenSwap, onClose: handleOnCloseSwap, direction: DrawerComponent_1.DRAWER_DIRECTION.RIGHT, children: (0, jsx_runtime_1.jsx)(ChildPageLayout_1.default, { header: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(PageHeader_1.default, { title: SWAP_STEP_NAME[currentStep], overrideBack: handleBack, children: currentStep === SwapStep.SELECT_SWAP && ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g4 }), children: [(0, jsx_runtime_1.jsx)(material_1.SvgIcon, { sx: { width: 18, height: 18 }, children: SvgPath_1.IC_HELP }), (0, jsx_runtime_1.jsx)(material_1.Divider, { orientation: "vertical", sx: {
+                                    height: "1rem",
+                                    width: "1px",
+                                    backgroundColor: theme.palette.border.accent3,
+                                    marginLeft: theme.mixins.customMargin.m4,
+                                    marginRight: theme.mixins.customMargin.m4,
+                                } }), (0, jsx_runtime_1.jsx)(DrawerComponent_1.default, { ref: historyRef, trigger: (0, jsx_runtime_1.jsx)(material_1.SvgIcon, { sx: { width: 18, height: 18 }, children: SvgPath_1.IC_HISTORY }), direction: DrawerComponent_1.DRAWER_DIRECTION.RIGHT, onOpen: handleOnOpenHistory, onClose: handleOnCloseHistory, children: (0, jsx_runtime_1.jsx)(HistorySwap_1.default, { onClose: closeHistory }) })] })) }) }), footer: currentStep === SwapStep.SELECT_SWAP && ((0, jsx_runtime_1.jsx)(BottomActionLayout_1.default, { children: (0, jsx_runtime_1.jsx)(SwapToken_1.default
+                // onResetNumber={resetNumber}
+                , { 
                     // onResetNumber={resetNumber}
-                    , { 
-                        // onResetNumber={resetNumber}
-                        sx: {
-                            width: "100%",
-                        }, sendData: {
-                            amount: number !== null ? number.toString() : "",
-                            currency_slug: (_a = selectedToken === null || selectedToken === void 0 ? void 0 : selectedToken.slug) !== null && _a !== void 0 ? _a : "",
-                            to_currency_slug: (_b = selectedOutputToken === null || selectedOutputToken === void 0 ? void 0 : selectedOutputToken.slug) !== null && _b !== void 0 ? _b : "",
-                            extraTransactions: null,
-                        }, children: (0, jsx_runtime_1.jsx)(Button_1.default.Primary, { disabled: !number ||
-                                number < ((_c = selectedToken === null || selectedToken === void 0 ? void 0 : selectedToken.min_value) !== null && _c !== void 0 ? _c : 0) ||
-                                number > ((_d = selectedToken === null || selectedToken === void 0 ? void 0 : selectedToken.max_value) !== null && _d !== void 0 ? _d : 0) ||
-                                number > Number(selectedToken === null || selectedToken === void 0 ? void 0 : selectedToken.balance), fullWidth: true, children: "Preview swap" }) }, "".concat(selectedToken === null || selectedToken === void 0 ? void 0 : selectedToken.slug, "-").concat(selectedOutputToken === null || selectedOutputToken === void 0 ? void 0 : selectedOutputToken.slug)) })), children: (0, jsx_runtime_1.jsx)(material_1.Box, { sx: {
-                        padding: theme.mixins.pagePadding,
-                        position: "relative",
-                    }, children: (0, jsx_runtime_1.jsx)(SwiperControlled_1.default, { ref: swiperRef, swiperProps: {
-                            autoHeight: true,
-                            spaceBetween: 32,
-                        }, disableSwipe: true, initialActiveTab: currentStep, children: (0, jsx_runtime_1.jsxs)(react_2.SwiperSlide, { children: [(0, jsx_runtime_1.jsx)(FromCard_1.default, { onChange: onChange, selectedToken: selectedToken !== null && selectedToken !== void 0 ? selectedToken : undefined, amount: number !== null && number !== void 0 ? number : undefined }), (0, jsx_runtime_1.jsxs)(material_1.Stack, { direction: "row", alignItems: "center", gap: 1, sx: {
-                                        mt: "1rem",
-                                        mb: "1rem",
-                                    }, children: [(0, jsx_runtime_1.jsx)(material_1.SvgIcon, { sx: { width: 18, height: 18 }, children: SvgPath_1.IC_SWAP }), (0, jsx_runtime_1.jsx)(material_1.Divider, { sx: {
-                                                width: "90%",
-                                                borderStyle: "dashed",
-                                                borderColor: "#A3A3A3",
-                                                opacity: 0.3,
-                                            } })] }), (0, jsx_runtime_1.jsx)(CardTo_1.default, { selectedToToken: selectedOutputToken !== null && selectedOutputToken !== void 0 ? selectedOutputToken : undefined, selectedFromToken: selectedToken !== null && selectedToken !== void 0 ? selectedToken : undefined, fromAmount: number !== null && number !== void 0 ? number : undefined }), (0, jsx_runtime_1.jsx)(DetailSwap_1.default, { selectedToken: selectedToken !== null && selectedToken !== void 0 ? selectedToken : undefined, selectOutputToken: selectedOutputToken !== null && selectedOutputToken !== void 0 ? selectedOutputToken : undefined }), (0, jsx_runtime_1.jsx)(ModalSelectToken_1.default, { setSwapToken: handleSelectToken, token: selectedToken !== null && selectedToken !== void 0 ? selectedToken : undefined, outputToken: selectedOutputToken !== null && selectedOutputToken !== void 0 ? selectedOutputToken : undefined, setOutputToken: handleSelectOutputToken })] }, SwapStep.SELECT_SWAP) }, selectedToken === null || selectedToken === void 0 ? void 0 : selectedToken.id) }) }) }) }));
+                    sx: {
+                        width: "100%",
+                    }, sendData: {
+                        amount: number !== null ? number.toString() : "",
+                        currency_slug: (_a = selectedToken === null || selectedToken === void 0 ? void 0 : selectedToken.slug) !== null && _a !== void 0 ? _a : "",
+                        to_currency_slug: (_b = selectedOutputToken === null || selectedOutputToken === void 0 ? void 0 : selectedOutputToken.slug) !== null && _b !== void 0 ? _b : "",
+                        extraTransactions: null,
+                    }, children: (0, jsx_runtime_1.jsx)(Button_1.default.Primary, { disabled: !number ||
+                            number < ((_c = selectedToken === null || selectedToken === void 0 ? void 0 : selectedToken.min_value) !== null && _c !== void 0 ? _c : 0) ||
+                            number > ((_d = selectedToken === null || selectedToken === void 0 ? void 0 : selectedToken.max_value) !== null && _d !== void 0 ? _d : 0) ||
+                            number > Number(selectedToken === null || selectedToken === void 0 ? void 0 : selectedToken.balance), fullWidth: true, children: "Preview swap" }) }, "".concat(selectedToken === null || selectedToken === void 0 ? void 0 : selectedToken.slug, "-").concat(selectedOutputToken === null || selectedOutputToken === void 0 ? void 0 : selectedOutputToken.slug)) })), children: (0, jsx_runtime_1.jsx)(material_1.Box, { sx: {
+                    padding: theme.mixins.pagePadding,
+                    position: "relative",
+                }, children: (0, jsx_runtime_1.jsx)(SwiperControlled_1.default, { ref: swiperRef, swiperProps: {
+                        autoHeight: true,
+                        spaceBetween: 32,
+                    }, disableSwipe: true, initialActiveTab: currentStep, children: (0, jsx_runtime_1.jsxs)(react_2.SwiperSlide, { children: [(0, jsx_runtime_1.jsx)(FromCard_1.default, { onChange: onChange, selectedToken: selectedToken !== null && selectedToken !== void 0 ? selectedToken : undefined, amount: number !== null && number !== void 0 ? number : undefined }), (0, jsx_runtime_1.jsxs)(material_1.Stack, { direction: "row", alignItems: "center", gap: 1, sx: {
+                                    mt: "1rem",
+                                    mb: "1rem",
+                                }, children: [(0, jsx_runtime_1.jsx)(material_1.SvgIcon, { sx: { width: 18, height: 18 }, children: SvgPath_1.IC_SWAP }), (0, jsx_runtime_1.jsx)(material_1.Divider, { sx: {
+                                            width: "90%",
+                                            borderStyle: "dashed",
+                                            borderColor: "#A3A3A3",
+                                            opacity: 0.3,
+                                        } })] }), (0, jsx_runtime_1.jsx)(CardTo_1.default, { selectedToToken: selectedOutputToken !== null && selectedOutputToken !== void 0 ? selectedOutputToken : undefined, selectedFromToken: selectedToken !== null && selectedToken !== void 0 ? selectedToken : undefined, fromAmount: number !== null && number !== void 0 ? number : undefined }), (0, jsx_runtime_1.jsx)(DetailSwap_1.default, { selectedToken: selectedToken !== null && selectedToken !== void 0 ? selectedToken : undefined, selectOutputToken: selectedOutputToken !== null && selectedOutputToken !== void 0 ? selectedOutputToken : undefined }), (0, jsx_runtime_1.jsx)(ModalSelectToken_1.default, { setSwapToken: handleSelectToken, token: selectedToken !== null && selectedToken !== void 0 ? selectedToken : undefined, outputToken: selectedOutputToken !== null && selectedOutputToken !== void 0 ? selectedOutputToken : undefined, setOutputToken: handleSelectOutputToken })] }, SwapStep.SELECT_SWAP) }, selectedToken === null || selectedToken === void 0 ? void 0 : selectedToken.id) }) }) }));
 });
 exports.SwapFunction.displayName = "SwapFunction";
 exports.default = exports.SwapFunction;

package/dist/components/TekWallet/components/ui/TokenSelection/index.js

@@ -47,7 +47,7 @@ var TokenSelection = function (props) {
     }, [balance, tokenData]);
     return ((0, jsx_runtime_1.jsxs)(material_1.Box, __assign({ onClick: function () { return onClick === null || onClick === void 0 ? void 0 : onClick(tokenData); }, sx: __assign({ backgroundColor: active
                 ? "".concat(theme.palette.background.tertiary)
-                : "".concat(theme.palette.background.white), border: "1px solid", borderColor: active ? "".concat(theme.palette.primary.main) : "".concat(theme.palette.border.accent3), borderRadius: theme.mixins.customRadius.r16, padding: theme.mixins.customPadding.p16, display: "flex", alignItems: "center", cursor: "pointer" }, sx) }, rest, { children: [(0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g12 }), children: [(0, jsx_runtime_1.jsx)(Icon_1.default, { width: 20, src: tokenData === null || tokenData === void 0 ? void 0 : tokenData.link, sx: {
+                : "".concat(theme.palette.background.white16), border: "1px solid", backdropFilter: "blur(12px)", borderColor: active ? "".concat(theme.palette.primary.main) : "".concat(theme.palette.border.accent3), borderRadius: theme.mixins.customRadius.r16, padding: theme.mixins.customPadding.p16, display: "flex", alignItems: "center", cursor: "pointer" }, sx) }, rest, { children: [(0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g12 }), children: [(0, jsx_runtime_1.jsx)(Icon_1.default, { width: 20, src: tokenData === null || tokenData === void 0 ? void 0 : tokenData.link, sx: {
                             borderRadius: theme.mixins.customRadius.full,
                         } }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g2 }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: theme.mixins.value, children: tokenData === null || tokenData === void 0 ? void 0 : tokenData.name }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: theme.mixins.valueDescription, children: tokenData === null || tokenData === void 0 ? void 0 : tokenData.full_name })] })] }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { marginLeft: "auto", alignItems: "end" }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: theme.mixins.value, children: (0, jsx_runtime_1.jsx)(Formatter_1.default, { value: balance }) }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.valueDescription), { color: theme.palette.text.accent }), children: (0, jsx_runtime_1.jsx)(Formatter_1.default, { value: balanceInUSD, start: "~ $" }) })] })] })));
 };

package/dist/components/TekWallet/components/ui/WaitingData/index.js

@@ -18,8 +18,9 @@ var WaitingData = function (props) {
     var theme = (0, providers_1.useTheme)();
     var sx = props.sx, _a = props.numberOfSkeleton, numberOfSkeleton = _a === void 0 ? 5 : _a;
     return ((0, jsx_runtime_1.jsx)(material_1.Box, { sx: __assign({ display: "flex", alignItems: "center", justifyContent: "center", flexDirection: "column", gap: theme.mixins.gaps.g12, width: "100%", height: "fit-content" }, sx), children: Array.from({ length: numberOfSkeleton }).map(function (_, index) { return ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: {
-                backgroundColor: theme.palette.background.white,
-                borderRadius: theme.mixins.customRadius.r12,
+                backgroundColor: theme.palette.background.white16,
+                backdropFilter: "blur(12px)",
+                borderRadius: theme.mixins.customRadius.r16,
                 display: "flex",
                 alignItems: "center",
                 justifyContent: "center",
@@ -32,20 +33,20 @@ var WaitingData = function (props) {
                         height: "auto",
                         width: "2.5rem",
                         borderRadius: "999px",
-                        opacity: 0.8,
+                        opacity: 0.7,
                     }, animation: "wave" }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g6, flex: 1 }), children: [(0, jsx_runtime_1.jsx)(material_1.Skeleton, { variant: "rectangular", width: "70%", sx: {
                                 height: "1.4rem",
-                                opacity: 0.8,
+                                opacity: 0.7,
                                 borderRadius: theme.mixins.customRadius.r12,
                             }, animation: "wave" }), (0, jsx_runtime_1.jsx)(material_1.Skeleton, { variant: "rectangular", width: "80%", sx: {
                                 height: "1.2rem",
-                                opacity: 0.8,
+                                opacity: 0.7,
                                 borderRadius: theme.mixins.customRadius.r12,
                             }, animation: "wave" })] }), (0, jsx_runtime_1.jsx)(material_1.Skeleton, { variant: "rectangular", sx: {
                         height: "1.7rem",
                         width: "4rem",
                         borderRadius: theme.mixins.customRadius.r12,
-                        opacity: 0.8,
+                        opacity: 0.7,
                     }, animation: "wave" })] }, index)); }) }));
 };
 exports.default = WaitingData;

package/dist/components/TekWallet/components/views/ActivityView/index.js

@@ -15,16 +15,19 @@ var material_1 = require("@mui/material");
 var ThemeProvider_1 = require("../../../providers/ThemeProvider");
 var react_2 = require("swiper/react");
 var ActivitiesTypeSlice_1 = __importDefault(require("../../ui/ActivitiesTypeSlice"));
+var TekWalletProvider_1 = require("../../../providers/TekWalletProvider");
 var ActivityView = function (props) {
     var sx = props.sx;
     var theme = (0, ThemeProvider_1.useTheme)();
+    var options = (0, TekWalletProvider_1.useWalletConfig)().options;
+    var hideBackButtons = (options || {}).hideBackButtons;
     var swiperRef = (0, react_1.useRef)(null);
     var activityTypes = (0, useActivities_1.default)().activityTypes;
     var _a = (0, react_1.useState)(0), activeTab = _a[0], setActiveTab = _a[1];
     var handleSlideChange = function (index) {
         setActiveTab(index);
     };
-    return ((0, jsx_runtime_1.jsx)(ChildPageLayout_1.default, { header: (0, jsx_runtime_1.jsx)(PageHeader_1.default, { title: "Activities" }), sx: sx, children: (0, jsx_runtime_1.jsx)(SwiperControlled_1.default, { ref: swiperRef, 
+    return ((0, jsx_runtime_1.jsx)(ChildPageLayout_1.default, { header: (0, jsx_runtime_1.jsx)(PageHeader_1.default, { title: "Activities", hideBack: !!(hideBackButtons === null || hideBackButtons === void 0 ? void 0 : hideBackButtons.activity) }), sx: sx, children: (0, jsx_runtime_1.jsx)(SwiperControlled_1.default, { ref: swiperRef, 
             // tabParamName="activity-tab"
             swiperProps: {
                 slidesPerView: 1,
@@ -56,7 +59,7 @@ var ActivityView = function (props) {
             }, children: activityTypes === null || activityTypes === void 0 ? void 0 : activityTypes.map(function (type, index) {
                 return ((0, jsx_runtime_1.jsx)(react_2.SwiperSlide, { style: {
                         position: "relative",
-                    }, children: (0, jsx_runtime_1.jsx)(ActivitiesTypeSlice_1.default, { type: type, isActive: activeTab === index }) }, index));
+                    }, children: (index === activeTab || index === activeTab - 1 || index === activeTab + 1) && ((0, jsx_runtime_1.jsx)(ActivitiesTypeSlice_1.default, { type: type, isActive: activeTab === index })) }, index));
             }) }) }));
 };
 exports.ActivityView = ActivityView;

package/dist/components/TekWallet/components/views/AssetView/index.js

@@ -127,12 +127,21 @@ var AssetView = function (props) {
                                                     fontWeight: theme.typography.fontWeight400,
                                                     color: theme.palette.text.black,
                                                     cursor: "pointer",
-                                                }, children: "View all" }), (0, jsx_runtime_1.jsx)(Icon_1.default, { iconKey: "IC_ARROW_RIGHT", width: 18, height: 18 })] })] }), (0, jsx_runtime_1.jsx)(ActivitiesTypeSlice_1.default, { type: const_1.ACTIVITIES_TYPE_ALL, limitItems: 4, isActive: true, sx: {
-                                    paddingBottom: 0,
-                                    paddingTop: 0,
-                                    paddingLeft: 0,
-                                    paddingRight: 0,
-                                } })] })), (0, jsx_runtime_1.jsx)(TokensBoard_1.default, {})] })))] }));
+                                                }, children: "View all" }), (0, jsx_runtime_1.jsx)(Icon_1.default, { iconKey: "IC_ARROW_RIGHT", width: 18, height: 18 })] })] }), (0, jsx_runtime_1.jsx)(material_1.Box, { sx: {
+                                    position: "relative",
+                                    left: "-".concat(theme.mixins.customPadding.p16),
+                                    width: "calc(100% + ".concat(theme.mixins.customPadding.p16, " * 2)"),
+                                }, children: (0, jsx_runtime_1.jsx)(ActivitiesTypeSlice_1.default, { type: const_1.ACTIVITIES_TYPE_ALL, limitItems: 4, isActive: true, sx: {
+                                        paddingBottom: 0,
+                                        paddingTop: 0,
+                                        paddingLeft: 0,
+                                        paddingRight: 0,
+                                    }, smartListProps: {
+                                        bodySx: {
+                                            pt: 0,
+                                            pb: 0,
+                                        },
+                                    } }) })] })), (0, jsx_runtime_1.jsx)(TokensBoard_1.default, {})] })))] }));
 };
 exports.AssetView = AssetView;
 exports.default = exports.AssetView;

package/dist/components/TekWallet/components/views/NotFoundView/index.js

@@ -1,7 +1,37 @@
 "use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
 var jsx_runtime_1 = require("react/jsx-runtime");
+var material_1 = require("@mui/material");
+var Button_1 = __importDefault(require("../../ui/Button"));
 function NotFoundView() {
-    return (0, jsx_runtime_1.jsx)("div", { className: "text-red-500", children: "Not Found" });
+    var handleGoBack = function () {
+        window.history.back();
+    };
+    return ((0, jsx_runtime_1.jsx)(material_1.Box, { sx: {
+            minHeight: "100dvh",
+            display: "flex",
+            alignItems: "center",
+            justifyContent: "center",
+            backgroundColor: "grey.50",
+            p: 3,
+        }, children: (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: {
+                textAlign: "center",
+                maxWidth: 400,
+            }, children: [(0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "h1", sx: {
+                        fontSize: "6rem",
+                        fontWeight: "bold",
+                        color: "grey.400",
+                        mb: 2,
+                    }, children: "404" }), (0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "h4", sx: {
+                        fontWeight: "semibold",
+                        color: "grey.700",
+                        mb: 1,
+                    }, children: "Page Not Found" }), (0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "body1", sx: {
+                        color: "grey.600",
+                        mb: 3,
+                    }, children: "Sorry, the page you are looking for does not exist." }), (0, jsx_runtime_1.jsx)(Button_1.default.Primary, { fullWidth: true, onClick: handleGoBack, children: "Go Back" })] }) }));
 }
 exports.default = NotFoundView;

package/dist/components/TekWallet/components/views/SendExternalView/components/Form.js

@@ -107,6 +107,8 @@ var useUniqueId_1 = require("../../../../hooks/useUniqueId");
 var DrawerComponent_1 = __importDefault(require("../../../ui/DrawerComponent"));
 var ModalLayout_1 = __importDefault(require("../../../ui/ModalLayout"));
 var SelectNetwork_1 = __importDefault(require("./SelectNetwork"));
+var ChildPageLayout_1 = __importDefault(require("../../../layouts/ChildPageLayout"));
+var navigation_1 = require("next/navigation");
 var validateAddressDebounce = (0, lodash_1.debounce)(function (callback) {
     callback();
 }, 500, { leading: true, trailing: true });
@@ -116,8 +118,10 @@ var getEstimateFeeDebounce = (0, lodash_1.debounce)(function (callback) {
 function Form(props) {
     var _this = this;
     var theme = (0, providers_1.useTheme)();
+    var searchParams = (0, navigation_1.useSearchParams)();
+    var address = searchParams.get("address") || "";
     var selectedToken = props.selectedToken, onContinue = props.onContinue, sx = props.sx;
-    var _a = (0, react_1.useState)(""), recipientAddress = _a[0], setRecipientAddress = _a[1];
+    var _a = (0, react_1.useState)(address), recipientAddress = _a[0], setRecipientAddress = _a[1];
     var _b = (0, react_1.useState)(), recipientAddressError = _b[0], setRecipientAddressError = _b[1];
     var _c = (0, react_1.useState)(""), amount = _c[0], setAmount = _c[1];
     var _d = (0, react_1.useState)(), amountErrorMessage = _d[0], setAmountErrorMessage = _d[1];
@@ -375,76 +379,76 @@ function Form(props) {
             container: {
                 height: "100%",
             },
-        }, id: keyboardId, onChange: handleKeyboardChangeAmount, keyboardType: xhub_keyboard_1.KeyboardType.Double, value: amount === null || amount === void 0 ? void 0 : amount.toString(), keyboardId: "form-amount-keyboard-id", onOpen: handleKeyboardOpen, onClose: handleKeyboardClose, children: (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign(__assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g16, minHeight: "100%", transition: "padding-bottom 0.3s ease-in-out" }), sx), (isKeyboardOpen
-                ? {
-                    paddingBottom: theme.mixins.customPadding.p8,
-                }
-                : {})), children: [(0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g8 }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
-                                fontSize: theme.typography.fontSize14,
-                                color: theme.palette.text.black,
-                                fontWeight: theme.typography.fontWeight700,
-                            }, children: "Wallet address" }), (0, jsx_runtime_1.jsx)(Input_1.default, { sx: {
-                                paddingX: theme.mixins.customPadding.p16,
-                            }, inputRest: {
-                                placeholder: "Enter recipient address",
-                                value: recipientAddress,
-                                onChange: handleChangeRecipientAddress,
-                                id: "recipient-address-input-id",
-                            }, rightPart: (0, jsx_runtime_1.jsx)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g8 }), children: !!recipientAddress ? ((0, jsx_runtime_1.jsx)("label", { htmlFor: "recipient-address-input-id", children: (0, jsx_runtime_1.jsx)(material_1.Box, { onClick: handleClearRecipientAddress, sx: __assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g8, cursor: "pointer" }), children: (0, jsx_runtime_1.jsx)(material_1.SvgIcon, { sx: { width: 12, height: 12 }, children: SvgPath_1.IC_CLOSE }) }) })) : ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g8 }), children: [(0, jsx_runtime_1.jsx)(material_1.Box, { onClick: openScannerAddressQrCode, children: (0, jsx_runtime_1.jsx)(Icon_1.default, { iconKey: "IC_SCAN", sx: { width: 18, height: 18 } }) }), (0, jsx_runtime_1.jsx)(material_1.Divider, { orientation: "vertical", variant: "fullWidth", flexItem: true }), (0, jsx_runtime_1.jsx)(material_1.Box, { onClick: handlePaste, children: (0, jsx_runtime_1.jsx)(material_1.SvgIcon, { sx: { width: 18, height: 18 }, children: SvgPath_1.IC_DOCUMENTS }) })] })) }) }), !!recipientAddressError && ((0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.validationError), children: recipientAddressError }))] }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g8, opacity: allowSelectNetwork ? 1 : 0.5, pointerEvents: allowSelectNetwork ? "auto" : "none" }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
-                                fontSize: theme.typography.fontSize14,
-                                color: theme.palette.text.black,
-                                fontWeight: theme.typography.fontWeight700,
-                            }, children: "Network" }), (0, jsx_runtime_1.jsx)(DrawerComponent_1.default, { ref: selectNetworkDrawerRef, trigger: (0, jsx_runtime_1.jsx)(Input_1.default, { sx: {
-                                    paddingLeft: theme.mixins.customPadding.p12,
-                                    paddingRight: theme.mixins.customPadding.p16,
+        }, id: keyboardId, onChange: handleKeyboardChangeAmount, keyboardType: xhub_keyboard_1.KeyboardType.Double, value: amount === null || amount === void 0 ? void 0 : amount.toString(), keyboardId: "form-amount-keyboard-id", onOpen: handleKeyboardOpen, onClose: handleKeyboardClose, children: (0, jsx_runtime_1.jsx)(ChildPageLayout_1.default, { children: (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign(__assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g16, minHeight: "100%", transition: "padding-bottom 0.3s ease-in-out" }), sx), (isKeyboardOpen
+                    ? {
+                        paddingBottom: theme.mixins.customPadding.p8,
+                    }
+                    : {})), children: [(0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g8 }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
+                                    fontSize: theme.typography.fontSize14,
+                                    color: theme.palette.text.black,
+                                    fontWeight: theme.typography.fontWeight700,
+                                }, children: "Wallet address" }), (0, jsx_runtime_1.jsx)(Input_1.default, { sx: {
+                                    paddingX: theme.mixins.customPadding.p16,
                                 }, inputRest: {
-                                    placeholder: "Select a network",
-                                    value: (selectedNetwork === null || selectedNetwork === void 0 ? void 0 : selectedNetwork.name) || "",
+                                    placeholder: "Enter recipient address",
+                                    value: recipientAddress,
                                     onChange: handleChangeRecipientAddress,
-                                    inputProps: {
-                                        readOnly: true,
-                                    },
-                                }, leftPart: (0, jsx_runtime_1.jsx)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g8 }), children: (0, jsx_runtime_1.jsx)(Icon_1.default, { iconKey: "IC_NETWORK", src: (selectedNetwork === null || selectedNetwork === void 0 ? void 0 : selectedNetwork.link) || undefined, sx: { width: 24, height: 24 } }) }), rightPart: (0, jsx_runtime_1.jsx)(material_1.Box, { sx: { display: "block" }, children: (0, jsx_runtime_1.jsx)(material_1.SvgIcon, { sx: { width: 10, height: 18, display: "block" }, children: SvgPath_1.ARROW_DOWN }) }) }), children: (0, jsx_runtime_1.jsx)(ModalLayout_1.default, { title: "Select network", onClose: closeSelectNetwork, children: (0, jsx_runtime_1.jsx)(SelectNetwork_1.default, { networks: networks, selectedNetwork: selectedNetwork, selectedToken: selectedToken, onChangeNetwork: handleChangeNetwork }) }) })] }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g8 }), children: [(0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g8, alignItems: "center", justifyContent: "space-between" }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
-                                        fontSize: theme.typography.fontSize14,
-                                        color: theme.palette.text.black,
-                                        fontWeight: theme.typography.fontWeight700,
-                                    }, children: "Withdrawal amount" }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g8, alignItems: "center" }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.value), { fontSize: theme.typography.fontSize11, color: theme.palette.text.accent }), children: "Your balance " }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.value), { fontSize: theme.typography.fontSize12, color: theme.palette.text.black, fontWeight: theme.typography.fontWeight700 }), children: (0, jsx_runtime_1.jsx)(Formatter_1.default, { value: balance, unit: " ".concat(selectedToken === null || selectedToken === void 0 ? void 0 : selectedToken.name) }) })] })] }), (0, jsx_runtime_1.jsx)(xhub_keyboard_1.Label, { htmlFor: keyboardId, children: (0, jsx_runtime_1.jsx)(xhub_keyboard_1.Input, { elementsAcceptIds: ["form-amount-keyboard-id"], value: amount === null || amount === void 0 ? void 0 : amount.toString(), displayType: xhub_keyboard_1.DisplayType.Double, placeholder: ((0, jsx_runtime_1.jsx)(material_1.Box, { component: "span", sx: { pointerEvents: "none" }, children: placeholder })), styles: {
-                                    container: {
-                                        paddingRight: theme.mixins.customPadding.p4,
-                                        paddingLeft: theme.mixins.customPadding.p16,
-                                        paddingTop: theme.mixins.customPadding.p4,
-                                        paddingBottom: theme.mixins.customPadding.p4,
-                                        border: "1px ".concat(theme.palette.border.primary, " solid"),
-                                        borderRadius: theme.mixins.customRadius.r8,
-                                    },
-                                }, rightElement: (0, jsx_runtime_1.jsx)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g8 }), children: (0, jsx_runtime_1.jsx)(material_1.Box, { onClick: handleClickMaxAmount, sx: {
-                                            background: theme.palette.background.tertiary,
+                                    id: "recipient-address-input-id",
+                                }, rightPart: (0, jsx_runtime_1.jsx)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g8 }), children: !!recipientAddress ? ((0, jsx_runtime_1.jsx)("label", { htmlFor: "recipient-address-input-id", children: (0, jsx_runtime_1.jsx)(material_1.Box, { onClick: handleClearRecipientAddress, sx: __assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g8, cursor: "pointer" }), children: (0, jsx_runtime_1.jsx)(material_1.SvgIcon, { sx: { width: 12, height: 12 }, children: SvgPath_1.IC_CLOSE }) }) })) : ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g8 }), children: [(0, jsx_runtime_1.jsx)(material_1.Box, { onClick: openScannerAddressQrCode, children: (0, jsx_runtime_1.jsx)(Icon_1.default, { iconKey: "IC_SCAN", sx: { width: 18, height: 18 } }) }), (0, jsx_runtime_1.jsx)(material_1.Divider, { orientation: "vertical", variant: "fullWidth", flexItem: true }), (0, jsx_runtime_1.jsx)(material_1.Box, { onClick: handlePaste, children: (0, jsx_runtime_1.jsx)(material_1.SvgIcon, { sx: { width: 18, height: 18 }, children: SvgPath_1.IC_DOCUMENTS }) })] })) }) }), !!recipientAddressError && ((0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.validationError), children: recipientAddressError }))] }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g8, opacity: allowSelectNetwork ? 1 : 0.5, pointerEvents: allowSelectNetwork ? "auto" : "none" }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
+                                    fontSize: theme.typography.fontSize14,
+                                    color: theme.palette.text.black,
+                                    fontWeight: theme.typography.fontWeight700,
+                                }, children: "Network" }), (0, jsx_runtime_1.jsx)(DrawerComponent_1.default, { ref: selectNetworkDrawerRef, trigger: (0, jsx_runtime_1.jsx)(Input_1.default, { sx: {
+                                        paddingLeft: theme.mixins.customPadding.p12,
+                                        paddingRight: theme.mixins.customPadding.p16,
+                                    }, inputRest: {
+                                        placeholder: "Select a network",
+                                        value: (selectedNetwork === null || selectedNetwork === void 0 ? void 0 : selectedNetwork.name) || "",
+                                        onChange: handleChangeRecipientAddress,
+                                        inputProps: {
+                                            readOnly: true,
+                                        },
+                                    }, leftPart: (0, jsx_runtime_1.jsx)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g8 }), children: (0, jsx_runtime_1.jsx)(Icon_1.default, { iconKey: "IC_NETWORK", src: (selectedNetwork === null || selectedNetwork === void 0 ? void 0 : selectedNetwork.link) || undefined, sx: { width: 24, height: 24 } }) }), rightPart: (0, jsx_runtime_1.jsx)(material_1.Box, { sx: { display: "block" }, children: (0, jsx_runtime_1.jsx)(material_1.SvgIcon, { sx: { width: 10, height: 18, display: "block" }, children: SvgPath_1.ARROW_DOWN }) }) }), children: (0, jsx_runtime_1.jsx)(ModalLayout_1.default, { title: "Select network", onClose: closeSelectNetwork, children: (0, jsx_runtime_1.jsx)(SelectNetwork_1.default, { networks: networks, selectedNetwork: selectedNetwork, selectedToken: selectedToken, onChangeNetwork: handleChangeNetwork }) }) })] }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g8 }), children: [(0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g8, alignItems: "center", justifyContent: "space-between" }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
+                                            fontSize: theme.typography.fontSize14,
                                             color: theme.palette.text.black,
-                                            fontSize: theme.typography.fontSize11,
                                             fontWeight: theme.typography.fontWeight700,
-                                            borderRadius: theme.mixins.customRadius.r4,
-                                            paddingX: theme.mixins.customPadding.p16,
-                                            paddingY: theme.mixins.customPadding.p8,
-                                            border: "0px solid",
-                                            cursor: "pointer",
-                                        }, children: (0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
-                                                fontSize: theme.typography.fontSize12,
-                                                color: theme.palette.text.primary,
-                                                fontWeight: theme.typography.fontWeight500,
-                                            }, children: "Max" }) }) }) }) }), !!amountErrorMessage && ((0, jsx_runtime_1.jsxs)(Text_1.default, { sx: __assign({}, theme.mixins.validationError), children: [amountErrorMessage, " ", !!amountError && (0, jsx_runtime_1.jsx)(Formatter_1.default, { value: amountError, unit: " ".concat(selectedToken === null || selectedToken === void 0 ? void 0 : selectedToken.name) })] }))] }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g8 }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
-                                fontSize: theme.typography.fontSize14,
-                                color: theme.palette.text.black,
-                                fontWeight: theme.typography.fontWeight700,
-                            }, children: "Comment" }), (0, jsx_runtime_1.jsx)(Input_1.default, { inputRest: {
-                                placeholder: "Enter comment if needed",
-                                value: comment,
-                                onChange: handleChangeComment,
-                            } }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.validationDescription), children: "Enter comment if your receiving platform requires one to avoid losing your funds." })] }), (0, jsx_runtime_1.jsx)(Fees_1.default, { isFeePaidByAmount: true, feesData: estimateFee, amount: +amount, tokenSlug: (selectedToken === null || selectedToken === void 0 ? void 0 : selectedToken.slug) || "", feesStyle: Fees_1.FeesStyle.WITH_BACKGROUND, setIsEnoughBalanceToPayFee: setIsEnoughBalanceToPayFee }), (0, jsx_runtime_1.jsx)(QrCodeReader_1.default, { ref: scannerAddressQrCodeRef, onResult: handleScanAddressQrCode }), (0, jsx_runtime_1.jsx)(Button_1.default.Primary, { loading: isValidatingAddress || isEstimatingFee, onClick: handleContinue, status: !recipientAddress ||
-                        !selectedNetwork ||
-                        !amount ||
-                        !!recipientAddressError ||
-                        !!amountError ||
-                        !isEnoughBalanceToPayFee
-                        ? Button_1.BUTTON_STATUS.DISABLED
-                        : Button_1.BUTTON_STATUS.ENABLED, sx: { width: "100%", marginTop: "auto" }, children: "Continue" })] }) }));
+                                        }, children: "Withdrawal amount" }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g8, alignItems: "center" }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.value), { fontSize: theme.typography.fontSize11, color: theme.palette.text.accent }), children: "Your balance " }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.value), { fontSize: theme.typography.fontSize12, color: theme.palette.text.black, fontWeight: theme.typography.fontWeight700 }), children: (0, jsx_runtime_1.jsx)(Formatter_1.default, { value: balance, unit: " ".concat(selectedToken === null || selectedToken === void 0 ? void 0 : selectedToken.name) }) })] })] }), (0, jsx_runtime_1.jsx)(xhub_keyboard_1.Label, { htmlFor: keyboardId, children: (0, jsx_runtime_1.jsx)(xhub_keyboard_1.Input, { elementsAcceptIds: ["form-amount-keyboard-id"], value: amount === null || amount === void 0 ? void 0 : amount.toString(), displayType: xhub_keyboard_1.DisplayType.Double, placeholder: ((0, jsx_runtime_1.jsx)(material_1.Box, { component: "span", sx: { pointerEvents: "none" }, children: placeholder })), styles: {
+                                        container: {
+                                            paddingRight: theme.mixins.customPadding.p4,
+                                            paddingLeft: theme.mixins.customPadding.p16,
+                                            paddingTop: theme.mixins.customPadding.p4,
+                                            paddingBottom: theme.mixins.customPadding.p4,
+                                            border: "1px ".concat(theme.palette.border.primary, " solid"),
+                                            borderRadius: theme.mixins.customRadius.r8,
+                                        },
+                                    }, rightElement: (0, jsx_runtime_1.jsx)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g8 }), children: (0, jsx_runtime_1.jsx)(material_1.Box, { onClick: handleClickMaxAmount, sx: {
+                                                background: theme.palette.background.tertiary,
+                                                color: theme.palette.text.black,
+                                                fontSize: theme.typography.fontSize11,
+                                                fontWeight: theme.typography.fontWeight700,
+                                                borderRadius: theme.mixins.customRadius.r4,
+                                                paddingX: theme.mixins.customPadding.p16,
+                                                paddingY: theme.mixins.customPadding.p8,
+                                                border: "0px solid",
+                                                cursor: "pointer",
+                                            }, children: (0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
+                                                    fontSize: theme.typography.fontSize12,
+                                                    color: theme.palette.text.primary,
+                                                    fontWeight: theme.typography.fontWeight500,
+                                                }, children: "Max" }) }) }) }) }), !!amountErrorMessage && ((0, jsx_runtime_1.jsxs)(Text_1.default, { sx: __assign({}, theme.mixins.validationError), children: [amountErrorMessage, " ", !!amountError && ((0, jsx_runtime_1.jsx)(Formatter_1.default, { value: amountError, unit: " ".concat(selectedToken === null || selectedToken === void 0 ? void 0 : selectedToken.name) }))] }))] }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g8 }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
+                                    fontSize: theme.typography.fontSize14,
+                                    color: theme.palette.text.black,
+                                    fontWeight: theme.typography.fontWeight700,
+                                }, children: "Comment" }), (0, jsx_runtime_1.jsx)(Input_1.default, { inputRest: {
+                                    placeholder: "Enter comment if needed",
+                                    value: comment,
+                                    onChange: handleChangeComment,
+                                } }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.validationDescription), children: "Enter comment if your receiving platform requires one to avoid losing your funds." })] }), (0, jsx_runtime_1.jsx)(Fees_1.default, { isFeePaidByAmount: true, feesData: estimateFee, amount: +amount, tokenSlug: (selectedToken === null || selectedToken === void 0 ? void 0 : selectedToken.slug) || "", feesStyle: Fees_1.FeesStyle.WITH_BACKGROUND, setIsEnoughBalanceToPayFee: setIsEnoughBalanceToPayFee }), (0, jsx_runtime_1.jsx)(QrCodeReader_1.default, { ref: scannerAddressQrCodeRef, onResult: handleScanAddressQrCode }), (0, jsx_runtime_1.jsx)(Button_1.default.Primary, { loading: isValidatingAddress || isEstimatingFee, onClick: handleContinue, status: !recipientAddress ||
+                            !selectedNetwork ||
+                            !amount ||
+                            !!recipientAddressError ||
+                            !!amountError ||
+                            !isEnoughBalanceToPayFee
+                            ? Button_1.BUTTON_STATUS.DISABLED
+                            : Button_1.BUTTON_STATUS.ENABLED, sx: { width: "100%", marginTop: "auto" }, children: "Continue" })] }) }) }));
 }

package/dist/components/TekWallet/components/views/SendExternalView/index.js

@@ -126,13 +126,7 @@ var SendExternalView = (0, react_1.forwardRef)(function (props, ref) {
                 height: "100%",
             }, swiperStyle: {
                 height: "100%",
-            }, children: [(0, jsx_runtime_1.jsx)(react_2.SwiperSlide, { style: { minHeight: "100%" }, children: (0, jsx_runtime_1.jsx)(DefaultPageLayout_1.default, { children: (0, jsx_runtime_1.jsx)(SelectToken_1.default, { tokens: withdrawTokens, selectedToken: selectedToken, onChangeToken: handleSelectToken }) }) }, SendExternalStep.SELECT_TOKEN), (0, jsx_runtime_1.jsx)(react_2.SwiperSlide, { style: { minHeight: "100%" }, children: (0, jsx_runtime_1.jsx)(DefaultPageLayout_1.default, { sx: {
-                            height: "100%",
-                            paddingLeft: "0px",
-                            paddingRight: "0px",
-                            paddingTop: "0px",
-                            paddingBottom: "0px",
-                        }, children: (0, jsx_runtime_1.jsx)(Form_1.default, { sx: __assign({}, theme.mixins.pagePadding), selectedToken: selectedToken, onContinue: gotoConfirmStep }, clearFormKey) }) }, SendExternalStep.ADDRESS_FORM), (0, jsx_runtime_1.jsx)(react_2.SwiperSlide, { style: { minHeight: "100%" }, children: (0, jsx_runtime_1.jsx)(DefaultPageLayout_1.default, { sx: {
+            }, children: [(0, jsx_runtime_1.jsx)(react_2.SwiperSlide, { style: { height: "100%", overflow: "hidden" }, children: (0, jsx_runtime_1.jsx)(ChildPageLayout_1.default, { children: (0, jsx_runtime_1.jsx)(DefaultPageLayout_1.default, { children: (0, jsx_runtime_1.jsx)(SelectToken_1.default, { tokens: withdrawTokens, selectedToken: selectedToken, onChangeToken: handleSelectToken }) }) }) }, SendExternalStep.SELECT_TOKEN), (0, jsx_runtime_1.jsx)(react_2.SwiperSlide, { style: { minHeight: "100%" }, children: (0, jsx_runtime_1.jsx)(react_1.Suspense, { children: (0, jsx_runtime_1.jsx)(Form_1.default, { sx: __assign({}, theme.mixins.pagePadding), selectedToken: selectedToken, onContinue: gotoConfirmStep }, clearFormKey) }) }, SendExternalStep.ADDRESS_FORM), (0, jsx_runtime_1.jsx)(react_2.SwiperSlide, { style: { minHeight: "100%" }, children: (0, jsx_runtime_1.jsx)(DefaultPageLayout_1.default, { sx: {
                             height: "100%",
                         }, children: payload && ((0, jsx_runtime_1.jsx)(Summary_1.default, { estimateFee: estimateFee, payload: __assign(__assign({}, payload), { await_completion: true }), selectedToken: selectedToken, confirmProps: {
                                 onSuccess: handleSendSuccess,