tek-wallet 0.0.628 → 0.0.630

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

@@ -26,6 +26,7 @@ var ThemeProvider_1 = require("../../../providers/ThemeProvider");
 var NeonLineChart_1 = __importDefault(require("../NeonLineChart"));
 var Icon_1 = __importDefault(require("../Icon"));
 var getIcon_1 = __importDefault(require("../../../utils/getIcon"));
+var ContentHiddenProvider_1 = require("../../../providers/ContentHiddenProvider");
 var fakeSeries = [
     {
         name: "All",
@@ -76,6 +77,7 @@ var variants = {
 var AmountGroupAndChart = function (props) {
     var _a = (0, react_1.useState)(false), expandAreaChart = _a[0], setExpandAreaChart = _a[1];
     var _b = (0, react_1.useState)(), timeRangeData = _b[0], setTimeRangeData = _b[1];
+    var isHidden = (0, ContentHiddenProvider_1.useContentHidden)().isHidden;
     var theme = (0, ThemeProvider_1.useTheme)();
     var handleChangeTimeRange = function (data) {
         setTimeRangeData(data);
@@ -99,6 +101,7 @@ var AmountGroupAndChart = function (props) {
                                         bottom: 0,
                                         transition: "all 500ms ease-in-out",
                                         transform: !expandAreaChart ? "translateX(-25%) scale(0.5)" : "none",
+                                        display: isHidden && !expandAreaChart ? "none" : "block",
                                     }, children: (0, jsx_runtime_1.jsx)(DelayMounted_1.default, { delay: 800, children: (0, jsx_runtime_1.jsx)(NeonLineChart_1.default, { showMinMaxValues: expandAreaChart, series: fakeSeries, categories: labels, sx: {
                                                 width: "100%",
                                                 height: "fit-content",
@@ -106,9 +109,8 @@ var AmountGroupAndChart = function (props) {
                                                 transform: !expandAreaChart ? "translateY(-100%)" : "none",
                                                 my: theme.mixins.customMargin.m3,
                                             } }) }) }), (0, jsx_runtime_1.jsx)(framer_motion_1.motion.div, { style: {
-                                        position: "absolute",
-                                        right: "40%",
-                                        bottom: 10,
+                                        position: "relative",
+                                        transform: "translateY(350%)",
                                     }, initial: "hidden", animate: expandAreaChart ? "visible" : "hidden", variants: variants, transition: {
                                         opacity: {
                                             duration: expandAreaChart ? 0.5 : 0.25,
@@ -129,6 +131,6 @@ var AmountGroupAndChart = function (props) {
                                         ? "rotate(180deg) translateX(900%) translateY(120%)"
                                         : "translateX(-50%) translateY(100%)",
                                     zIndex: 20,
-                                }, width: 20, src: (0, getIcon_1.default)("expand"), onClick: toggleExpand }) })] })] }) }));
+                                }, width: 20, src: (0, getIcon_1.default)("".concat(!expandAreaChart ? "expand" : "collapse")), onClick: toggleExpand }) })] })] }) }));
 };
 exports.default = AmountGroupAndChart;

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

@@ -19,30 +19,44 @@ var Text_1 = __importDefault(require("../Text"));
 var Formatter_1 = __importDefault(require("../Formatter"));
 var Icon_1 = __importDefault(require("../Icon"));
 var material_1 = require("@mui/material");
-var getIcon_1 = __importDefault(require("../../../utils/getIcon"));
 var providers_1 = require("../../../providers");
+var getIcon_1 = __importDefault(require("../../../utils/getIcon"));
+var ContentHiddenProvider_1 = require("../../../providers/ContentHiddenProvider");
 var AnalyticGroup = function (props) {
     var theme = (0, providers_1.useTheme)();
+    var _a = (0, ContentHiddenProvider_1.useContentHidden)(), isHidden = _a.isHidden, setIsHidden = _a.setIsHidden;
+    var toggleHidden = function () {
+        setIsHidden(!isHidden);
+    };
     return ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.row), { justifyContent: "space-between" }), children: [(0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g6, position: "relative", bottom: "30px" }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
                             fontSize: theme.typography.fontSize15,
                             fontWeight: theme.typography.fontWeight500,
                             color: theme.palette.text.accent2,
-                        }, children: "Total Amount" }), (0, jsx_runtime_1.jsx)(Icon_1.default, { src: (0, getIcon_1.default)("not_see"), width: 16, height: 16 })] }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: {
+                        }, children: "Total Amount" }), (0, jsx_runtime_1.jsx)(Icon_1.default, { src: (0, getIcon_1.default)("not_see"), onClick: toggleHidden, width: 16, height: 16 })] }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: {
                     display: "flex",
                     flexDirection: "column",
                     alignItems: "flex-end",
                     gap: theme.mixins.gaps.g6,
                     fontSize: theme.typography.fontSize12,
-                }, children: [(0, jsx_runtime_1.jsxs)(Text_1.default, { sx: __assign(__assign(__assign({}, theme.mixins.row), theme.mixins.value), { fontSize: theme.typography.fontSize20, gap: theme.mixins.gaps.g6 }), children: [(0, jsx_runtime_1.jsx)(Formatter_1.default, { sx: { fontWeight: theme.typography.fontWeight700 }, value: 1000000 }), (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)(Text_1.default, { sx: {
-                                            fontWeight: theme.typography.fontWeight400,
-                                            fontSize: "0.8em",
-                                        }, children: "USDC" }), (0, jsx_runtime_1.jsx)(Icon_1.default, { src: (0, getIcon_1.default)("arrow_down"), width: 8 })] })] }), (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)(Text_1.default, { sx: {
+                }, children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign(__assign({}, theme.mixins.row), theme.mixins.value), { fontSize: theme.typography.fontSize20, gap: theme.mixins.gaps.g6 }), children: !isHidden ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Formatter_1.default, { sx: { fontWeight: theme.typography.fontWeight700 }, value: 1000000 }), (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)(Text_1.default, { sx: {
+                                                fontWeight: theme.typography.fontWeight400,
+                                                fontSize: "0.8em",
+                                            }, children: "USDC" }), (0, jsx_runtime_1.jsx)(Icon_1.default, { src: (0, getIcon_1.default)("arrow_down"), width: 8 })] })] })) : ((0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
+                                fontSize: theme.typography.fontSize24,
+                                fontWeight: theme.typography.fontWeight700,
+                                color: theme.palette.text.black,
+                            }, children: "*****" })) }), (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)(Text_1.default, { sx: {
                                     fontWeight: theme.typography.fontWeight600,
                                     leading: theme.typography.leading140,
                                     fontSize: theme.typography.fontSize12,
                                     textTransform: "capitalize",
                                     color: theme.palette.text.accent,
-                                }, children: props.timeRange }), (0, jsx_runtime_1.jsx)(Icon_1.default, { src: (0, getIcon_1.default)("arrow_drop_up"), width: 8 }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.value), { color: theme.palette.text.increase, fontSize: theme.typography.fontSize12, fontWeight: theme.typography.fontWeight600, borderBottom: "1px dashed currentColor" }), children: "5.63 (+3,22%)" })] }), (0, jsx_runtime_1.jsx)(material_1.Divider, { sx: {
+                                }, children: props.timeRange }), !isHidden ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Icon_1.default, { src: (0, getIcon_1.default)("arrow_drop_up"), width: 8 }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.value), { color: theme.palette.text.alertStatus, fontSize: theme.typography.fontSize12, fontWeight: theme.typography.fontWeight600, borderBottom: "1px dashed currentColor" }), children: "5.63 (+3,22%)" })] })) : ((0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
+                                    fontSize: theme.typography.fontSize12,
+                                    fontWeight: theme.typography.fontWeight600,
+                                    color: theme.palette.text.accent2,
+                                    display: theme.mixins.row,
+                                }, children: "****" }))] }), (0, jsx_runtime_1.jsx)(material_1.Divider, { sx: {
                             width: "110%",
                             borderColor: "".concat(theme.palette.border.accent),
                             opacity: 0.2,
@@ -53,10 +67,14 @@ var AnalyticGroup = function (props) {
                                     fontSize: theme.typography.fontSize12,
                                     textTransform: "capitalize",
                                     color: theme.palette.text.accent,
-                                }, children: "Profit" }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign({}, theme.mixins.row), children: [(0, jsx_runtime_1.jsx)(Icon_1.default, { src: (0, getIcon_1.default)("approximately"), width: 15, height: 15 }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
-                                            fontSize: theme.typography.fontSize12,
-                                            fontWeight: theme.typography.fontWeight600,
-                                            color: theme.palette.text.accent2,
-                                        }, children: "250k XP" })] }), (0, jsx_runtime_1.jsx)(Icon_1.default, { src: (0, getIcon_1.default)("mark"), width: 15, height: 15 })] })] })] }));
+                                }, children: "Profit" }), (0, jsx_runtime_1.jsx)(material_1.Box, { sx: __assign({}, theme.mixins.row), children: !isHidden ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Icon_1.default, { src: (0, getIcon_1.default)("approximately"), width: 15, height: 15 }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
+                                                fontSize: theme.typography.fontSize12,
+                                                fontWeight: theme.typography.fontWeight600,
+                                                color: theme.palette.text.accent2,
+                                            }, children: "250k XP" })] })) : ((0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
+                                        fontSize: theme.typography.fontSize12,
+                                        fontWeight: theme.typography.fontWeight600,
+                                        color: theme.palette.text.accent2,
+                                    }, children: "****" })) }), (0, jsx_runtime_1.jsx)(Icon_1.default, { src: (0, getIcon_1.default)("mark"), width: 15, height: 15 })] })] })] }));
 };
 exports.default = AnalyticGroup;

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

@@ -1,4 +1,5 @@
 "use strict";
+"use client";
 var __assign = (this && this.__assign) || function () {
     __assign = Object.assign || function(t) {
         for (var s, i = 1, n = arguments.length; i < n; i++) {

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

@@ -1,4 +1,5 @@
 "use strict";
+"use client";
 var __assign = (this && this.__assign) || function () {
     __assign = Object.assign || function(t) {
         for (var s, i = 1, n = arguments.length; i < n; i++) {

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

@@ -32,10 +32,11 @@ var Text_1 = __importDefault(require("../Text"));
 var parsePropsData_1 = __importDefault(require("../../../utils/parsePropsData"));
 var material_1 = require("@mui/material");
 var ThemeProvider_1 = require("../../../providers/ThemeProvider");
+var getIcon_1 = __importDefault(require("../../../utils/getIcon"));
 var NetworkSelection = function (props) {
     var networkDataString = props.networkData, onClick = props.onClick, active = props.active, rest = __rest(props, ["networkData", "onClick", "active"]);
     var theme = (0, ThemeProvider_1.useTheme)();
     var networkData = (0, react_1.useMemo)(function () { return (0, parsePropsData_1.default)(networkDataString); }, [networkDataString]);
-    return ((0, jsx_runtime_1.jsxs)(material_1.Box, __assign({}, rest, { sx: __assign(__assign({}, theme.mixins.row), { backgroundColor: active ? "background.secondary16" : "background.white16", padding: "".concat(theme.mixins.customPadding.p16, " ").concat(theme.mixins.customPadding.p8), borderRadius: theme.mixins.customRadius.r12, border: "1px solid", borderColor: active ? "border.secondary" : "border.white24", gap: theme.mixins.gaps.g8 }), onClick: function () { return onClick === null || onClick === void 0 ? void 0 : onClick(networkData); }, children: [(0, jsx_runtime_1.jsx)(Icon_1.default, { src: networkData === null || networkData === void 0 ? void 0 : networkData.icon, sx: { borderRadius: theme.mixins.customRadius.full }, width: 24 }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.value), { color: "text.white", whiteSpace: "nowrap", textTransform: "capitalize" }), children: networkData === null || networkData === void 0 ? void 0 : networkData.name })] })));
+    return ((0, jsx_runtime_1.jsxs)(material_1.Box, __assign({}, rest, { sx: __assign(__assign({}, theme.mixins.row), { backgroundColor: active ? "".concat(theme.palette.background.tertiary) : "".concat(theme.palette.background.white), padding: "".concat(theme.mixins.customPadding.p16, " ").concat(theme.mixins.customPadding.p8), borderRadius: theme.mixins.customRadius.r12, border: "1px solid", borderColor: active ? "".concat(theme.palette.primary.main) : "".concat(theme.palette.border.accent3), gap: theme.mixins.gaps.g8, justifyContent: "space-between" }), onClick: function () { return onClick === null || onClick === void 0 ? void 0 : onClick(networkData); }, children: [(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)(Icon_1.default, { src: networkData === null || networkData === void 0 ? void 0 : networkData.icon, sx: { borderRadius: theme.mixins.customRadius.full }, width: 24 }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign({}, theme.mixins.column), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.value), { color: "text.white", whiteSpace: "nowrap", textTransform: "capitalize" }), children: networkData === null || networkData === void 0 ? void 0 : networkData.name }), (0, jsx_runtime_1.jsxs)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.activityDescription), { color: theme.palette.text.accent, fontSize: theme.typography.fontSize13, fontWeight: theme.typography.fontWeight400 }), children: ["Minimum Deposit: 0.0003 ", networkData === null || networkData === void 0 ? void 0 : networkData.name] })] })] }), (0, jsx_runtime_1.jsx)(material_1.Box, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { width: 20, height: 20, src: (0, getIcon_1.default)(active ? "circle_checked" : "circle_unchecked") }) })] })));
 };
 exports.default = NetworkSelection;

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

@@ -79,6 +79,8 @@ var CustomTooltip_1 = __importDefault(require("../CustomTooltip"));
 var DialogContentLayout_1 = __importDefault(require("../DialogContentLayout"));
 var Input_1 = __importDefault(require("../Input"));
 var ThemeProvider_1 = require("../../../providers/ThemeProvider");
+var ChildPageLayout_1 = __importDefault(require("../../layouts/ChildPageLayout"));
+var LineValue_1 = __importDefault(require("../LineValue"));
 var ReceiveMethods;
 (function (ReceiveMethods) {
     ReceiveMethods["RECEIVE_INTERNAL"] = "Receive internally";
@@ -101,7 +103,9 @@ exports.ReceiveFunction = (0, react_1.forwardRef)(function (props, ref) {
     var drawerRef = (0, react_1.useRef)(null);
     var amountDrawerRef = (0, react_1.useRef)(null);
     var _a = (0, react_1.useState)(), selectedMethod = _a[0], setSelectedMethod = _a[1];
-    var swiperRef = (0, react_1.useRef)(null);
+    // const swiperRef = useRef<SwiperControlledRef>(null);
+    var modalSwiperRef = (0, react_1.useRef)(null);
+    var pageSwiperRef = (0, react_1.useRef)(null);
     var theme = (0, ThemeProvider_1.useTheme)();
     var _b = (0, react_1.useState)(ReceiveStep.SELECT_METHOD), currentStep = _b[0], setCurrentStep = _b[1];
     var _c = (0, react_1.useState)(), selectedToken = _c[0], setSelectedToken = _c[1];
@@ -160,13 +164,13 @@ exports.ReceiveFunction = (0, react_1.forwardRef)(function (props, ref) {
     }, [receiveAddress, selectedToken, amount, selectedMethod]);
     var warningMessage = (0, react_1.useMemo)(function () {
         if (selectedMethod === ReceiveMethods.RECEIVE_EXTERNAL && !amount) {
-            return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: ["The amount must be between", " ", (0, jsx_runtime_1.jsxs)("strong", { style: { color: theme.palette.text.white }, children: [(0, jsx_runtime_1.jsx)(Formatter_1.default, { value: selectedToken === null || selectedToken === void 0 ? void 0 : selectedToken.min_value }), " to", " ", (0, jsx_runtime_1.jsx)(Formatter_1.default, { value: selectedToken === null || selectedToken === void 0 ? void 0 : selectedToken.max_value, unit: " ".concat(selectedToken === null || selectedToken === void 0 ? void 0 : selectedToken.name) }), " "] }), " ", "and ", (0, jsx_runtime_1.jsx)("strong", { style: { color: theme.palette.text.white }, children: "select the correct network" }), ", unless you will lose your assets."] }));
+            return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: ["The amount must be between", " ", (0, jsx_runtime_1.jsxs)("strong", { style: { color: theme.palette.primary.main }, children: [(0, jsx_runtime_1.jsx)(Formatter_1.default, { value: selectedToken === null || selectedToken === void 0 ? void 0 : selectedToken.min_value }), " to", " ", (0, jsx_runtime_1.jsx)(Formatter_1.default, { value: selectedToken === null || selectedToken === void 0 ? void 0 : selectedToken.max_value, unit: " ".concat(selectedToken === null || selectedToken === void 0 ? void 0 : selectedToken.name) }), " "] }), " ", "and ", (0, jsx_runtime_1.jsx)("strong", { style: { color: theme.palette.primary.main }, children: "select the correct network" }), ", unless you will lose your assets."] }));
         }
         if (selectedMethod === ReceiveMethods.RECEIVE_EXTERNAL && !!amount) {
             return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: ["Please ", (0, jsx_runtime_1.jsx)("strong", { style: { color: theme.palette.text.white }, children: "select the correct network" }), ", unless you will lose your assets."] }));
         }
         if (selectedMethod === ReceiveMethods.RECEIVE_INTERNAL && !amount) {
-            return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: ["The amount must be between", " ", (0, jsx_runtime_1.jsxs)("strong", { style: { color: theme.palette.text.white }, children: [(0, jsx_runtime_1.jsx)(Formatter_1.default, { value: selectedToken === null || selectedToken === void 0 ? void 0 : selectedToken.min_value }), " to", " ", (0, jsx_runtime_1.jsx)(Formatter_1.default, { value: selectedToken === null || selectedToken === void 0 ? void 0 : selectedToken.max_value, unit: " ".concat(selectedToken === null || selectedToken === void 0 ? void 0 : selectedToken.name) })] }), ", unless you will lose your assets."] }));
+            return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: ["The amount must be between", " ", (0, jsx_runtime_1.jsxs)("strong", { style: { color: theme.palette.primary.main }, children: [(0, jsx_runtime_1.jsx)(Formatter_1.default, { value: selectedToken === null || selectedToken === void 0 ? void 0 : selectedToken.min_value }), " to", " ", (0, jsx_runtime_1.jsx)(Formatter_1.default, { value: selectedToken === null || selectedToken === void 0 ? void 0 : selectedToken.max_value, unit: " ".concat(selectedToken === null || selectedToken === void 0 ? void 0 : selectedToken.name) })] }), ", unless you will lose your assets."] }));
         }
         return null;
     }, [selectedMethod, selectedToken, amount]);
@@ -214,12 +218,18 @@ exports.ReceiveFunction = (0, react_1.forwardRef)(function (props, ref) {
         }
     };
     var gotoStep = function (step) {
-        var _a;
+        var _a, _b;
         if (step === ReceiveStep.SELECT_METHOD) {
             clearValues();
         }
         setCurrentStep(step);
-        (_a = swiperRef.current) === null || _a === void 0 ? void 0 : _a.slideTo(step);
+        // swiperRef.current?.slideTo(step);
+        if (step === ReceiveStep.SELECT_METHOD) {
+            (_a = modalSwiperRef.current) === null || _a === void 0 ? void 0 : _a.slideTo(step);
+        }
+        else {
+            (_b = pageSwiperRef.current) === null || _b === void 0 ? void 0 : _b.slideTo(step - 1);
+        }
     };
     var handleSelectToken = function (token) {
         setSelectedToken(token);
@@ -289,44 +299,82 @@ exports.ReceiveFunction = (0, react_1.forwardRef)(function (props, ref) {
             updateReceiveInternalToken();
         }
     }, [isInitPasscode, receiveExternalTokens, receiveInternalTokens]);
-    return ((0, jsx_runtime_1.jsx)(RequireConnect_1.default, { children: (0, jsx_runtime_1.jsx)(DrawerComponent_1.default, { ref: drawerRef, trigger: props.children, onOpen: props.onOpen, onClose: handleOnClose, children: (0, jsx_runtime_1.jsx)(ModalLayout_1.default, { overrideHeader: (0, jsx_runtime_1.jsx)(BackHeader_1.default, { sx: {
+    return ((0, jsx_runtime_1.jsx)(RequireConnect_1.default, { children: (0, jsx_runtime_1.jsx)(DrawerComponent_1.default, { ref: drawerRef, trigger: props.children, onOpen: props.onOpen, onClose: handleOnClose, children: currentStep === ReceiveStep.SELECT_METHOD ? ((0, jsx_runtime_1.jsx)(ModalLayout_1.default, { overrideHeader: (0, jsx_runtime_1.jsx)(BackHeader_1.default, { sx: {
+                        width: "100%",
+                        display: "flex",
+                        alignItems: "center",
+                        minHeight: "2rem",
+                        mb: theme.mixins.customMargin.m20,
+                    }, overrideBack: handleBack, hideBack: currentStep === ReceiveStep.SELECT_METHOD, center: RECEIVE_STEP_NAME[currentStep], children: (0, jsx_runtime_1.jsx)(CloseModal_1.default, { sx: { marginLeft: "auto", mr: theme.mixins.customMargin.m12 }, onClick: close }) }), children: (0, jsx_runtime_1.jsx)(SwiperControlled_1.default, { ref: modalSwiperRef, swiperProps: {
+                        autoHeight: true,
+                        spaceBetween: 32,
+                    }, disableSwipe: true, initialActiveTab: 0, children: (0, jsx_runtime_1.jsx)(react_2.SwiperSlide, { children: (0, jsx_runtime_1.jsx)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { height: "fit-content" }), children: Object.values(ReceiveMethods).map(function (item, index) {
+                                return ((0, jsx_runtime_1.jsxs)(react_1.Fragment, { children: [index !== 0 && (0, jsx_runtime_1.jsx)(material_1.Divider, {}), (0, jsx_runtime_1.jsx)(ListItemCustom_1.default, { title: item, description: item, icon: (0, getIcon_1.default)(item + "_icon"), onClick: function () { return handleSelectMethod(item); }, sx: {
+                                                my: theme.mixins.customMargin.m12,
+                                            } })] }, item));
+                            }) }) }, ReceiveStep.SELECT_METHOD) }, receiveTokens === null || receiveTokens === void 0 ? void 0 : receiveTokens.length) })) : ((0, jsx_runtime_1.jsx)(ChildPageLayout_1.default, { sx: {
+                    padding: theme.mixins.pagePadding,
+                    position: "relative",
+                }, header: (0, jsx_runtime_1.jsx)(BackHeader_1.default, { sx: {
                         width: "100%",
                         display: "flex",
                         alignItems: "center",
                         minHeight: "2rem",
                         mb: theme.mixins.customMargin.m20,
-                    }, overrideBack: handleBack, hideBack: currentStep === ReceiveStep.SELECT_METHOD, center: RECEIVE_STEP_NAME[currentStep], children: (0, jsx_runtime_1.jsx)(CloseModal_1.default, { sx: { marginLeft: "auto" }, onClick: close }) }), children: (0, jsx_runtime_1.jsxs)(SwiperControlled_1.default, { ref: swiperRef, swiperProps: {
+                    }, overrideBack: handleBack, center: RECEIVE_STEP_NAME[currentStep], children: (0, jsx_runtime_1.jsx)(CloseModal_1.default, { sx: { marginLeft: "auto", mr: theme.mixins.customMargin.m12 }, onClick: close }) }), footer: currentStep === ReceiveStep.SHOW_QR_CODE && ((0, jsx_runtime_1.jsx)(material_1.Box, { className: "px-4 w-full", children: (0, jsx_runtime_1.jsx)(Share_1.default, { elementId: "share-receive-info", children: (0, jsx_runtime_1.jsx)(Button_1.default.Secondary, { sx: __assign(__assign({ gap: theme.mixins.gaps.g4 }, theme.mixins.row), { backgroundColor: theme.palette.primary.main, color: theme.palette.text.secondary, borderRadius: theme.mixins.customRadius.r12 }), fullWidth: true, children: (0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
+                                    fontSize: theme.typography.fontSize12,
+                                    fontWeight: theme.typography.fontWeight400,
+                                    leading: theme.typography.leading160,
+                                    textTransform: "capitalize",
+                                }, children: "Share" }) }) }) })), children: (0, jsx_runtime_1.jsxs)(SwiperControlled_1.default, { ref: pageSwiperRef, swiperProps: {
                         autoHeight: true,
                         spaceBetween: 32,
-                    }, disableSwipe: true, initialActiveTab: currentStep, children: [(0, jsx_runtime_1.jsx)(react_2.SwiperSlide, { children: (0, jsx_runtime_1.jsx)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { height: "fit-content" }), children: Object.values(ReceiveMethods).map(function (item, index) {
-                                    return ((0, jsx_runtime_1.jsxs)(react_1.Fragment, { children: [index !== 0 && (0, jsx_runtime_1.jsx)(material_1.Divider, {}), (0, jsx_runtime_1.jsx)(ListItemCustom_1.default, { title: item, description: item, icon: (0, getIcon_1.default)(item + "_icon"), onClick: function () { return handleSelectMethod(item); }, sx: {
-                                                    my: theme.mixins.customMargin.m12,
-                                                } })] }, item));
-                                }) }) }, ReceiveStep.SELECT_METHOD), (0, jsx_runtime_1.jsx)(react_2.SwiperSlide, { children: (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g12, height: "fit-content" }), children: [!receiveTokens && (0, jsx_runtime_1.jsx)(WaitingData_1.default, {}), (receiveTokens === null || receiveTokens === void 0 ? void 0 : receiveTokens.length) === 0 && (0, jsx_runtime_1.jsx)(EmptyData_1.default, {}), receiveTokens === null || receiveTokens === void 0 ? void 0 : receiveTokens.map(function (item) {
+                    }, disableSwipe: true, initialActiveTab: currentStep - 1, children: [(0, jsx_runtime_1.jsx)(react_2.SwiperSlide, { children: (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g12, height: "fit-content" }), children: [!receiveTokens && (0, jsx_runtime_1.jsx)(WaitingData_1.default, {}), (receiveTokens === null || receiveTokens === void 0 ? void 0 : receiveTokens.length) === 0 && (0, jsx_runtime_1.jsx)(EmptyData_1.default, {}), receiveTokens && (receiveTokens === null || receiveTokens === void 0 ? void 0 : receiveTokens.length) > 0 && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.InputBase, { startAdornment: (0, jsx_runtime_1.jsx)(material_1.InputAdornment, { className: "size-5 text-black", position: "start", children: (0, jsx_runtime_1.jsx)(Icon_1.default, { className: "size-5", src: (0, getIcon_1.default)("search") }) }), placeholder: "Search", className: "w-full flex items-center py-1 px-2", sx: {
+                                                    borderRadius: theme.mixins.customRadius.r12,
+                                                    border: "1px solid",
+                                                    borderColor: theme.palette.border.accent3,
+                                                    background: theme.palette.background.white,
+                                                    color: theme.palette.text.black,
+                                                    "input::placeholder": {
+                                                        fontSize: theme.typography.fontSize11,
+                                                        pl: theme.mixins.customPadding.p4,
+                                                        fontWeight: theme.typography.fontWeight500,
+                                                        color: theme.palette.text.black,
+                                                    },
+                                                } }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: {
+                                                    display: theme.mixins.row,
+                                                    justifyContent: "space-between",
+                                                    mt: theme.mixins.customMargin.m16,
+                                                }, children: [(0, jsx_runtime_1.jsxs)(material_1.Stack, { direction: "row", alignItems: "center", gap: 0.5, children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.valueDescription), { color: theme.palette.text.accent, fontWeight: theme.typography.fontWeight600 }), children: "Token" }), (0, jsx_runtime_1.jsxs)(material_1.Box, { className: "flex flex-col gap-[0.8px]", children: [(0, jsx_runtime_1.jsx)(Icon_1.default, { className: "w-2", src: (0, getIcon_1.default)("arrow_drop_up") }), (0, jsx_runtime_1.jsx)(Icon_1.default, { className: "w-2", src: (0, getIcon_1.default)("arrow_drop_down") })] })] }), (0, jsx_runtime_1.jsxs)(material_1.Stack, { direction: "row", alignItems: "center", gap: 0.5, children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.valueDescription), { color: theme.palette.text.accent, fontWeight: theme.typography.fontWeight600 }), children: "Balance" }), (0, jsx_runtime_1.jsxs)(material_1.Box, { className: "flex flex-col gap-[0.8px]", children: [(0, jsx_runtime_1.jsx)(Icon_1.default, { className: "w-2", src: (0, getIcon_1.default)("arrow_drop_up") }), (0, jsx_runtime_1.jsx)(Icon_1.default, { className: "w-2", src: (0, getIcon_1.default)("arrow_drop_down") })] })] })] })] })), receiveTokens === null || receiveTokens === void 0 ? void 0 : receiveTokens.map(function (item) {
                                         var stringifiedTokenData = JSON.stringify(item);
                                         if (!item)
                                             return null;
                                         return ((0, jsx_runtime_1.jsx)(TokenSelection_1.default, { onClick: handleSelectToken, tokenData: stringifiedTokenData, active: (selectedToken === null || selectedToken === void 0 ? void 0 : selectedToken.id) === item.id }, item.id));
-                                    })] }) }, ReceiveStep.SELECT_TOKEN), (0, jsx_runtime_1.jsx)(react_2.SwiperSlide, { children: (0, jsx_runtime_1.jsx)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g12 }), children: networks === null || networks === void 0 ? void 0 : networks.map(function (item) {
-                                    if (!item)
-                                        return null;
-                                    return ((0, jsx_runtime_1.jsx)(NetworkSelection_1.default, { onClick: handleSelectNetwork, networkData: JSON.stringify(item), active: (selectedNetwork === null || selectedNetwork === void 0 ? void 0 : selectedNetwork.id) === item.id }, item.id));
-                                }) }) }, ReceiveStep.SELECT_NETWORK), (0, jsx_runtime_1.jsx)(react_2.SwiperSlide, { children: (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: {
+                                    })] }) }, ReceiveStep.SELECT_TOKEN), (0, jsx_runtime_1.jsx)(react_2.SwiperSlide, { children: (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g12 }), children: [networks && networks.length > 0 && ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.paper), { borderRadius: theme.mixins.customRadius.r16, background: theme.palette.background.accent3, gap: theme.mixins.gaps.g4 }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.fieldTitle), { fontWeight: theme.typography.fontWeight700, color: theme.palette.text.darkContrast }), children: "Choosing a network? Let us help!" }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.activityDescription), { color: theme.palette.text.accent, fontWeight: theme.typography.fontWeight500 }), children: "Select the network used by your sending platform." }), (0, jsx_runtime_1.jsxs)(material_1.Stack, { direction: "row", gap: 0.5, alignItems: "center", children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
+                                                            color: theme.palette.primary.main,
+                                                            fontWeight: theme.typography.fontWeight600,
+                                                            fontSize: theme.typography.fontSize10,
+                                                        }, children: "Learn more" }), (0, jsx_runtime_1.jsx)(Icon_1.default, { width: 6, height: 6, src: (0, getIcon_1.default)("keyboard_arrow_down") })] })] })), networks === null || networks === void 0 ? void 0 : networks.map(function (item) {
+                                        if (!item)
+                                            return null;
+                                        return ((0, jsx_runtime_1.jsx)(NetworkSelection_1.default, { onClick: handleSelectNetwork, networkData: JSON.stringify(item), active: (selectedNetwork === null || selectedNetwork === void 0 ? void 0 : selectedNetwork.id) === item.id }, item.id));
+                                    })] }) }, ReceiveStep.SELECT_NETWORK), (0, jsx_runtime_1.jsx)(react_2.SwiperSlide, { children: (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: {
                                     display: "flex",
                                     flexDirection: "column",
                                     gap: theme.mixins.gaps.g16,
-                                }, children: [(0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({ width: "100%" }, theme.mixins.column), { gap: theme.mixins.gaps.g12, backgroundColor: theme.palette.background.black24, borderRadius: theme.mixins.customRadius.r16, padding: theme.mixins.customPadding.p16, alignItems: "flex-start", backdropFilter: "blur(10px)" }), id: "share-receive-info", children: [(0, jsx_runtime_1.jsx)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g4, color: "text.white", alignSelf: "center" }), children: (0, jsx_runtime_1.jsxs)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.value), { textAlign: "center" }), children: ["Receive", " ", (0, jsx_runtime_1.jsx)("strong", { children: !!amount && (0, jsx_runtime_1.jsx)(Formatter_1.default, { value: amount, unit: " ".concat(selectedToken === null || selectedToken === void 0 ? void 0 : selectedToken.name) }) }), " ", selectedMethod === ReceiveMethods.RECEIVE_INTERNAL ? "Internally" : "Externally"] }) }), (0, jsx_runtime_1.jsx)(material_1.Box, { sx: {
-                                                    position: "relative",
-                                                    width: "fit-content",
-                                                    height: "fit-content",
-                                                    alignSelf: "center",
-                                                    borderRadius: theme.mixins.customRadius.r12,
-                                                    overflow: "hidden",
-                                                    backgroundColor: theme.palette.background.white,
-                                                    backdropFilter: "blur(10px)",
-                                                }, children: (0, jsx_runtime_1.jsx)(QRCode_1.default, { value: qrCodeValue, logo: (0, getIcon_1.default)("ton"), bgColor: "transparent" }) }), selectedMethod === ReceiveMethods.RECEIVE_EXTERNAL && ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g4, color: "text.white" }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.valueDescription), children: "Network" }), (0, jsx_runtime_1.jsxs)(material_1.Box, { component: "button", sx: __assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g2, cursor: "pointer", transition: "transform 0.3s ease-in-out", "&:active": {
-                                                                transform: "translateX(0.5rem)",
-                                                            } }), onClick: handleBack, children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.value), children: selectedNetwork === null || selectedNetwork === void 0 ? void 0 : selectedNetwork.name }), (0, jsx_runtime_1.jsx)(Icon_1.default, { src: (0, getIcon_1.default)("right_arrow"), width: 10 })] })] })), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g4, color: "text.white" }), children: [(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)(Text_1.default, { sx: __assign({}, theme.mixins.valueDescription), children: selectedMethod === ReceiveMethods.RECEIVE_INTERNAL ? "Internal address" : "Address" }), selectedMethod === ReceiveMethods.RECEIVE_INTERNAL && ((0, jsx_runtime_1.jsx)(CustomTooltip_1.default, { trigger: (0, jsx_runtime_1.jsx)(Icon_1.default, { src: (0, getIcon_1.default)("tooltip"), width: 16 }), children: (0, jsx_runtime_1.jsx)(DialogContentLayout_1.default, { content: (0, jsx_runtime_1.jsxs)(Text_1.default, { sx: __assign({}, theme.mixins.warning), children: ["This address is used to receive token by internal transfer. You can not use it for blockchain transaction. If you want to receive token by blockchain, please select the", " ", (0, jsx_runtime_1.jsx)("strong", { children: "Receive External" }), " method instead."] }) }) }))] }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.value), { wordBreak: "break-all" }), children: (0, jsx_runtime_1.jsx)(CopyTextComponent_1.default, { value: receiveAddress || "", children: receiveAddress }) })] }), !!warningMessage && ((0, jsx_runtime_1.jsx)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g4, backgroundColor: theme.palette.background.white16, borderRadius: theme.mixins.customRadius.r12, padding: theme.mixins.customPadding.p8 }), children: (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.valueDescription), children: warningMessage }) }))] }), (0, jsx_runtime_1.jsx)(DrawerComponent_1.default, { ref: amountDrawerRef, sx: {
+                                }, children: [(0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({ width: "100%" }, theme.mixins.column), { gap: theme.mixins.gaps.g12, backgroundColor: theme.palette.background.tertiary, borderRadius: theme.mixins.customRadius.r16, padding: theme.mixins.customPadding.p16, paddingTop: "80px", alignItems: "flex-start", position: "relative", marginTop: "75px" }), id: "share-receive-info", children: [(0, jsx_runtime_1.jsx)(material_1.Divider, { sx: {
+                                                    color: theme.palette.border.accent,
+                                                    width: "100%",
+                                                } }), (0, jsx_runtime_1.jsx)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.center), { top: 0, width: "fit-content", height: "fit-content", borderRadius: theme.mixins.customRadius.r12, padding: theme.mixins.customPadding.p8 }), children: (0, jsx_runtime_1.jsx)(QRCode_1.default, { value: qrCodeValue, logo: (selectedNetwork === null || selectedNetwork === void 0 ? void 0 : selectedNetwork.link) || (0, getIcon_1.default)("clock"), bgColor: "transparent", size: 150 }) }), selectedMethod === ReceiveMethods.RECEIVE_EXTERNAL && ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g4, color: "text.white" }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.valueDescription), children: "Network" }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.row), { justifyContent: "space-between" }), onClick: handleBack, children: [(0, jsx_runtime_1.jsxs)(material_1.Box, { component: "button", sx: __assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g4, cursor: "pointer", transition: "transform 0.3s ease-in-out", "&:active": {
+                                                                        transform: "translateX(0.5rem)",
+                                                                    } }), children: [(0, jsx_runtime_1.jsx)(Icon_1.default, { className: "w-6 h-6 rounded-full", src: (selectedNetwork === null || selectedNetwork === void 0 ? void 0 : selectedNetwork.link) || (0, getIcon_1.default)("clock") }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.value), children: selectedNetwork === null || selectedNetwork === void 0 ? void 0 : selectedNetwork.name }), (0, jsx_runtime_1.jsx)(Icon_1.default, { src: (0, getIcon_1.default)("right_arrow"), width: 10 })] }), (0, jsx_runtime_1.jsx)(Icon_1.default, { src: (0, getIcon_1.default)("arrow_down"), className: "w-2 h-2" })] })] })), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g4, color: "text.white" }), children: [(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)(Text_1.default, { sx: __assign({}, theme.mixins.valueDescription), children: selectedMethod === ReceiveMethods.RECEIVE_INTERNAL ? "Internal address" : "Address" }), selectedMethod === ReceiveMethods.RECEIVE_INTERNAL && ((0, jsx_runtime_1.jsx)(CustomTooltip_1.default, { trigger: (0, jsx_runtime_1.jsx)(Icon_1.default, { src: (0, getIcon_1.default)("tooltip"), width: 16 }), children: (0, jsx_runtime_1.jsx)(DialogContentLayout_1.default, { content: (0, jsx_runtime_1.jsxs)(Text_1.default, { sx: __assign({}, theme.mixins.warning), children: ["This address is used to receive token by internal transfer. You can not use it for blockchain transaction. If you want to receive token by blockchain, please select the", " ", (0, jsx_runtime_1.jsx)("strong", { children: "Receive External" }), " method instead."] }) }) }))] }), (0, jsx_runtime_1.jsxs)(CopyTextComponent_1.default, { sx: __assign(__assign({}, theme.mixins.row), { justifyContent: "space-between" }), value: receiveAddress || "", children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.value), { wordBreak: "break-all", maxWidth: "85%" }), children: receiveAddress }), (0, jsx_runtime_1.jsx)(Icon_1.default, { src: (0, getIcon_1.default)("copy"), className: "w-5 h-5" })] })] }), (0, jsx_runtime_1.jsx)(material_1.Divider, { sx: {
+                                                    color: theme.palette.border.accent,
+                                                    width: "100%",
+                                                } }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({ width: "100%" }, theme.mixins.column), { gap: theme.mixins.gaps.g12 }), children: [(0, jsx_runtime_1.jsx)(LineValue_1.default, { field: (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.valueDescription), { color: theme.palette.text.accent, fontSize: theme.typography.fontSize14 }), children: "Minimum Top Up" }), value: (0, jsx_runtime_1.jsxs)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.activityTitle), { fontSize: theme.typography.fontSize14 }), children: ["0.003 ", selectedNetwork === null || selectedNetwork === void 0 ? void 0 : selectedNetwork.name] }) }), (0, jsx_runtime_1.jsx)(LineValue_1.default, { field: (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.valueDescription), { color: theme.palette.text.accent, fontSize: theme.typography.fontSize14 }), children: "Top Up Arrival Time" }), value: (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.activityTitle), { fontSize: theme.typography.fontSize14 }), children: "~ 7 Minutes" }) }), (0, jsx_runtime_1.jsx)(LineValue_1.default, { field: (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.valueDescription), { color: theme.palette.text.accent, fontSize: theme.typography.fontSize14 }), children: "Withdrawal Arrival Time" }), value: (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.activityTitle), { fontSize: theme.typography.fontSize14 }), children: "~ 20 Minutes" }) })] }), (0, jsx_runtime_1.jsx)(material_1.Divider, { sx: {
+                                                    color: theme.palette.border.accent,
+                                                    width: "100%",
+                                                    mt: theme.mixins.customMargin.m12,
+                                                } }), !!warningMessage && ((0, jsx_runtime_1.jsx)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g4, backgroundColor: theme.palette.background.white16, borderRadius: theme.mixins.customRadius.r12, padding: theme.mixins.customPadding.p8 }), children: (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.valueDescription), children: warningMessage }) }))] }), (0, jsx_runtime_1.jsx)(DrawerComponent_1.default, { ref: amountDrawerRef, sx: {
                                             width: "100%",
                                             display: "flex",
                                             justifyContent: "center",
@@ -341,17 +389,7 @@ exports.ReceiveFunction = (0, react_1.forwardRef)(function (props, ref) {
                                                             onChange: handleChangeAmount,
                                                             type: "text",
                                                             inputMode: "decimal",
-                                                        }, rightPart: (0, jsx_runtime_1.jsx)(Button_1.default.Secondary, { onClick: handleClickMaxAmount, sx: __assign({}, theme.mixins.smallButton), children: "Max" }) }), amountError && (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.validationError), children: amountError }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.row), { width: "100%", mt: theme.mixins.customMargin.m8, gap: theme.mixins.gaps.g12 }), children: [!!amount && (0, jsx_runtime_1.jsx)(Button_1.default.Text, { onClick: handleUnset, children: "Unset" }), (0, jsx_runtime_1.jsx)(Button_1.default.Primary, { sx: { flex: 1 }, onClick: handleContinue, status: !!amountError ? Button_1.BUTTON_STATUS.DISABLED : Button_1.BUTTON_STATUS.ENABLED, children: "Continue" })] })] }) }) }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g12, justifyContent: "center" }), children: [(0, jsx_runtime_1.jsx)(CopyTextComponent_1.default, { value: qrCodeValue, children: (0, jsx_runtime_1.jsxs)(Button_1.default.Secondary, { className: "gap-1.5 flex items-center", children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
-                                                                fontSize: theme.typography.fontSize12,
-                                                                fontWeight: theme.typography.fontWeight400,
-                                                                leading: theme.typography.leading160,
-                                                                textTransform: "capitalize",
-                                                            }, children: "Copy" }), (0, jsx_runtime_1.jsx)(Icon_1.default, { src: (0, getIcon_1.default)("copy"), width: 20 })] }) }), (0, jsx_runtime_1.jsx)(Share_1.default, { elementId: "share-receive-info", children: (0, jsx_runtime_1.jsxs)(Button_1.default.Secondary, { sx: __assign({ gap: theme.mixins.gaps.g4 }, theme.mixins.row), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
-                                                                fontSize: theme.typography.fontSize12,
-                                                                fontWeight: theme.typography.fontWeight400,
-                                                                leading: theme.typography.leading160,
-                                                                textTransform: "capitalize",
-                                                            }, children: "Share" }), (0, jsx_runtime_1.jsx)(Icon_1.default, { src: (0, getIcon_1.default)("share"), width: 20 })] }) })] })] }) }, ReceiveStep.SHOW_QR_CODE)] }, receiveTokens === null || receiveTokens === void 0 ? void 0 : receiveTokens.length) }) }) }));
+                                                        }, rightPart: (0, jsx_runtime_1.jsx)(Button_1.default.Secondary, { onClick: handleClickMaxAmount, sx: __assign({}, theme.mixins.smallButton), children: "Max" }) }), amountError && (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.validationError), children: amountError }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.row), { width: "100%", mt: theme.mixins.customMargin.m8, gap: theme.mixins.gaps.g12 }), children: [!!amount && (0, jsx_runtime_1.jsx)(Button_1.default.Text, { onClick: handleUnset, children: "Unset" }), (0, jsx_runtime_1.jsx)(Button_1.default.Primary, { sx: { flex: 1 }, onClick: handleContinue, status: !!amountError ? Button_1.BUTTON_STATUS.DISABLED : Button_1.BUTTON_STATUS.ENABLED, children: "Continue" })] })] }) }) })] }) }, ReceiveStep.SHOW_QR_CODE)] }, receiveTokens === null || receiveTokens === void 0 ? void 0 : receiveTokens.length) })) }) }));
 });
 exports.ReceiveFunction.displayName = "ReceiveFunction";
 exports.default = exports.ReceiveFunction;

package/dist/components/TekWallet/components/ui/SendExternalTokenWithdrawn/index.d.ts

@@ -0,0 +1,14 @@
+import { ConfirmLayoutProps } from "../ConfirmLayout";
+import { SendExternalBody, SendExternalResponse } from "../../../services/axios/send-external-service/type";
+import { NetworkData } from "../../../services/axios/type";
+export interface SendExternalDataType extends Omit<SendExternalBody, "network" | "passcode"> {
+    network: NetworkData;
+}
+export interface SendExternalTokenWithdrawnProps extends Omit<ConfirmLayoutProps, "action"> {
+    sendExternalData: SendExternalDataType;
+    onSuccess?: (data: SendExternalResponse) => any;
+    onStart?: () => void;
+    children: React.ReactNode;
+}
+declare const SendExternalTokenWithdrawn: ({ sendExternalData, onSuccess, onStart, children, }: SendExternalTokenWithdrawnProps) => import("react/jsx-runtime").JSX.Element;
+export default SendExternalTokenWithdrawn;

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

@@ -0,0 +1,133 @@
+"use strict";
+"use client";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g = Object.create((typeof Iterator === "function" ? Iterator : Object).prototype);
+    return g.next = verb(0), g["throw"] = verb(1), g["return"] = verb(2), typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (g && (g = 0, op[0] && (_ = 0)), _) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
+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 Button_1 = __importStar(require("../Button"));
+var ConfirmLayout_1 = __importDefault(require("../ConfirmLayout"));
+var ConfirmByPasscode_1 = __importDefault(require("../ConfirmByPasscode"));
+var react_1 = require("react");
+var RequireConnect_1 = __importDefault(require("../RequireConnect"));
+var send_external_service_1 = __importDefault(require("../../../services/axios/send-external-service"));
+var type_1 = require("../../../services/axios/get-activities-service/type");
+var transactionSlug = type_1.TransactionSlug.Withdrawn;
+var SendExternalTokenWithdrawn = function (_a) {
+    var sendExternalData = _a.sendExternalData, onSuccess = _a.onSuccess, onStart = _a.onStart, children = _a.children;
+    var _b = (0, react_1.useState)(Button_1.BUTTON_STATUS.ENABLED), buttonStatus = _b[0], setButtonStatus = _b[1];
+    var network = sendExternalData.network;
+    var handleSendExternalTokenWithdrawn = function (passcode) { return __awaiter(void 0, void 0, void 0, function () {
+        var response, err_1;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    _a.trys.push([0, 2, , 3]);
+                    onStart === null || onStart === void 0 ? void 0 : onStart();
+                    setButtonStatus(Button_1.BUTTON_STATUS.LOADING);
+                    return [4 /*yield*/, (0, send_external_service_1.default)(__assign(__assign({}, sendExternalData), { network: network.slug, passcode: passcode }))];
+                case 1:
+                    response = _a.sent();
+                    if (response.success) {
+                        setButtonStatus(Button_1.BUTTON_STATUS.ENABLED);
+                        onSuccess === null || onSuccess === void 0 ? void 0 : onSuccess(response);
+                    }
+                    else {
+                        throw new Error("Send external failed");
+                    }
+                    return [3 /*break*/, 3];
+                case 2:
+                    err_1 = _a.sent();
+                    console.error(err_1);
+                    setButtonStatus(Button_1.BUTTON_STATUS.ERROR);
+                    setTimeout(function () {
+                        setButtonStatus(Button_1.BUTTON_STATUS.ENABLED);
+                    }, 1200);
+                    return [3 /*break*/, 3];
+                case 3: return [2 /*return*/];
+            }
+        });
+    }); };
+    return ((0, jsx_runtime_1.jsxs)(RequireConnect_1.default, { children: [children, (0, jsx_runtime_1.jsx)(ConfirmLayout_1.default, { action: transactionSlug, children: (0, jsx_runtime_1.jsx)(ConfirmByPasscode_1.default, { action: transactionSlug, onConfirmSuccess: handleSendExternalTokenWithdrawn, children: (0, jsx_runtime_1.jsx)(Button_1.default.Primary, { status: buttonStatus, children: "Confirm" }) }) })] }));
+};
+exports.default = SendExternalTokenWithdrawn;

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

@@ -124,9 +124,10 @@ var TimeFilter = function (_a) {
                                     fontSize: theme.typography.fontSize11,
                                     borderRadius: theme.mixins.customRadius.r10,
                                     borderWidth: 1,
-                                    borderColor: (value === null || value === void 0 ? void 0 : value.type) === type ? theme.palette.border.accent : theme.palette.text.accent,
-                                    backgroundColor: (value === null || value === void 0 ? void 0 : value.type) === type ? theme.palette.background.white16 : "transparent",
-                                    color: (value === null || value === void 0 ? void 0 : value.type) === type ? theme.palette.text.primary : theme.palette.text.accent2,
+                                    borderColor: (value === null || value === void 0 ? void 0 : value.type) === type ? theme.palette.primary.main : theme.palette.border.accent3,
+                                    backgroundColor: (value === null || value === void 0 ? void 0 : value.type) === type ? theme.palette.secondary.main : "transparent",
+                                    color: (value === null || value === void 0 ? void 0 : value.type) === type ? theme.palette.primary.main : theme.palette.text.accent,
+                                    fontWeight: (value === null || value === void 0 ? void 0 : value.type) === type ? theme.typography.fontWeight600 : theme.typography.fontWeight500,
                                     transition: "background 0.2s, color 0.2s, border-color 0.2s",
                                     overflow: "hidden",
                                 } }), (value === null || value === void 0 ? void 0 : value.type) === type && ((0, jsx_runtime_1.jsx)(Icon_1.default, { src: (0, getIcon_1.default)("rectangle"), width: 22, height: 22, sx: {

package/dist/components/TekWallet/components/ui/TokenItem/index.d.ts

@@ -2,6 +2,7 @@ type TokenDataStringified = string;
 interface TokenItemProps {
     className?: string;
     tokenData: TokenDataStringified;
+    showSmallAssets?: boolean;
 }
 declare const TokenItem: (props: TokenItemProps) => import("react/jsx-runtime").JSX.Element;
 export default TokenItem;

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

@@ -21,18 +21,29 @@ var Text_1 = __importDefault(require("../Text"));
 var Formatter_1 = __importDefault(require("../Formatter"));
 var material_1 = require("@mui/material");
 var ThemeProvider_1 = require("../../../providers/ThemeProvider");
+var ContentHiddenProvider_1 = require("../../../providers/ContentHiddenProvider");
 var TokenItem = function (props) {
-    var _a;
     var theme = (0, ThemeProvider_1.useTheme)();
     var tokenData = (0, react_1.useMemo)(function () { return JSON.parse(props.tokenData); }, [props.tokenData]);
     var currency = (0, react_1.useMemo)(function () { return tokenData.currency; }, [tokenData]);
+    var isHidden = (0, ContentHiddenProvider_1.useContentHidden)().isHidden;
+    // const pnlValue = useMemo(() => Number(tokenData.pnl || 0), [tokenData.pnl]);
+    var shouldHideSmallAsset = props.showSmallAssets && currency.name === "USD";
     return ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: {
-            display: "grid",
+            display: !shouldHideSmallAsset ? "grid" : "none",
             gridTemplateColumns: "1.55fr 1fr 1fr",
             gap: theme.mixins.gaps.g12,
             py: theme.mixins.customPadding.p8,
         }, children: [(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)(Icon_1.default, { width: 20, sx: {
                             borderRadius: theme.mixins.customRadius.full,
-                        }, src: currency.link }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { flex: 1 }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.value), children: currency.name }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.valueDescription), children: currency.full_name })] })] }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g1, justifyContent: "center" }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.value), children: (0, jsx_runtime_1.jsx)(Formatter_1.default, { value: +((_a = tokenData.current_value) !== null && _a !== void 0 ? _a : 0) }) }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.valueDescription), children: (0, jsx_runtime_1.jsx)(Formatter_1.default, { value: 100 }) })] }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g1, textAlign: "right" }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.value), children: (0, jsx_runtime_1.jsx)(Formatter_1.default, { value: 70000 }) }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.valueDescription), children: (0, jsx_runtime_1.jsx)(Formatter_1.default, { value: 3.72 }) })] })] }));
+                        }, src: currency.link }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { flex: 1 }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.value), children: currency.name }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.valueDescription), children: currency.full_name })] })] }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g1, justifyContent: "center" }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.value), { fontWeight: theme.typography.fontWeight700 }), children: !isHidden ? (0, jsx_runtime_1.jsx)(Formatter_1.default, { value: tokenData.current_value }) : "***" }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.valueDescription), children: !isHidden ? (0, jsx_runtime_1.jsx)(Formatter_1.default, { value: 100 }) : "***" })] }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g1, textAlign: "right" }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.value), { color: theme.palette.text.alertStatus, fontWeight: theme.typography.fontWeight700 }), children: !isHidden ? ((0, jsx_runtime_1.jsx)(Formatter_1.default, { value: 70000 })) : ((0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
+                                fontSize: theme.typography.fontSize14,
+                                fontWeight: theme.typography.fontWeight600,
+                                color: theme.palette.text.black,
+                            }, children: "***" })) }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.valueDescription), { color: theme.palette.text.alertStatus }), children: !isHidden ? ((0, jsx_runtime_1.jsx)(Formatter_1.default, { value: 3.72 })) : ((0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
+                                fontSize: theme.typography.fontSize12,
+                                fontWeight: theme.typography.fontWeight600,
+                                color: theme.palette.text.accent2,
+                            }, children: "***" })) })] })] }));
 };
 exports.default = TokenItem;

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

@@ -45,8 +45,8 @@ var TokenSelection = function (props) {
         var _a;
         return balance * +((_a = tokenData === null || tokenData === void 0 ? void 0 : tokenData.usd_rate) !== null && _a !== void 0 ? _a : 0);
     }, [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 ? "background.secondary16" : "background.white16", border: "1px solid", borderColor: active ? "border.secondary" : "transparent", borderRadius: theme.mixins.customRadius.r16, padding: theme.mixins.customPadding.p12, 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: {
+    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.p12, 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({}, theme.mixins.column), 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: theme.mixins.valueDescription, children: (0, jsx_runtime_1.jsx)(Formatter_1.default, { value: balanceInUSD, start: "~ $" }) })] })] })));
+                        } }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign({}, theme.mixins.column), 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: "~ $" }) })] })] })));
 };
 exports.default = TokenSelection;

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

@@ -22,9 +22,14 @@ var TokenItem_1 = __importDefault(require("../TokenItem"));
 var material_1 = require("@mui/material");
 var ThemeProvider_1 = require("../../../providers/ThemeProvider");
 var WaitingData_1 = __importDefault(require("../WaitingData"));
+var react_1 = require("react");
 var TokensBoard = function () {
     var tokens = (0, useWalletData_1.default)().tokens;
     var theme = (0, ThemeProvider_1.useTheme)();
+    var _a = (0, react_1.useState)(false), showSmallAssets = _a[0], setShowSmallAssets = _a[1];
+    var toggleDisplay = function () {
+        setShowSmallAssets(!showSmallAssets);
+    };
     return ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: {
         // ...theme.mixins.paper,
         // backgroundColor: "background.white",
@@ -42,10 +47,10 @@ var TokensBoard = function () {
                                     width: "1.5rem",
                                     height: "1.5rem",
                                     "& .MuiSvgIcon-root": {
-                                        color: theme.palette.text.primary,
+                                        color: theme.palette.text.accent,
                                     },
-                                } })] })] }), (0, jsx_runtime_1.jsx)(material_1.Divider, { sx: {
-                    borderColor: theme.palette.border.accent,
+                                }, onClick: toggleDisplay })] })] }), (0, jsx_runtime_1.jsx)(material_1.Divider, { sx: {
+                    borderColor: theme.palette.border.accent3,
                 } }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g12, mt: theme.mixins.customMargin.m8, pt: theme.mixins.customPadding.p8, minHeight: !tokens ? "20rem" : "unset" }), children: [!!tokens && ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: {
                             display: "grid",
                             gridTemplateColumns: "1.55fr 1fr 1fr",
@@ -70,11 +75,11 @@ var TokensBoard = function () {
                                     color: theme.palette.text.accent2,
                                 }, children: "PnL" })] })), tokens === null || tokens === void 0 ? void 0 : tokens.map(function (item) {
                         var stringifiedTokenData = JSON.stringify(__assign({}, item));
-                        return (0, jsx_runtime_1.jsx)(TokenItem_1.default, { tokenData: stringifiedTokenData }, item.id);
+                        return (0, jsx_runtime_1.jsx)(TokenItem_1.default, { showSmallAssets: showSmallAssets, tokenData: stringifiedTokenData }, item.id);
                     }), !tokens && (0, jsx_runtime_1.jsx)(WaitingData_1.default, { sx: { margin: "auto" } })] }), (0, jsx_runtime_1.jsx)(material_1.Divider, { sx: {
                     borderColor: theme.palette.border.accent,
                 } }), !!tokens && ((0, jsx_runtime_1.jsx)(material_1.Box, { sx: {
                     paddingTop: theme.mixins.customPadding.p16,
-                }, children: (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({ fontSize: theme.typography.fontSize16, color: theme.palette.text.primary, fontWeight: theme.typography.fontWeight600, lineHeight: theme.typography.leading140, width: "fit-content", textDecoration: "underline", textUnderlineOffset: ".3rem", textDecorationThickness: ".1rem", px: theme.mixins.customPadding.p5, cursor: "pointer", mx: "auto" }, theme.mixins.row), children: "View all assets" }) }))] }));
+                }, children: (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({ fontSize: theme.typography.fontSize14, color: theme.palette.primary.main, fontWeight: theme.typography.fontWeight600, lineHeight: theme.typography.leading140, width: "fit-content", textDecoration: "underline", textUnderlineOffset: ".3rem", textDecorationThickness: ".1rem", px: theme.mixins.customPadding.p5, cursor: "pointer", mx: "auto" }, theme.mixins.row), children: "View all assets" }) }))] }));
 };
 exports.default = TokensBoard;

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

@@ -120,6 +120,7 @@ var SendExternalToken_1 = __importDefault(require("../SendExternalToken"));
 var SendInternalToken_1 = __importDefault(require("../SendInternalToken"));
 var createDebounce_1 = __importDefault(require("../../../utils/createDebounce"));
 var type_2 = require("../../../services/axios/validate-wallet-address-service/type");
+var providers_1 = require("../../../providers");
 var SendMethods;
 (function (SendMethods) {
     SendMethods["SCAN_QR_CODE"] = "scan qr code";
@@ -153,7 +154,7 @@ var WithdrawFunction = (0, react_1.forwardRef)(function (props, ref) {
     var _a;
     var drawerRef = (0, react_1.useRef)(null);
     var swiperRef = (0, react_1.useRef)(null);
-    var theme = (0, material_1.useTheme)();
+    var theme = (0, providers_1.useTheme)();
     var _b = (0, react_1.useState)(WithdrawStep.SELECT_METHOD), currentStep = _b[0], setCurrentStep = _b[1];
     var _c = (0, react_1.useState)(), selectedToken = _c[0], setSelectedToken = _c[1];
     var _d = (0, react_1.useState)(), selectedNetwork = _d[0], setSelectedNetwork = _d[1];

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

@@ -40,44 +40,24 @@ var AssetView = function (props) {
                             my: theme.mixins.customMargin.m20,
                             paddingTop: theme.mixins.customPadding.p16,
                             paddingBottom: theme.mixins.customPadding.p8,
-                            backgroundColor: theme.palette.text.secondary,
+                            backgroundColor: theme.palette.background.tertiary,
                             borderRadius: theme.mixins.customRadius.r16,
                             "& .MuiListItem-root, & .MuiListItem-root *": {
                                 color: theme.palette.text.primary,
                                 fontWeight: theme.typography.fontWeight600,
                             },
                         }, children: [(0, jsx_runtime_1.jsx)(ReceiveFunction_1.default, { children: (0, jsx_runtime_1.jsx)(material_1.ListItem, { sx: {
-                                        borderRight: "1px solid ".concat(theme.palette.border.accent),
+                                        borderRight: "1px solid ".concat(theme.palette.border.accent3),
                                         placeContent: "center",
                                         columnSpan: 1,
                                     }, children: (0, jsx_runtime_1.jsx)(FunctionItem_1.default, { icon: (0, getIcon_1.default)("receive"), label: "Receive", sx: {
                                             width: "100%",
                                         } }) }) }), (0, jsx_runtime_1.jsx)(WithdrawFunction_1.default, { children: (0, jsx_runtime_1.jsx)(material_1.ListItem, { sx: {
-                                        borderRight: "1px solid ".concat(theme.palette.border.accent),
+                                        borderRight: "1px solid ".concat(theme.palette.border.accent3),
                                         placeContent: "center",
                                         columnSpan: 1,
                                     }, children: (0, jsx_runtime_1.jsx)(FunctionItem_1.default, { icon: (0, getIcon_1.default)("withdraw"), label: "Withdraw", sx: { width: "100%" } }) }) }), (0, jsx_runtime_1.jsx)(material_1.ListItem, { sx: {
-                                    borderRight: "1px solid ".concat(theme.palette.border.accent),
-                                    placeContent: "center",
-                                    columnSpan: 1,
-                                }, children: (0, jsx_runtime_1.jsx)(FunctionItem_1.default, { icon: (0, getIcon_1.default)("fortune", "gif"), label: "Fortune", sx: { width: "100%" } }) }), (0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(FunctionItem_1.default, { icon: (0, getIcon_1.default)("p2p", "gif"), label: "P2P", sx: { width: "100%" } }) }), (0, jsx_runtime_1.jsx)(material_1.Divider, { orientation: "horizontal", sx: {
-                                    gridColumn: "1 / -1",
-                                    width: "95%",
-                                    borderWidth: "1px",
-                                    borderColor: theme.palette.border.accent,
-                                    opacity: 0.75,
-                                    my: theme.mixins.customMargin.m12,
-                                    margin: "0 auto",
-                                } }), (0, jsx_runtime_1.jsx)(ReceiveFunction_1.default, { children: (0, jsx_runtime_1.jsx)(material_1.ListItem, { sx: {
-                                        borderRight: "1px solid ".concat(theme.palette.border.accent),
-                                        placeContent: "center",
-                                        columnSpan: 1,
-                                    }, children: (0, jsx_runtime_1.jsx)(FunctionItem_1.default, { icon: (0, getIcon_1.default)("receive"), label: "Receive", sx: { width: "100%" } }) }) }), (0, jsx_runtime_1.jsx)(WithdrawFunction_1.default, { children: (0, jsx_runtime_1.jsx)(material_1.ListItem, { sx: {
-                                        borderRight: "1px solid ".concat(theme.palette.border.accent),
-                                        placeContent: "center",
-                                        columnSpan: 1,
-                                    }, children: (0, jsx_runtime_1.jsx)(FunctionItem_1.default, { icon: (0, getIcon_1.default)("withdraw"), label: "Withdraw", sx: { width: "100%" } }) }) }), (0, jsx_runtime_1.jsx)(material_1.ListItem, { sx: {
-                                    borderRight: "1px solid ".concat(theme.palette.border.accent),
+                                    borderRight: "1px solid ".concat(theme.palette.border.accent3),
                                     placeContent: "center",
                                     columnSpan: 1,
                                 }, children: (0, jsx_runtime_1.jsx)(FunctionItem_1.default, { icon: (0, getIcon_1.default)("fortune", "gif"), label: "Fortune", sx: { width: "100%" } }) }), (0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(FunctionItem_1.default, { icon: (0, getIcon_1.default)("p2p", "gif"), label: "P2P", sx: { width: "100%" } }) })] }), (0, jsx_runtime_1.jsx)(TokensBoard_1.default, {})] })))] }));

package/dist/components/TekWallet/index.d.ts

@@ -19,3 +19,4 @@ export type * from "./services/axios/validate-wallet-address-service/type";
 export * from "./components/index";
 export * from "./providers/TekWalletProvider";
 export * from "./components/ui/UpdateLockToken";
+export * from "./components/ui/SendExternalTokenWithdrawn";

package/dist/components/TekWallet/index.js

@@ -34,3 +34,4 @@ __exportStar(require("./services/axios/validate-wallet-address-service"), export
 __exportStar(require("./components/index"), exports);
 __exportStar(require("./providers/TekWalletProvider"), exports);
 __exportStar(require("./components/ui/UpdateLockToken"), exports);
+__exportStar(require("./components/ui/SendExternalTokenWithdrawn"), exports);

package/dist/components/TekWallet/providers/ContentHiddenProvider/index.d.ts

@@ -0,0 +1,10 @@
+interface ContentHiddenContextType {
+    isHidden: boolean;
+    setIsHidden: (isHidden: boolean) => void;
+}
+export declare function useContentHidden(): ContentHiddenContextType;
+interface ContentHiddenProviderProps {
+    children: React.ReactNode;
+}
+export default function ContentHiddenProvider({ children }: ContentHiddenProviderProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/TekWallet/providers/ContentHiddenProvider/index.js

@@ -0,0 +1,22 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useContentHidden = useContentHidden;
+exports.default = ContentHiddenProvider;
+var jsx_runtime_1 = require("react/jsx-runtime");
+var react_1 = require("react");
+var ContentHiddenContext = (0, react_1.createContext)({
+    isHidden: false,
+    setIsHidden: function () { },
+});
+function useContentHidden() {
+    var context = (0, react_1.useContext)(ContentHiddenContext);
+    if (!context) {
+        throw new Error("useContentHidden must be used within a ContentHiddenProvider");
+    }
+    return context;
+}
+function ContentHiddenProvider(_a) {
+    var children = _a.children;
+    var _b = (0, react_1.useState)(false), isHidden = _b[0], setIsHidden = _b[1];
+    return (0, jsx_runtime_1.jsx)(ContentHiddenContext.Provider, { value: { isHidden: isHidden, setIsHidden: setIsHidden }, children: children });
+}

package/dist/components/TekWallet/providers/TekWalletProvider/index.js

@@ -18,6 +18,7 @@ var SwapProvider_1 = __importDefault(require("../SwapProvider"));
 var WalletDataProviderNoImport_1 = __importDefault(require("../WalletDataProviderNoImport"));
 var WalletDataProvider_1 = __importDefault(require("../WalletDataProvider"));
 var ThemeProvider_1 = require("../ThemeProvider");
+var ContentHiddenProvider_1 = __importDefault(require("../ContentHiddenProvider"));
 var initialTekWalletContext = {
     isSSO: undefined,
 };
@@ -29,6 +30,6 @@ function TekWalletProvider(_a) {
     var onDisconnect = function () {
         setResetTrigger(function (prev) { return prev + "1"; });
     };
-    return ((0, jsx_runtime_1.jsx)(exports.TekWalletContext.Provider, { value: { isSSO: isSSO }, children: (0, jsx_runtime_1.jsx)(WalletProvider, { accessToken: accessToken !== null && accessToken !== void 0 ? accessToken : "", onDisconnect: onDisconnect, children: (0, jsx_runtime_1.jsx)(ThemeProvider_1.CustomThemeProvider, { children: (0, jsx_runtime_1.jsx)(RealtimeProvider_1.default, { children: (0, jsx_runtime_1.jsx)(ActivitiesProvider_1.default, { children: (0, jsx_runtime_1.jsx)(ReceiveProvider_1.default, { children: (0, jsx_runtime_1.jsx)(LockTokenProvider_1.default, { children: (0, jsx_runtime_1.jsx)(WithdrawProvider_1.default, { children: (0, jsx_runtime_1.jsx)(SwapProvider_1.default, { children: (0, jsx_runtime_1.jsx)(EventHandlerProvider_1.default, { options: options, children: children }) }) }) }) }) }) }) }) }, resetTrigger) }));
+    return ((0, jsx_runtime_1.jsx)(ContentHiddenProvider_1.default, { children: (0, jsx_runtime_1.jsx)(exports.TekWalletContext.Provider, { value: { isSSO: isSSO }, children: (0, jsx_runtime_1.jsx)(WalletProvider, { accessToken: accessToken !== null && accessToken !== void 0 ? accessToken : "", onDisconnect: onDisconnect, children: (0, jsx_runtime_1.jsx)(ThemeProvider_1.CustomThemeProvider, { children: (0, jsx_runtime_1.jsx)(RealtimeProvider_1.default, { children: (0, jsx_runtime_1.jsx)(ActivitiesProvider_1.default, { children: (0, jsx_runtime_1.jsx)(ReceiveProvider_1.default, { children: (0, jsx_runtime_1.jsx)(LockTokenProvider_1.default, { children: (0, jsx_runtime_1.jsx)(WithdrawProvider_1.default, { children: (0, jsx_runtime_1.jsx)(SwapProvider_1.default, { children: (0, jsx_runtime_1.jsx)(EventHandlerProvider_1.default, { options: options, children: children }) }) }) }) }) }) }) }) }, resetTrigger) }) }));
 }
 exports.default = TekWalletProvider;

package/dist/components/TekWallet/services/axios/validate-wallet-address-service/index.js

@@ -48,6 +48,12 @@ var validateWalletAddressService = function (body) { return __awaiter(void 0, vo
         switch (_b.label) {
             case 0:
                 _b.trys.push([0, 2, , 3]);
+                if (!body.address || !body.network) {
+                    return [2 /*return*/, {
+                            message: type_1.ValidateWalletAddressResultMessage.ERROR,
+                            data: undefined,
+                        }];
+                }
                 return [4 /*yield*/, userClientRequest_1.default.get("/crypto/validate-address/".concat(body.network, "?address=").concat(body.address))];
             case 1:
                 response = _b.sent();

package/dist/components/TekWallet/theme/mui/theme.d.ts

@@ -24,6 +24,8 @@ declare const theme: {
             secondary16: string;
             error: string;
             error16: string;
+            tertiary: string;
+            accent3: string;
         };
         border: {
             white: string;
@@ -37,6 +39,7 @@ declare const theme: {
             secondary: string;
             secondary16: string;
             accent: string;
+            accent3: string;
         };
         text: {
             white: string;
@@ -58,6 +61,7 @@ declare const theme: {
             increase: string;
             decrease: string;
             warningStatus: string;
+            alertStatus: string;
         };
         divider: string;
     };

package/dist/components/TekWallet/theme/mui/theme.js

@@ -43,6 +43,8 @@ var background = {
     secondary16: "#C5E99F29",
     error: "#FE6565",
     error16: "rgba(254, 101, 101, 0.16)",
+    tertiary: "#ECF4E9",
+    accent3: "#E5E6E6",
 };
 var border = {
     white: "#ffffff",
@@ -56,6 +58,7 @@ var border = {
     secondary: "#01FFFF",
     secondary16: "rgba(1, 255, 255, 0.16)",
     accent: "#A3A3A3",
+    accent3: "#E5E6E6",
 };
 var text = {
     white: "#ffffff",
@@ -77,6 +80,7 @@ var text = {
     increase: "#01FF00",
     decrease: "#FE6565",
     warningStatus: "#FFA500",
+    alertStatus: "#1EA031",
 };
 var gaps = {
     g2: "0.125rem",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "tek-wallet",
-  "version": "0.0.628",
+  "version": "0.0.630",
   "description": "A custom React provider with TypeScript support",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",