tek-wallet 0.0.665 → 0.0.667

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

@@ -1,7 +1,6 @@
 import { GeneralProps } from "../../../types/ui";
 export interface ChangePasscodeProps extends GeneralProps {
     children: React.ReactNode;
-    isInitPasscode?: boolean;
 }
-export declare function ChangePasscode({ children, isInitPasscode, ...rest }: ChangePasscodeProps): import("react/jsx-runtime").JSX.Element;
+export declare function ChangePasscode({ children, ...rest }: ChangePasscodeProps): import("react/jsx-runtime").JSX.Element;
 export default ChangePasscode;

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

@@ -68,7 +68,7 @@ var material_1 = require("@mui/material");
 var ChangePasscodeView_1 = __importDefault(require("../../views/ChangePasscodeView"));
 var xhub_keyboard_1 = require("xhub-keyboard");
 function ChangePasscode(_a) {
-    var children = _a.children, isInitPasscode = _a.isInitPasscode, rest = __rest(_a, ["children", "isInitPasscode"]);
+    var children = _a.children, rest = __rest(_a, ["children"]);
     var getSeedPhraseViewRef = (0, react_1.useRef)(null);
     var backAuthView = function () {
         var _a;
@@ -80,6 +80,6 @@ function ChangePasscode(_a) {
             setResetTrigger(function (prev) { return prev + "1"; });
         }, 400);
     };
-    return ((0, jsx_runtime_1.jsx)(RequireConnect_1.default, { children: (0, jsx_runtime_1.jsx)(DrawerComponent_1.default, { onClose: onClose, ref: getSeedPhraseViewRef, direction: DrawerComponent_1.DRAWER_DIRECTION.RIGHT, trigger: (0, jsx_runtime_1.jsx)(xhub_keyboard_1.Label, { autoFocus: true, useBrowserInput: false, htmlFor: "change-passcode-keyboard", children: (0, jsx_runtime_1.jsxs)(material_1.Box, __assign({}, rest, { sx: { position: "relative" }, children: [children, (0, jsx_runtime_1.jsx)(material_1.Box, { sx: { position: "absolute", inset: 0, zIndex: 10 } })] })) }), children: (0, jsx_runtime_1.jsx)(ChangePasscodeView_1.default, { onBack: backAuthView, isInitPasscode: isInitPasscode }, resetTrigger) }) }));
+    return ((0, jsx_runtime_1.jsx)(RequireConnect_1.default, { children: (0, jsx_runtime_1.jsx)(DrawerComponent_1.default, { onClose: onClose, ref: getSeedPhraseViewRef, direction: DrawerComponent_1.DRAWER_DIRECTION.RIGHT, trigger: (0, jsx_runtime_1.jsx)(xhub_keyboard_1.Label, { autoFocus: true, useBrowserInput: false, htmlFor: "change-passcode-keyboard", children: (0, jsx_runtime_1.jsxs)(material_1.Box, __assign({}, rest, { sx: { position: "relative" }, children: [children, (0, jsx_runtime_1.jsx)(material_1.Box, { sx: { position: "absolute", inset: 0, zIndex: 10 } })] })) }), children: (0, jsx_runtime_1.jsx)(ChangePasscodeView_1.default, { onBack: backAuthView }, resetTrigger) }) }));
 }
 exports.default = ChangePasscode;

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

@@ -198,7 +198,7 @@ var ConfirmByPasscode = (0, react_1.forwardRef)(function (props, ref) {
             width: "100%",
             maxWidth: "calc(100dvw - 2rem)",
             display: "flex",
-        }, children: (0, jsx_runtime_1.jsx)(xhub_keyboard_1.Keyboard, { id: "confirm-passcode-keyboard", keyboardType: xhub_keyboard_1.KeyboardType.Integer, value: otp, onChange: handleOtpChange, children: (0, jsx_runtime_1.jsx)(LoadingLayout_1.default, { initLoading: false, ref: loadingRef, sx: {
+        }, children: (0, jsx_runtime_1.jsx)(xhub_keyboard_1.Keyboard, { id: "confirm-passcode-keyboard", value: otp, onChange: handleOtpChange, keyboardType: xhub_keyboard_1.KeyboardType.Text, layoutType: xhub_keyboard_1.LayoutType.Integer, children: (0, jsx_runtime_1.jsx)(LoadingLayout_1.default, { initLoading: false, ref: loadingRef, sx: {
                     backgroundColor: "transparent",
                     width: "100%",
                 }, children: (0, jsx_runtime_1.jsx)(ModalLayout_1.default, { title: "Enter Passcode", onClose: handleClose, sx: {

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

@@ -54,9 +54,8 @@ var jsx_runtime_1 = require("react/jsx-runtime");
 var react_1 = require("react");
 var material_1 = require("@mui/material");
 var ThemeProvider_1 = require("../../../providers/ThemeProvider");
-var Icon_1 = __importDefault(require("../Icon"));
-var getIcon_1 = __importDefault(require("../../../utils/getIcon"));
 var Text_1 = __importDefault(require("../Text"));
+var SvgPath_1 = require("../SvgPath");
 var CopyTextComponent = function (_a) {
     var value = _a.value, iconSuccess = _a.iconSuccess, children = _a.children, hideTextMessage = _a.hideTextMessage, sx = _a.sx;
     var theme = (0, ThemeProvider_1.useTheme)();
@@ -76,7 +75,7 @@ var CopyTextComponent = function (_a) {
                     setShowSuccess(true);
                     setTimeout(function () {
                         setShowSuccess(false);
-                    }, 800);
+                    }, 1000);
                     return [3 /*break*/, 3];
                 case 2:
                     err_1 = _a.sent();
@@ -99,13 +98,12 @@ var CopyTextComponent = function (_a) {
                     transformOrigin: "center bottom",
                     backgroundColor: theme.palette.background.black,
                     backdropFilter: "blur(12px)",
-                    borderRadius: theme.mixins.customRadius.r12,
+                    borderRadius: 9999,
                     padding: "".concat(theme.mixins.customPadding.p8, " ").concat(theme.mixins.customPadding.p12),
-                    transition: "opacity 0.3s ease-in-out, transform 0.3s ease-in-out",
-                }, children: [iconSuccess || ((0, jsx_runtime_1.jsx)(Icon_1.default, { src: (0, getIcon_1.default)("copied_check"), sx: {
-                            width: "1rem",
-                            height: "1rem",
-                        } })), !hideTextMessage && ((0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
+                    transition: showSuccess
+                        ? "opacity 0.5s linear, transform 0.17s linear"
+                        : "opacity 0.15s linear, transform 0.1s linear",
+                }, children: [iconSuccess || (0, jsx_runtime_1.jsx)(material_1.SvgIcon, { sx: { width: "1rem", height: "1rem" }, children: SvgPath_1.IC_SUCCESS }), !hideTextMessage && ((0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
                             color: theme.palette.text.successStatus,
                             fontSize: theme.typography.fontSize14,
                             lineHeight: theme.typography.leading100,

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

@@ -5,7 +5,6 @@ export interface IconProps extends React.ImgHTMLAttributes<HTMLImageElement> {
     width?: number;
     height?: number;
     sx?: SxProps;
-    isRounded?: boolean;
 }
 declare const Icon: (props: IconProps) => import("react/jsx-runtime").JSX.Element;
 export default Icon;

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

@@ -26,7 +26,7 @@ var jsx_runtime_1 = require("react/jsx-runtime");
 var material_1 = require("@mui/material");
 var Icon = function (props) {
     var _a, _b;
-    var src = props.src, alt = props.alt, onClick = props.onClick, width = props.width, height = props.height, sx = props.sx, isRounded = props.isRounded, rest = __rest(props, ["src", "alt", "onClick", "width", "height", "sx", "isRounded"]);
-    return ((0, jsx_runtime_1.jsx)(material_1.Box, __assign({ component: "img", src: src, alt: alt, onClick: onClick }, rest, { sx: __assign({ display: "block", width: ((_a = width !== null && width !== void 0 ? width : height) !== null && _a !== void 0 ? _a : false) ? "".concat((width || height || 0) / 16, "rem") : "auto", height: ((_b = height !== null && height !== void 0 ? height : width) !== null && _b !== void 0 ? _b : false) ? "".concat((height || width || 0) / 16, "rem") : "auto", borderRadius: isRounded ? "100%" : null }, sx) })));
+    var src = props.src, alt = props.alt, onClick = props.onClick, width = props.width, height = props.height, sx = props.sx, rest = __rest(props, ["src", "alt", "onClick", "width", "height", "sx"]);
+    return ((0, jsx_runtime_1.jsx)(material_1.Box, __assign({ component: "img", src: src, alt: alt, onClick: onClick }, rest, { sx: __assign({ display: "block", width: ((_a = width !== null && width !== void 0 ? width : height) !== null && _a !== void 0 ? _a : false) ? "".concat((width || height || 0) / 16, "rem") : "auto", height: ((_b = height !== null && height !== void 0 ? height : width) !== null && _b !== void 0 ? _b : false) ? "".concat((height || width || 0) / 16, "rem") : "auto" }, sx) })));
 };
 exports.default = Icon;

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

@@ -0,0 +1,6 @@
+import { GeneralProps } from "../../../types/ui";
+export interface InitPasscodeProps extends GeneralProps {
+    children: React.ReactNode;
+}
+export declare function InitPasscode({ children, ...rest }: InitPasscodeProps): import("react/jsx-runtime").JSX.Element;
+export default InitPasscode;

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

@@ -0,0 +1,84 @@
+"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 __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.InitPasscode = InitPasscode;
+var jsx_runtime_1 = require("react/jsx-runtime");
+var DrawerComponent_1 = __importStar(require("../DrawerComponent"));
+var react_1 = require("react");
+var material_1 = require("@mui/material");
+var ChangePasscodeView_1 = __importDefault(require("../../views/ChangePasscodeView"));
+var xhub_keyboard_1 = require("xhub-keyboard");
+function InitPasscode(_a) {
+    var children = _a.children, rest = __rest(_a, ["children"]);
+    var getSeedPhraseViewRef = (0, react_1.useRef)(null);
+    var backAuthView = function () {
+        var _a;
+        (_a = getSeedPhraseViewRef.current) === null || _a === void 0 ? void 0 : _a.close();
+    };
+    var _b = (0, react_1.useState)("1"), resetTrigger = _b[0], setResetTrigger = _b[1];
+    var onClose = function () {
+        setTimeout(function () {
+            setResetTrigger(function (prev) { return prev + "1"; });
+        }, 400);
+    };
+    return ((0, jsx_runtime_1.jsx)(DrawerComponent_1.default, { onClose: onClose, ref: getSeedPhraseViewRef, direction: DrawerComponent_1.DRAWER_DIRECTION.RIGHT, trigger: (0, jsx_runtime_1.jsx)(xhub_keyboard_1.Label, { autoFocus: true, useBrowserInput: false, htmlFor: "init-passcode-keyboard", children: (0, jsx_runtime_1.jsxs)(material_1.Box, __assign({}, rest, { sx: { position: "relative" }, children: [children, (0, jsx_runtime_1.jsx)(material_1.Box, { sx: { position: "absolute", inset: 0, zIndex: 10 } })] })) }), children: (0, jsx_runtime_1.jsx)(ChangePasscodeView_1.default, { onBack: backAuthView, isInitPasscode: true }, resetTrigger) }));
+}
+exports.default = InitPasscode;

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

@@ -3,7 +3,7 @@ import { ReactEventHandler } from "react";
 export interface ListItemCustomProps extends Omit<ListItemButtonProps, "title"> {
     title: React.ReactNode;
     description: React.ReactNode;
-    icon: string;
+    icon: React.ReactNode;
     onClick?: ReactEventHandler;
     disabled?: boolean;
     rightIcon?: React.ReactNode | boolean;

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

@@ -28,12 +28,13 @@ Object.defineProperty(exports, "__esModule", { value: true });
 var jsx_runtime_1 = require("react/jsx-runtime");
 var material_1 = require("@mui/material");
 var ThemeProvider_1 = require("../../../providers/ThemeProvider");
-var Icon_1 = __importDefault(require("../Icon"));
-var getIcon_1 = __importDefault(require("../../../utils/getIcon"));
 var Text_1 = __importDefault(require("../Text"));
+var SvgPath_1 = require("../SvgPath");
 function ListItemCustom(_a) {
     var title = _a.title, description = _a.description, icon = _a.icon, rightIcon = _a.rightIcon, hideDefaultRightIcon = _a.hideDefaultRightIcon, sx = _a.sx, rest = __rest(_a, ["title", "description", "icon", "rightIcon", "hideDefaultRightIcon", "sx"]);
     var theme = (0, ThemeProvider_1.useTheme)();
-    return ((0, jsx_runtime_1.jsxs)(material_1.ListItemButton, __assign({}, rest, { sx: __assign(__assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g12, padding: 0 }), sx), children: [(0, jsx_runtime_1.jsx)(Icon_1.default, { width: 32, src: icon }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g2, alignItems: "start", flex: 1 }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.listTitle), children: title }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.listDescription), children: description })] }), rightIcon !== null && rightIcon !== void 0 ? rightIcon : (!hideDefaultRightIcon && (0, jsx_runtime_1.jsx)(Icon_1.default, { width: 10, src: (0, getIcon_1.default)("right_arrow"), sx: { ml: "auto" } }))] })));
+    return ((0, jsx_runtime_1.jsxs)(material_1.ListItemButton, __assign({}, rest, { sx: __assign(__assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g12, padding: theme.mixins.customPadding.p16, border: "1px solid ".concat(theme.palette.border.accent3), borderRadius: theme.mixins.customRadius.r12, backgroundColor: theme.palette.background.white }), sx), children: [icon, (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g4, alignItems: "start", flex: 1 }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.listTitle), children: title }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.listDescription), children: description })] }), rightIcon !== null && rightIcon !== void 0 ? rightIcon : (!hideDefaultRightIcon && (
+            // <Icon width={10} src={getIcon("right_arrow")} sx={{ ml: "auto" }} />
+            (0, jsx_runtime_1.jsx)(material_1.SvgIcon, { sx: { width: "12px", height: "12px" }, children: SvgPath_1.IC_CHEVRON_RIGHT })))] })));
 }
 exports.default = ListItemCustom;

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

@@ -7,7 +7,6 @@ interface ModalLayoutProps extends GeneralProps {
     overrideHeader?: ReactNode;
     backgroundColor?: string;
     fullScreen?: boolean;
-    overrideBorderRadius?: string;
 }
 declare const ModalLayout: (props: ModalLayoutProps) => import("react/jsx-runtime").JSX.Element;
 export default ModalLayout;

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

@@ -21,7 +21,7 @@ var material_1 = require("@mui/material");
 var ThemeProvider_1 = require("../../../providers/ThemeProvider");
 var ModalLayout = function (props) {
     var theme = (0, ThemeProvider_1.useTheme)();
-    return ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({ borderRadius: props.overrideBorderRadius || "1.5rem 1.5rem 0 0", maxHeight: "100dvh", backgroundColor: props.backgroundColor || theme.palette.background.white, display: "flex", flexDirection: "column", height: props.fullScreen ? "100dvh" : "fit-content" }, theme.mixins.pagePadding), props.sx), children: [!props.hideHeader && !props.overrideHeader && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(material_1.Box, { sx: {
+    return ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({ borderRadius: "1.5rem 1.5rem 0 0", maxHeight: "100dvh", backgroundColor: theme.palette.background.tertiary, display: "flex", flexDirection: "column", height: "fit-content" }, theme.mixins.pagePadding), props.sx), children: [!props.hideHeader && !props.overrideHeader && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(material_1.Box, { sx: {
                             width: "100%",
                             position: "relative",
                         }, children: [(0, jsx_runtime_1.jsx)(ModalTitle_1.default, { children: props.title }), (0, jsx_runtime_1.jsx)(CloseModal_1.default, { sx: {

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

@@ -37,6 +37,6 @@ 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 ? "".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") }) })] })));
+    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: theme.mixins.customPadding.p16, 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.link, sx: { borderRadius: theme.mixins.customRadius.full }, width: 24 }), (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: __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/QRCode/index.js

@@ -4,16 +4,15 @@ var jsx_runtime_1 = require("react/jsx-runtime");
 var qrcode_react_1 = require("qrcode.react");
 function QRCode(props) {
     var value = props.value, _a = props.size, size = _a === void 0 ? 156 : _a, logo = props.logo, title = props.title, _b = props.bgColor, bgColor = _b === void 0 ? "#ffffff" : _b;
-    return ((0, jsx_runtime_1.jsx)(qrcode_react_1.QRCodeCanvas, { value: value, title: title, size: size, bgColor: bgColor, fgColor: "#1E4841", 
-        // level={"H"}
-        minVersion: 8, marginSize: 4, imageSettings: {
+    return ((0, jsx_runtime_1.jsx)(qrcode_react_1.QRCodeCanvas, { value: value, title: title, size: size, bgColor: bgColor, fgColor: "#1E4841", level: "L", minVersion: 8, marginSize: 4, imageSettings: {
             src: logo || "",
             x: undefined,
             y: undefined,
             height: 24,
             width: 24,
             opacity: 1,
-            excavate: true,
+            excavate: false,
+            crossOrigin: "anonymous",
         } }));
 }
 exports.default = QRCode;

package/dist/components/TekWallet/components/ui/ReceiveFunction/components/sortByBalance.d.ts

@@ -3,8 +3,9 @@ export declare enum SortBalance {
     DESC = "desc"
 }
 interface SortByBalanceProps {
-    sortBalance: SortBalance;
-    setSortBalance: (sortBalance: SortBalance) => void;
+    sortBalance?: SortBalance;
+    setSortBalance?: (sortBalance: SortBalance) => void;
+    name: string;
 }
 export default function SortByBalance(props: SortByBalanceProps): import("react/jsx-runtime").JSX.Element;
 export type { SortByBalanceProps };

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

@@ -27,16 +27,16 @@ var SortBalance;
     SortBalance["DESC"] = "desc";
 })(SortBalance || (exports.SortBalance = SortBalance = {}));
 function SortByBalance(props) {
-    var sortBalance = props.sortBalance, setSortBalance = props.setSortBalance;
+    var sortBalance = props.sortBalance, setSortBalance = props.setSortBalance, name = props.name;
     var theme = (0, ThemeProvider_1.useTheme)();
     return ((0, jsx_runtime_1.jsxs)(material_1.Stack, { direction: "row", alignItems: "center", gap: 0.5, onClick: function () {
-            if (sortBalance === SortBalance.ASC) {
+            if (sortBalance === SortBalance.ASC && setSortBalance) {
                 setSortBalance(SortBalance.DESC);
             }
-            else {
+            else if (sortBalance === SortBalance.DESC && setSortBalance) {
                 setSortBalance(SortBalance.ASC);
             }
-        }, 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)(material_1.SvgIcon, { inheritViewBox: true, sx: {
+        }, 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: name }), (0, jsx_runtime_1.jsxs)(material_1.Box, { className: "flex flex-col gap-[0.8px]", children: [(0, jsx_runtime_1.jsx)(material_1.SvgIcon, { inheritViewBox: true, sx: {
                             width: 8,
                             height: 5,
                             transition: "opacity 0.2s ease-in-out",

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

@@ -57,7 +57,6 @@ var SwiperControlled_1 = __importDefault(require("../SwiperControlled"));
 var useWalletData_1 = __importDefault(require("../../../hooks/useWalletData"));
 var ModalLayout_1 = __importDefault(require("../ModalLayout"));
 var react_2 = require("swiper/react");
-var BackHeader_1 = __importDefault(require("../BackHeader"));
 var QRCode_1 = __importDefault(require("../QRCode"));
 var Text_1 = __importDefault(require("../Text"));
 var material_1 = require("@mui/material");
@@ -68,7 +67,6 @@ var getIcon_1 = __importDefault(require("../../../utils/getIcon"));
 var Share_1 = __importDefault(require("../Share"));
 var NetworkSelection_1 = __importDefault(require("../NetworkSelection"));
 var TokenSelection_1 = __importDefault(require("../TokenSelection"));
-var CloseModal_1 = __importDefault(require("../CloseModal"));
 var useReceiveData_1 = __importDefault(require("../../../hooks/useReceiveData"));
 var RequireConnect_1 = __importDefault(require("../RequireConnect"));
 var WaitingData_1 = __importDefault(require("../WaitingData"));
@@ -81,7 +79,7 @@ var ThemeProvider_1 = require("../../../providers/ThemeProvider");
 var ChildPageLayout_1 = __importDefault(require("../../layouts/ChildPageLayout"));
 var LineValue_1 = __importDefault(require("../LineValue"));
 var SvgPath_1 = require("../SvgPath");
-var sortByBalance_1 = __importStar(require("./components/sortByBalance"));
+var sortByBalance_1 = __importDefault(require("./components/sortByBalance"));
 var ReceiveHistory_1 = __importDefault(require("../ReceiveHistory"));
 var sort_utils_1 = require("../../../utils/sort.utils");
 var PageHeader_1 = __importDefault(require("../PageHeader"));
@@ -112,17 +110,19 @@ exports.ReceiveFunction = (0, react_1.forwardRef)(function (props, ref) {
     var stepDrawerRef = (0, react_1.useRef)(null);
     var stepSwiperRef = (0, react_1.useRef)(null);
     var amountInputRef = (0, react_1.useRef)(null);
-    var _b = (0, react_1.useState)(sortByBalance_1.SortBalance.ASC), sortBalance = _b[0], setSortBalance = _b[1];
+    var _b = (0, react_1.useState)(false), isSharing = _b[0], setIsSharing = _b[1];
+    var _c = (0, react_1.useState)(), sortBalance = _c[0], setSortBalance = _c[1];
     var historyRef = (0, react_1.useRef)(null);
     var theme = (0, ThemeProvider_1.useTheme)();
-    var _c = (0, react_1.useState)(ReceiveStep.SELECT_METHOD), currentStep = _c[0], setCurrentStep = _c[1];
-    var _d = (0, react_1.useState)(), selectedToken = _d[0], setSelectedToken = _d[1];
-    var _e = (0, react_1.useState)(), selectedNetwork = _e[0], setSelectedNetwork = _e[1];
-    var _f = (0, useWalletData_1.default)(), isInitPasscode = _f.isInitPasscode, blockchainWallets = _f.blockchainWallets, masterWallet = _f.masterWallet;
-    var _g = (0, react_1.useState)(""), inputAmount = _g[0], setInputAmount = _g[1];
-    var _h = (0, react_1.useState)(""), amount = _h[0], setAmount = _h[1];
-    var _j = (0, react_1.useState)(""), amountError = _j[0], setAmountError = _j[1];
-    var _k = (0, useReceiveData_1.default)(), receiveExternalTokens = _k.receiveExternalTokens, updateReceiveExternalToken = _k.updateReceiveExternalToken, receiveInternalTokens = _k.receiveInternalTokens, updateReceiveInternalToken = _k.updateReceiveInternalToken;
+    var _d = (0, react_1.useState)(ReceiveStep.SELECT_METHOD), currentStep = _d[0], setCurrentStep = _d[1];
+    var _e = (0, react_1.useState)(), selectedToken = _e[0], setSelectedToken = _e[1];
+    var _f = (0, react_1.useState)(), selectedNetwork = _f[0], setSelectedNetwork = _f[1];
+    var _g = (0, useWalletData_1.default)(), isInitPasscode = _g.isInitPasscode, blockchainWallets = _g.blockchainWallets, masterWallet = _g.masterWallet;
+    var _h = (0, react_1.useState)(""), inputAmount = _h[0], setInputAmount = _h[1];
+    var _j = (0, react_1.useState)(""), amount = _j[0], setAmount = _j[1];
+    var _k = (0, react_1.useState)(""), amountError = _k[0], setAmountError = _k[1];
+    // const [receiveTokens, setReceiveTokens] = useState<ReceiveTokenType[]>([]);
+    var _l = (0, useReceiveData_1.default)(), receiveExternalTokens = _l.receiveExternalTokens, updateReceiveExternalToken = _l.updateReceiveExternalToken, receiveInternalTokens = _l.receiveInternalTokens, updateReceiveInternalToken = _l.updateReceiveInternalToken;
     var receiveTokens = (0, react_1.useMemo)(function () {
         if (selectedMethod === ReceiveMethods.RECEIVE_INTERNAL) {
             return (0, sort_utils_1.sortByBalance)(receiveInternalTokens || [], sortBalance);
@@ -136,10 +136,10 @@ exports.ReceiveFunction = (0, react_1.forwardRef)(function (props, ref) {
         var newNetWorks = selectedToken.network_data;
         var isSameNetwork = newNetWorks === null || newNetWorks === void 0 ? void 0 : newNetWorks.find(function (item) { return (item === null || item === void 0 ? void 0 : item.id) === (selectedNetwork === null || selectedNetwork === void 0 ? void 0 : selectedNetwork.id); });
         if (!isSameNetwork) {
-            setSelectedNetwork(newNetWorks === null || newNetWorks === void 0 ? void 0 : newNetWorks[0]);
+            // setSelectedNetwork(newNetWorks?.[0]);
         }
         return newNetWorks;
-    }, [selectedToken]);
+    }, [selectedNetwork === null || selectedNetwork === void 0 ? void 0 : selectedNetwork.id, selectedToken]);
     var receiveAddress = (0, react_1.useMemo)(function () {
         var _a;
         if (!selectedToken) {
@@ -182,6 +182,12 @@ exports.ReceiveFunction = (0, react_1.forwardRef)(function (props, ref) {
         }
         return null;
     }, [selectedMethod, selectedToken, amount]);
+    var handleShareProgress = function () {
+        setIsSharing(true);
+    };
+    var handleShareFinish = function () {
+        setIsSharing(false);
+    };
     var clearValues = function () {
         setInputAmount("");
         setAmount("");
@@ -189,6 +195,7 @@ exports.ReceiveFunction = (0, react_1.forwardRef)(function (props, ref) {
         setSelectedToken(undefined);
         setSelectedNetwork(undefined);
         setSelectedMethod(undefined);
+        handleShareFinish();
     };
     var open = function () {
         var _a;
@@ -306,18 +313,9 @@ 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: {
-                        width: "100%",
-                        display: "flex",
-                        alignItems: "center",
-                        mb: theme.mixins.customMargin.m20,
-                    }, overrideBack: handleBack, hideBack: true, center: RECEIVE_STEP_NAME[ReceiveStep.SELECT_METHOD], children: (0, jsx_runtime_1.jsx)(CloseModal_1.default, { sx: { marginLeft: "auto" }, onClick: close }) }), children: (0, jsx_runtime_1.jsx)(DrawerComponent_1.default, { ref: stepDrawerRef, direction: DrawerComponent_1.DRAWER_DIRECTION.RIGHT, 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: (0, jsx_runtime_1.jsx)(ModalLayout_1.default, { title: RECEIVE_STEP_NAME[ReceiveStep.SELECT_METHOD], onClose: close, children: (0, jsx_runtime_1.jsx)(DrawerComponent_1.default, { ref: stepDrawerRef, direction: DrawerComponent_1.DRAWER_DIRECTION.RIGHT, sx: {
                         width: "100%",
-                    }, trigger: (0, jsx_runtime_1.jsx)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { height: "fit-content", width: "100%" }), 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: {
-                                            py: theme.mixins.customPadding.p12,
-                                        } })] }, "method_".concat(item)));
-                        }) }), children: (0, jsx_runtime_1.jsx)(ChildPageLayout_1.default, { sx: {
+                    }, trigger: (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g12, height: "fit-content", width: "100%" }), children: [(0, jsx_runtime_1.jsx)(ListItemCustom_1.default, { title: "Top up via internal transfer", description: "Receive crypto from other Ting users", icon: (0, jsx_runtime_1.jsx)(material_1.SvgIcon, { sx: { width: 24, height: 24 }, children: SvgPath_1.IC_RECEIVE_INTERNAL }), onClick: function () { return handleSelectMethod(ReceiveMethods.RECEIVE_INTERNAL); } }), (0, jsx_runtime_1.jsx)(ListItemCustom_1.default, { title: "Top up via blockchain", description: "Deposit using a Web3 or an Exchange wallet", icon: (0, jsx_runtime_1.jsx)(material_1.SvgIcon, { sx: { width: 24, height: 24 }, children: SvgPath_1.IC_RECEIVE_EXTERNAL }), onClick: function () { return handleSelectMethod(ReceiveMethods.RECEIVE_EXTERNAL); } })] }), children: (0, jsx_runtime_1.jsx)(ChildPageLayout_1.default, { sx: {
                             position: "relative",
                             sx: "100dvh",
                         }, header: (0, jsx_runtime_1.jsx)(PageHeader_1.default, { title: RECEIVE_STEP_NAME[Math.max(currentStep, ReceiveStep.SELECT_TOKEN)], overrideBack: handleBack, rightAdornment: (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g4, marginLeft: "auto" }), 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: {
@@ -328,17 +326,26 @@ exports.ReceiveFunction = (0, react_1.forwardRef)(function (props, ref) {
                                             marginRight: theme.mixins.customMargin.m4,
                                         } }), (0, jsx_runtime_1.jsx)(DrawerComponent_1.default, { ref: historyRef, trigger: (0, jsx_runtime_1.jsx)(material_1.Box, { sx: {
                                                 marginBottom: theme.mixins.customMargin.m4,
-                                            }, children: (0, jsx_runtime_1.jsx)(material_1.SvgIcon, { sx: { width: 18, height: 18 }, children: SvgPath_1.IC_HISTORY }) }), direction: DrawerComponent_1.DRAWER_DIRECTION.RIGHT, children: (0, jsx_runtime_1.jsx)(ReceiveHistory_1.default, { onClose: closeHistory }) })] }) }), footer: currentStep === ReceiveStep.SHOW_QR_CODE && ((0, jsx_runtime_1.jsx)(Share_1.default, { elementId: "share-receive-info", children: (0, jsx_runtime_1.jsx)(BottomActionLayout_1.default, { children: (0, jsx_runtime_1.jsx)(Button_1.default.Primary, { fullWidth: true, children: "Share" }) }) })), children: (0, jsx_runtime_1.jsx)(material_1.Box, { sx: { padding: theme.mixins.pagePadding }, children: (0, jsx_runtime_1.jsxs)(SwiperControlled_1.default, { ref: stepSwiperRef, swiperProps: {
-                                    autoHeight: true,
+                                            }, children: (0, jsx_runtime_1.jsx)(material_1.SvgIcon, { sx: { width: 18, height: 18 }, children: SvgPath_1.IC_HISTORY }) }), direction: DrawerComponent_1.DRAWER_DIRECTION.RIGHT, children: (0, jsx_runtime_1.jsx)(ReceiveHistory_1.default, { onClose: closeHistory }) })] }) }), footer: (0, jsx_runtime_1.jsx)(material_1.Box, { sx: {
+                                maxHeight: currentStep === ReceiveStep.SHOW_QR_CODE ? "120px" : 0,
+                                overflow: "hidden",
+                                transition: currentStep === ReceiveStep.SHOW_QR_CODE ? "max-height 0.3s linear 0.3s" : "max-height 0s linear",
+                            }, children: (0, jsx_runtime_1.jsx)(Share_1.default, { elementId: "share-receive-info", onProgress: handleShareProgress, onFinish: handleShareFinish, children: (0, jsx_runtime_1.jsx)(BottomActionLayout_1.default, { children: (0, jsx_runtime_1.jsx)(Button_1.default.Primary, { fullWidth: true, status: isSharing ? Button_1.BUTTON_STATUS.LOADING : undefined, children: "Share" }) }) }) }), children: (0, jsx_runtime_1.jsx)(material_1.Box, { sx: { padding: theme.mixins.pagePadding }, children: (0, jsx_runtime_1.jsxs)(SwiperControlled_1.default, { ref: stepSwiperRef, swiperProps: {
+                                    // autoHeight: true,
                                     spaceBetween: 32,
-                                }, 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: {
+                                }, disableSwipe: true, 
+                                // key={`step_${currentStep}`}
+                                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, { position: "start", children: (0, jsx_runtime_1.jsx)(material_1.SvgIcon, { sx: { width: 20, height: 20 }, children: SvgPath_1.IC_SEARCH }) }), placeholder: "Search", sx: {
                                                                 borderRadius: theme.mixins.customRadius.r12,
                                                                 border: "1px solid",
                                                                 borderColor: theme.palette.border.accent3,
                                                                 background: theme.palette.background.white,
                                                                 color: theme.palette.text.black,
+                                                                py: theme.mixins.customPadding.p6,
+                                                                px: theme.mixins.customPadding.p12,
+                                                                fontSize: theme.typography.fontSize16,
                                                                 "input::placeholder": {
-                                                                    fontSize: theme.typography.fontSize11,
+                                                                    fontSize: theme.typography.fontSize12,
                                                                     pl: theme.mixins.customPadding.p4,
                                                                     fontWeight: theme.typography.fontWeight500,
                                                                     color: theme.palette.text.black,
@@ -347,7 +354,9 @@ exports.ReceiveFunction = (0, react_1.forwardRef)(function (props, ref) {
                                                                 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.jsx)(sortByBalance_1.default, { sortBalance: sortBalance, setSortBalance: setSortBalance })] })] })), receiveTokens === null || receiveTokens === void 0 ? void 0 : receiveTokens.map(function (item, index) {
+                                                            }, children: [(0, jsx_runtime_1.jsx)(sortByBalance_1.default, { name: "Token" }), (0, jsx_runtime_1.jsx)(sortByBalance_1.default, { name: "Balance", 
+                                                                    // sortBalance={sortBalance}
+                                                                    setSortBalance: setSortBalance })] })] })), receiveTokens === null || receiveTokens === void 0 ? void 0 : receiveTokens.map(function (item, index) {
                                                     var stringifiedTokenData = JSON.stringify(item);
                                                     if (!item)
                                                         return null;
@@ -364,26 +373,29 @@ exports.ReceiveFunction = (0, react_1.forwardRef)(function (props, ref) {
                                                 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.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": {
+                                            }, children: [(0, jsx_runtime_1.jsx)("div", { id: "share-receive-info", 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: "5rem", alignItems: "flex-start", position: "relative", marginTop: "4.6875rem" }), 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, 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.jsx)(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)("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 }), 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)(material_1.SvgIcon, { sx: { width: 20, height: 20 }, children: SvgPath_1.IC_COPY })] })] }), (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: [!!amount && ((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: "Amount" }), value: (0, jsx_runtime_1.jsxs)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.activityTitle), { fontSize: theme.typography.fontSize14 }), children: [amount, " ", selectedToken === null || selectedToken === void 0 ? void 0 : selectedToken.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: "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: {
+                                                                                } }), children: [(0, jsx_runtime_1.jsx)(Icon_1.default, { width: 24, height: 24, sx: {
+                                                                                        borderRadius: "9999px",
+                                                                                    }, 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.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g4 }), 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)(material_1.SvgIcon, { sx: { width: 20, height: 20 }, children: SvgPath_1.IC_COPY })] })] }), (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: [!!amount && ((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.fontSize13 }), children: "Amount" }), value: (0, jsx_runtime_1.jsxs)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.activityTitle), { fontSize: theme.typography.fontSize13 }), children: [amount, " ", selectedToken === null || selectedToken === void 0 ? void 0 : selectedToken.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.fontSize13 }), children: "Minimum Top Up" }), value: (0, jsx_runtime_1.jsxs)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.activityTitle), { fontSize: theme.typography.fontSize13 }), 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.fontSize13 }), children: "Top Up Arrival Time" }), value: (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.activityTitle), { fontSize: theme.typography.fontSize13 }), 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.fontSize13 }), children: "Withdrawal Arrival Time" }), value: (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.activityTitle), { fontSize: theme.typography.fontSize13 }), 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",
                                                     }, onOpen: handleAmountModalOpen, trigger: (0, jsx_runtime_1.jsx)(xhub_keyboard_1.Label, { htmlFor: "receive-amount", children: (0, jsx_runtime_1.jsxs)(Button_1.default.Text, { sx: {
-                                                                fontSize: theme.typography.fontSize12,
+                                                                fontSize: theme.typography.fontSize14,
                                                                 textTransform: "none",
-                                                            }, children: [amount ? "Edit" : "+ Set", " amount"] }) }), children: (0, jsx_runtime_1.jsx)(xhub_keyboard_1.Keyboard, { id: "receive-amount", onChange: handleChangeAmount, keyboardType: xhub_keyboard_1.KeyboardType.Double, value: inputAmount === null || inputAmount === void 0 ? void 0 : inputAmount.toString(), keyboardId: "amount-keyboard-id", children: (0, jsx_runtime_1.jsx)(ModalLayout_1.default, { onClose: function () { var _a; return (_a = amountDrawerRef.current) === null || _a === void 0 ? void 0 : _a.close(); }, title: (0, jsx_runtime_1.jsxs)(Text_1.default, { sx: __assign({}, theme.mixins.fieldTitle), children: [amount ? "Edit" : "Set", " ", selectedToken === null || selectedToken === void 0 ? void 0 : selectedToken.name, " amount"] }), children: (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g12 }), children: [(0, jsx_runtime_1.jsx)(xhub_keyboard_1.Label, { htmlFor: "receive-amount", children: (0, jsx_runtime_1.jsx)(xhub_keyboard_1.Input, { ref: amountInputRef, elementsAcceptIds: ["amount-keyboard-id"], value: inputAmount === null || inputAmount === void 0 ? void 0 : inputAmount.toString(), displayType: xhub_keyboard_1.DisplayType.Double, rightElement: (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" })] })] }) }) }) })] }) }, "slide_step_".concat(ReceiveStep.SHOW_QR_CODE))] }, "step_".concat(currentStep)) }) }) }) }) }) }));
+                                                                fontWeight: theme.typography.fontWeight500,
+                                                            }, children: [amount ? "Edit" : "+ Set", " amount"] }) }), children: (0, jsx_runtime_1.jsx)(xhub_keyboard_1.Keyboard, { id: "receive-amount", onChange: handleChangeAmount, keyboardType: xhub_keyboard_1.KeyboardType.Double, value: inputAmount === null || inputAmount === void 0 ? void 0 : inputAmount.toString(), keyboardId: "amount-keyboard-id", children: (0, jsx_runtime_1.jsx)(ModalLayout_1.default, { onClose: function () { var _a; return (_a = amountDrawerRef.current) === null || _a === void 0 ? void 0 : _a.close(); }, title: (0, jsx_runtime_1.jsxs)(Text_1.default, { sx: __assign({}, theme.mixins.fieldTitle), children: [amount ? "Edit" : "Set", " ", selectedToken === null || selectedToken === void 0 ? void 0 : selectedToken.name, " amount"] }), children: (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g12 }), children: [(0, jsx_runtime_1.jsx)(xhub_keyboard_1.Label, { htmlFor: "receive-amount", children: (0, jsx_runtime_1.jsx)(xhub_keyboard_1.Input, { ref: amountInputRef, elementsAcceptIds: ["amount-keyboard-id"], value: inputAmount === null || inputAmount === void 0 ? void 0 : inputAmount.toString(), displayType: xhub_keyboard_1.DisplayType.Double, rightElement: (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" })] })] }) }) }) })] }) }, "slide_step_".concat(ReceiveStep.SHOW_QR_CODE))] }) }) }) }) }) }) }));
 });
 exports.ReceiveFunction.displayName = "ReceiveFunction";
 exports.default = exports.ReceiveFunction;

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

@@ -56,7 +56,8 @@ var useWalletData_1 = __importDefault(require("../../../hooks/useWalletData"));
 var react_1 = require("react");
 var material_1 = require("@mui/material");
 var AuthViewSignIn_1 = __importDefault(require("../../views/AuthViewSignIn"));
-var ChangePasscodeView_1 = __importDefault(require("../../views/ChangePasscodeView"));
+// import ChangePasscodeView from "../../views/ChangePasscodeView";
+var InitPasscode_1 = __importDefault(require("../InitPasscode"));
 function RequireConnect(_a) {
     var children = _a.children, signIn = _a.signIn, component = _a.component, sx = _a.sx;
     var authViewRef = (0, react_1.useRef)(null);
@@ -77,7 +78,7 @@ function RequireConnect(_a) {
         return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign({ position: "relative" }, sx), component: component || "div", children: [children, (0, jsx_runtime_1.jsx)(material_1.Box, { sx: { position: "absolute", inset: 0, zIndex: 10 }, onClick: handleOpenAuthView, children: (0, jsx_runtime_1.jsxs)(DrawerComponent_1.default, { ref: authViewRef, direction: DrawerComponent_1.DRAWER_DIRECTION.RIGHT, onClick: stopPropagation, children: [isSSO && (0, jsx_runtime_1.jsx)(AuthViewSignIn_1.default, { onBack: backAuthView, onSignIn: signIn }), !isSSO && (0, jsx_runtime_1.jsx)(AuthView_1.default, { onBack: backAuthView })] }) })] }) }));
     }
     if (!isInitPasscode) {
-        return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign({ position: "relative" }, sx), component: component || "div", children: [children, (0, jsx_runtime_1.jsx)(material_1.Box, { sx: { position: "absolute", inset: 0, zIndex: 10 }, onClick: handleOpenAuthView, children: (0, jsx_runtime_1.jsx)(DrawerComponent_1.default, { ref: authViewRef, direction: DrawerComponent_1.DRAWER_DIRECTION.RIGHT, onClick: stopPropagation, children: (0, jsx_runtime_1.jsx)(ChangePasscodeView_1.default, { onBack: backAuthView, isInitPasscode: true }) }) })] }) }));
+        return (0, jsx_runtime_1.jsx)(InitPasscode_1.default, { children: children });
     }
     return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: children });
 }

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

@@ -6,6 +6,8 @@ interface SharePropsType extends GeneralProps {
     backupMessage?: string;
     shareTitle?: string;
     message?: string;
+    onProgress?: () => void;
+    onFinish?: () => void;
 }
-declare function Share({ children, elementId, backgroundColor, skipFonts, message, shareTitle, }: SharePropsType): import("react/jsx-runtime").JSX.Element;
+declare function Share({ children, elementId, backgroundColor, skipFonts, message, shareTitle, onProgress, onFinish, }: SharePropsType): import("react/jsx-runtime").JSX.Element;
 export default Share;

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

@@ -35,19 +35,13 @@ var __generator = (this && this.__generator) || function (thisArg, body) {
         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 html_to_image_1 = require("html-to-image");
-var react_1 = require("react");
-var CircularProgress_1 = __importDefault(require("@mui/material/CircularProgress"));
 var material_1 = require("@mui/material");
 function Share(_a) {
     var _this = this;
-    var children = _a.children, elementId = _a.elementId, backgroundColor = _a.backgroundColor, _b = _a.skipFonts, skipFonts = _b === void 0 ? true : _b, message = _a.message, _c = _a.shareTitle, shareTitle = _c === void 0 ? "Shared Image" : _c;
-    var _d = (0, react_1.useState)(false), isRepairing = _d[0], setIsRepairing = _d[1];
+    var children = _a.children, elementId = _a.elementId, _b = _a.backgroundColor, backgroundColor = _b === void 0 ? "#FFFFFF" : _b, _c = _a.skipFonts, skipFonts = _c === void 0 ? true : _c, _d = _a.message, message = _d === void 0 ? "" : _d, _e = _a.shareTitle, shareTitle = _e === void 0 ? "Shared Image" : _e, onProgress = _a.onProgress, onFinish = _a.onFinish;
     var handleShareImage = function () { return __awaiter(_this, void 0, void 0, function () {
         var el, blob, file, error_1, error_2;
         return __generator(this, function (_a) {
@@ -58,14 +52,12 @@ function Share(_a) {
                     _a.label = 1;
                 case 1:
                     _a.trys.push([1, 7, , 8]);
-                    // Check if the Web Share API is available
                     if (!navigator.share) {
-                        // noti?.error(translate("Sharing is not supported on your device or browser"));
                         throw new Error("Sharing is not supported on your device or browser");
                     }
-                    setIsRepairing(true);
+                    onProgress === null || onProgress === void 0 ? void 0 : onProgress();
                     return [4 /*yield*/, (0, html_to_image_1.toBlob)(el, {
-                            quality: 1,
+                            quality: 0.8,
                             cacheBust: true,
                             skipFonts: skipFonts,
                             backgroundColor: backgroundColor,
@@ -87,38 +79,23 @@ function Share(_a) {
                         })];
                 case 4:
                     _a.sent();
-                    setIsRepairing(false);
+                    onFinish === null || onFinish === void 0 ? void 0 : onFinish();
                     return [3 /*break*/, 6];
                 case 5:
                     error_1 = _a.sent();
                     console.error("🚀 ~ handleShareImage ~ error:", error_1);
+                    onFinish === null || onFinish === void 0 ? void 0 : onFinish();
                     return [2 /*return*/];
                 case 6: return [3 /*break*/, 8];
                 case 7:
                     error_2 = _a.sent();
-                    setIsRepairing(false);
+                    onFinish === null || onFinish === void 0 ? void 0 : onFinish();
                     console.error("Error capturing image:", error_2);
                     return [2 /*return*/];
                 case 8: return [2 /*return*/];
             }
         });
     }); };
-    return ((0, jsx_runtime_1.jsxs)(material_1.Box, { onClick: handleShareImage, sx: { position: "relative" }, children: [children, isRepairing && ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: {
-                    position: "absolute",
-                    left: "50%",
-                    top: "50%",
-                    transform: "translate(-50%, -50%)",
-                    minHeight: "100%",
-                    minWidth: "100%",
-                    backgroundColor: "background.black",
-                    borderRadius: "50%",
-                    display: "flex",
-                    alignItems: "center",
-                    justifyContent: "center",
-                    textAlign: "center",
-                    fontSize: "0.8em",
-                    color: "text.secondary.main",
-                    whiteSpace: "nowrap",
-                }, children: [(0, jsx_runtime_1.jsx)(CircularProgress_1.default, { size: "0.75rem" }), "preparing"] }))] }));
+    return ((0, jsx_runtime_1.jsx)(material_1.Box, { onClick: handleShareImage, sx: { position: "relative" }, children: children }));
 }
 exports.default = Share;

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

@@ -18,3 +18,7 @@ export declare const IC_CHEVRON_LEFT: import("react/jsx-runtime").JSX.Element;
 export declare const IC_CHEVRON_RIGHT: import("react/jsx-runtime").JSX.Element;
 export declare const IC_SUCCESS: import("react/jsx-runtime").JSX.Element;
 export declare const IC_ERROR: import("react/jsx-runtime").JSX.Element;
+export declare const IC_RECEIVE_INTERNAL: import("react/jsx-runtime").JSX.Element;
+export declare const IC_RECEIVE_EXTERNAL: import("react/jsx-runtime").JSX.Element;
+export declare const IC_ARROW_DROP_UP: import("react/jsx-runtime").JSX.Element;
+export declare const IC_ARROW_DROP_DOWN: import("react/jsx-runtime").JSX.Element;

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

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.IC_ERROR = exports.IC_SUCCESS = exports.IC_CHEVRON_RIGHT = exports.IC_CHEVRON_LEFT = exports.IC_TRASH = exports.IC_ARROW_BLACK_DROP = exports.IC_SWAP = exports.IC_HELP = exports.IC_PASSCODE = exports.IC_FACE_ID = exports.IC_COPY = exports.IC_TIMELINE_DOT = exports.IC_CLOSE = exports.IC_SEARCH = exports.IC_DOCUMENTS = exports.IC_SCAN = exports.IC_TUTORIAL = exports.IC_HISTORY = exports.ARROW_DROP_DOWN = exports.ARROW_DROP_UP = void 0;
+exports.IC_ARROW_DROP_DOWN = exports.IC_ARROW_DROP_UP = exports.IC_RECEIVE_EXTERNAL = exports.IC_RECEIVE_INTERNAL = exports.IC_ERROR = exports.IC_SUCCESS = exports.IC_CHEVRON_RIGHT = exports.IC_CHEVRON_LEFT = exports.IC_TRASH = exports.IC_ARROW_BLACK_DROP = exports.IC_SWAP = exports.IC_HELP = exports.IC_PASSCODE = exports.IC_FACE_ID = exports.IC_COPY = exports.IC_TIMELINE_DOT = exports.IC_CLOSE = exports.IC_SEARCH = exports.IC_DOCUMENTS = exports.IC_SCAN = exports.IC_TUTORIAL = exports.IC_HISTORY = exports.ARROW_DROP_DOWN = exports.ARROW_DROP_UP = void 0;
 var jsx_runtime_1 = require("react/jsx-runtime");
 exports.ARROW_DROP_UP = ((0, jsx_runtime_1.jsx)("svg", { width: "8", height: "5", viewBox: "0 0 8 5", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: (0, jsx_runtime_1.jsx)("path", { d: "M0 4.5L4 0.5L8 4.5H0Z", fill: "#000" }) }));
 exports.ARROW_DROP_DOWN = ((0, jsx_runtime_1.jsx)("svg", { width: "8", height: "5", viewBox: "0 0 8 5", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: (0, jsx_runtime_1.jsx)("path", { d: "M8 0.5L4 4.5L0 0.5L8 0.5Z", fill: "#000" }) }));
@@ -22,3 +22,7 @@ exports.IC_CHEVRON_LEFT = ((0, jsx_runtime_1.jsx)("svg", { xmlns: "http://www.w3
 exports.IC_CHEVRON_RIGHT = ((0, jsx_runtime_1.jsx)("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "#000000", width: "800px", height: "800px", viewBox: "0 0 52 52", enableBackground: "new 0 0 52 52", xmlSpace: "preserve", children: (0, jsx_runtime_1.jsx)("g", { children: (0, jsx_runtime_1.jsx)("path", { d: "M17.9,4.4l20.7,20.5c0.6,0.6,0.6,1.6,0,2.2L17.9,47.6c-0.6,0.6-1.6,0.6-2.2,0l-2.2-2.2   c-0.6-0.6-0.6-1.6,0-2.2l16.3-16.1c0.6-0.6,0.6-1.6,0-2.2L13.6,8.8c-0.6-0.6-0.6-1.6,0-2.2l2.2-2.2C16.4,3.9,17.3,3.9,17.9,4.4z" }) }) }));
 exports.IC_SUCCESS = ((0, jsx_runtime_1.jsx)("svg", { xmlns: "http://www.w3.org/2000/svg", height: "24px", viewBox: "0 -960 960 960", width: "24px", fill: "#01FF00", children: (0, jsx_runtime_1.jsx)("path", { d: "M480-80q-83 0-156-31.5T197-197q-54-54-85.5-127T80-480q0-83 31.5-156T197-763q54-54 127-85.5T480-880q65 0 123 19t107 53l-58 59q-38-24-81-37.5T480-800q-133 0-226.5 93.5T160-480q0 133 93.5 226.5T480-160q133 0 226.5-93.5T800-480q0-18-2-36t-6-35l65-65q11 32 17 66t6 70q0 83-31.5 156T763-197q-54 54-127 85.5T480-80Zm-56-216L254-466l56-56 114 114 400-401 56 56-456 457Z" }) }));
 exports.IC_ERROR = ((0, jsx_runtime_1.jsx)("svg", { xmlns: "http://www.w3.org/2000/svg", height: "24px", viewBox: "0 -960 960 960", width: "24px", fill: "#FF434E", children: (0, jsx_runtime_1.jsx)("path", { d: "M480-280q17 0 28.5-11.5T520-320q0-17-11.5-28.5T480-360q-17 0-28.5 11.5T440-320q0 17 11.5 28.5T480-280Zm-40-160h80v-240h-80v240Zm40 360q-83 0-156-31.5T197-197q-54-54-85.5-127T80-480q0-83 31.5-156T197-763q54-54 127-85.5T480-880q83 0 156 31.5T763-763q54 54 85.5 127T880-480q0 83-31.5 156T763-197q-54 54-127 85.5T480-80Zm0-80q134 0 227-93t93-227q0-134-93-227t-227-93q-134 0-227 93t-93 227q0 134 93 227t227 93Zm0-320Z" }) }));
+exports.IC_RECEIVE_INTERNAL = ((0, jsx_runtime_1.jsx)("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: (0, jsx_runtime_1.jsx)("path", { d: "M17.5 10C17.5 9.50272 17.3025 9.02581 16.9508 8.67417C16.5992 8.32254 16.1223 8.125 15.625 8.125H12.5C12.5 8.78804 12.2366 9.42393 11.7678 9.89277C11.2989 10.3616 10.663 10.625 10 10.625C9.33696 10.625 8.70107 10.3616 8.23223 9.89277C7.76339 9.42393 7.5 8.78804 7.5 8.125H4.375C3.87772 8.125 3.40081 8.32254 3.04917 8.67417C2.69754 9.02581 2.5 9.50272 2.5 10M17.5 10V15C17.5 15.4973 17.3025 15.9742 16.9508 16.3258C16.5992 16.6775 16.1223 16.875 15.625 16.875H4.375C3.87772 16.875 3.40081 16.6775 3.04917 16.3258C2.69754 15.9742 2.5 15.4973 2.5 15V10M17.5 10V7.5M2.5 10V7.5M17.5 7.5C17.5 7.00272 17.3025 6.52581 16.9508 6.17417C16.5992 5.82254 16.1223 5.625 15.625 5.625H4.375C3.87772 5.625 3.40081 5.82254 3.04917 6.17417C2.69754 6.52581 2.5 7.00272 2.5 7.5M17.5 7.5V5C17.5 4.50272 17.3025 4.02581 16.9508 3.67417C16.5992 3.32254 16.1223 3.125 15.625 3.125H4.375C3.87772 3.125 3.40081 3.32254 3.04917 3.67417C2.69754 4.02581 2.5 4.50272 2.5 5V7.5", stroke: "#1E4841", "stroke-width": "1.25", "stroke-linecap": "round", "stroke-linejoin": "round" }) }));
+exports.IC_RECEIVE_EXTERNAL = ((0, jsx_runtime_1.jsx)("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: (0, jsx_runtime_1.jsx)("path", { d: "M10 5V15M7.5 12.6517L8.2325 13.2008C9.20833 13.9333 10.7908 13.9333 11.7675 13.2008C12.7442 12.4683 12.7442 11.2817 11.7675 10.5492C11.28 10.1825 10.64 10 10 10C9.39583 10 8.79167 9.81667 8.33083 9.45083C7.40917 8.71833 7.40917 7.53167 8.33083 6.79917C9.2525 6.06667 10.7475 6.06667 11.6692 6.79917L12.015 7.07417M17.5 10C17.5 10.9849 17.306 11.9602 16.9291 12.8701C16.5522 13.7801 15.9997 14.6069 15.3033 15.3033C14.6069 15.9997 13.7801 16.5522 12.8701 16.9291C11.9602 17.306 10.9849 17.5 10 17.5C9.01509 17.5 8.03982 17.306 7.12987 16.9291C6.21993 16.5522 5.39314 15.9997 4.6967 15.3033C4.00026 14.6069 3.44781 13.7801 3.0709 12.8701C2.69399 11.9602 2.5 10.9849 2.5 10C2.5 8.01088 3.29018 6.10322 4.6967 4.6967C6.10322 3.29018 8.01088 2.5 10 2.5C11.9891 2.5 13.8968 3.29018 15.3033 4.6967C16.7098 6.10322 17.5 8.01088 17.5 10Z", stroke: "#1E4841", "stroke-width": "1.25", "stroke-linecap": "round", "stroke-linejoin": "round" }) }));
+exports.IC_ARROW_DROP_UP = ((0, jsx_runtime_1.jsx)("svg", { width: "8", height: "5", viewBox: "0 0 8 5", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: (0, jsx_runtime_1.jsx)("path", { d: "M0 4.5L4 0.5L8 4.5H0Z", fill: "#121212" }) }));
+exports.IC_ARROW_DROP_DOWN = ((0, jsx_runtime_1.jsx)("svg", { width: "8", height: "5", viewBox: "0 0 8 5", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: (0, jsx_runtime_1.jsx)("path", { d: "M8 0.5L4 4.5L0 0.5L8 0.5Z", fill: "#A3A3A3" }) }));

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 ? "".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: {
+    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: {
                             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: __assign(__assign({}, theme.mixins.valueDescription), { color: theme.palette.text.accent }), children: (0, jsx_runtime_1.jsx)(Formatter_1.default, { value: balanceInUSD, start: "~ $" }) })] })] })));
+                        } }), (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: "~ $" }) })] })] })));
 };
 exports.default = TokenSelection;

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

@@ -235,7 +235,7 @@ exports.TransferInternal = (0, react_1.forwardRef)(function (props, ref) {
             updateSendInternalToken();
         }
     }, [sendInternalTokens, updateSendInternalToken, isInitPasscode]);
-    return ((0, jsx_runtime_1.jsx)(RequireConnect_1.default, { children: (0, jsx_runtime_1.jsxs)(ConfirmLayout_1.default, { ref: confirmLayoutDrawerRef, action: props.titleHeader, trigger: props.children, onOpen: validateAll, confirmAction: (0, jsx_runtime_1.jsx)(ConfirmByPasscode_1.default, { action: type_1.TransactionSlug.TransferInternal, onConfirmSuccess: handleSendInternalToken, backgroundColor: theme.palette.background.tertiary, children: (0, jsx_runtime_1.jsx)(Button_1.default.Primary, { sx: {
+    return ((0, jsx_runtime_1.jsx)(RequireConnect_1.default, { children: (0, jsx_runtime_1.jsxs)(ConfirmLayout_1.default, { ref: confirmLayoutDrawerRef, action: props.titleHeader, trigger: props.children, onOpen: validateAll, confirmAction: (0, jsx_runtime_1.jsx)(ConfirmByPasscode_1.default, { action: type_1.TransactionSlug.TransferInternal, onConfirmSuccess: handleSendInternalToken, children: (0, jsx_runtime_1.jsx)(Button_1.default.Primary, { sx: {
                         width: "100%",
                     }, status: !!error || isValidatingAddress || errorAddress ? Button_1.BUTTON_STATUS.DISABLED : buttonStatus, fullWidth: true, children: "Confirm" }) }), children: [transferContent, !!error && ((0, jsx_runtime_1.jsxs)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.validationError), { mt: (_a = theme.mixins.gaps) === null || _a === void 0 ? void 0 : _a.g6 }), children: [error, " ", !!errorAmount && (0, jsx_runtime_1.jsx)(Formatter_1.default, { value: errorAmount, unit: " ".concat(token === null || token === void 0 ? void 0 : token.name) })] }))] }) }));
 });

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

@@ -492,7 +492,7 @@ var WithdrawFunction = (0, react_1.forwardRef)(function (props, ref) {
     (0, react_1.useEffect)(function () {
         getEstimateFee();
     }, [getEstimateFee]);
-    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.jsxs)(ModalLayout_1.default, { fullScreen: true, overrideBorderRadius: "0", 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: (0, jsx_runtime_1.jsxs)(ModalLayout_1.default, { sx: { height: "100dvh", borderRadius: "0" }, overrideHeader: (0, jsx_runtime_1.jsx)(BackHeader_1.default, { sx: {
                         width: "100%",
                         display: "flex",
                         alignItems: "center",

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

@@ -166,7 +166,9 @@ var ChangePasscodeView = function (props) {
         return __generator(this, function (_c) {
             switch (_c.label) {
                 case 0:
-                    setOldPasscode(value);
+                    if (value.length < passcodeLength) {
+                        setOldPasscode(value);
+                    }
                     setError(null);
                     if (!(value.length === passcodeLength)) return [3 /*break*/, 2];
                     (_a = childPageLayoutRef.current) === null || _a === void 0 ? void 0 : _a.showLoading();
@@ -189,7 +191,9 @@ var ChangePasscodeView = function (props) {
     }); };
     var handleNewPasscodeChange = function (value) { return __awaiter(void 0, void 0, void 0, function () {
         return __generator(this, function (_a) {
-            setNewPasscode(value);
+            if (value.length < passcodeLength) {
+                setNewPasscode(value);
+            }
             setError(null);
             /**
              * validate otp here
@@ -269,7 +273,9 @@ var ChangePasscodeView = function (props) {
     var updatePasscode = isInitPasscode ? handleInitPasscode : handleChangePasscode;
     var handleConfirmPasscodeChange = function (value) { return __awaiter(void 0, void 0, void 0, function () {
         return __generator(this, function (_a) {
-            setConfirmPasscode(value);
+            if (value.length < passcodeLength) {
+                setConfirmPasscode(value);
+            }
             setError(null);
             /**
              * validate otp here
@@ -298,7 +304,8 @@ var ChangePasscodeView = function (props) {
         }
     };
     var _g = getValueAndHandlerByStep(currentStep), value = _g.value, onChange = _g.onChange;
-    return ((0, jsx_runtime_1.jsx)(xhub_keyboard_1.Keyboard, { id: "change-passcode-keyboard", keyboardType: xhub_keyboard_1.KeyboardType.Text, layoutType: xhub_keyboard_1.LayoutType.Integer, value: value, onChange: onChange, viewFullHeight: true, children: (0, jsx_runtime_1.jsx)(ChildPageLayout_1.default, { ref: childPageLayoutRef, header: (0, jsx_runtime_1.jsx)(PageHeader_1.default, { overrideBack: handleBack, title: pageTitle, renderBack: function (Back) { return ((0, jsx_runtime_1.jsx)(xhub_keyboard_1.Label, { autoFocus: true, useBrowserInput: false, htmlFor: "change-passcode-keyboard", children: Back })); } }), children: (0, jsx_runtime_1.jsx)(DefaultPageLayout_1.default, { sx: __assign({ display: "flex", flexDirection: "column", gap: "1rem", height: "100%" }, props.sx), children: (0, jsx_runtime_1.jsxs)(SwiperControlled_1.default, { ref: swiperControlledRef, disableSwipe: true, initialActiveTab: currentStep, sx: { height: "100%" }, swiperStyle: {
+    var keyboardId = (0, react_2.useMemo)(function () { return (isInitPasscode ? "init-passcode-keyboard" : "change-passcode-keyboard"); }, [isInitPasscode]);
+    return ((0, jsx_runtime_1.jsx)(xhub_keyboard_1.Keyboard, { id: keyboardId, keyboardType: xhub_keyboard_1.KeyboardType.Text, layoutType: xhub_keyboard_1.LayoutType.Integer, value: value, onChange: onChange, viewFullHeight: true, children: (0, jsx_runtime_1.jsx)(ChildPageLayout_1.default, { ref: childPageLayoutRef, header: (0, jsx_runtime_1.jsx)(PageHeader_1.default, { overrideBack: handleBack, title: pageTitle, renderBack: function (Back) { return ((0, jsx_runtime_1.jsx)(xhub_keyboard_1.Label, { useBrowserInput: false, htmlFor: keyboardId, children: Back })); } }), children: (0, jsx_runtime_1.jsx)(DefaultPageLayout_1.default, { sx: __assign({ display: "flex", flexDirection: "column", gap: "1rem", height: "100%" }, props.sx), children: (0, jsx_runtime_1.jsxs)(SwiperControlled_1.default, { ref: swiperControlledRef, disableSwipe: true, initialActiveTab: currentStep, sx: { height: "100%" }, swiperStyle: {
                         flex: 1,
                     }, children: [(0, jsx_runtime_1.jsx)(react_1.SwiperSlide, { children: (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: {
                                     display: "flex",
@@ -307,21 +314,21 @@ var ChangePasscodeView = function (props) {
                                     alignItems: "center",
                                     gap: "1rem",
                                     height: "100%",
-                                }, children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.sessionTitle), children: stepsContent[type_1.ChangePasscodeViewStep.ENTER_OLD_PASSCODE].title }), (0, jsx_runtime_1.jsx)(xhub_keyboard_1.Label, { autoFocus: true, useBrowserInput: false, htmlFor: "change-passcode-keyboard", children: (0, jsx_runtime_1.jsx)(OTP_1.default, { value: oldPasscode, numInputs: passcodeLength, otpInputType: OTP_1.OtpInputType.PASSWORD, readOnly: true }) }), error && (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.validationError), { alignSelf: "left" }), children: error }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.sessionDescription), children: stepsContent[type_1.ChangePasscodeViewStep.ENTER_OLD_PASSCODE].description })] }) }), (0, jsx_runtime_1.jsx)(react_1.SwiperSlide, { children: (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: {
+                                }, children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.sessionTitle), children: stepsContent[type_1.ChangePasscodeViewStep.ENTER_OLD_PASSCODE].title }), (0, jsx_runtime_1.jsx)(xhub_keyboard_1.Label, { useBrowserInput: false, htmlFor: keyboardId, children: (0, jsx_runtime_1.jsx)(OTP_1.default, { value: oldPasscode, numInputs: passcodeLength, otpInputType: OTP_1.OtpInputType.PASSWORD, readOnly: true }) }), error && (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.validationError), { alignSelf: "left" }), children: error }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.sessionDescription), children: stepsContent[type_1.ChangePasscodeViewStep.ENTER_OLD_PASSCODE].description })] }) }), (0, jsx_runtime_1.jsx)(react_1.SwiperSlide, { children: (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: {
                                     display: "flex",
                                     flexDirection: "column",
                                     justifyContent: "center",
                                     alignItems: "center",
                                     height: "100%",
                                     gap: "1rem",
-                                }, children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.sessionTitle), children: stepsContent[type_1.ChangePasscodeViewStep.ENTER_NEW_PASSCODE].title }), (0, jsx_runtime_1.jsx)(xhub_keyboard_1.Label, { autoFocus: true, useBrowserInput: false, htmlFor: "change-passcode-keyboard", children: (0, jsx_runtime_1.jsx)(OTP_1.default, { value: newPasscode, onChange: handleNewPasscodeChange, numInputs: passcodeLength, otpInputType: OTP_1.OtpInputType.PASSWORD, readOnly: true }) }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.sessionDescription), children: stepsContent[type_1.ChangePasscodeViewStep.ENTER_NEW_PASSCODE].description })] }) }), (0, jsx_runtime_1.jsx)(react_1.SwiperSlide, { children: (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: {
+                                }, children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.sessionTitle), children: stepsContent[type_1.ChangePasscodeViewStep.ENTER_NEW_PASSCODE].title }), (0, jsx_runtime_1.jsx)(xhub_keyboard_1.Label, { useBrowserInput: false, htmlFor: keyboardId, children: (0, jsx_runtime_1.jsx)(OTP_1.default, { value: newPasscode, onChange: handleNewPasscodeChange, numInputs: passcodeLength, otpInputType: OTP_1.OtpInputType.PASSWORD, readOnly: true }) }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.sessionDescription), children: stepsContent[type_1.ChangePasscodeViewStep.ENTER_NEW_PASSCODE].description })] }) }), (0, jsx_runtime_1.jsx)(react_1.SwiperSlide, { children: (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: {
                                     display: "flex",
                                     flexDirection: "column",
                                     alignItems: "center",
                                     justifyContent: "center",
                                     height: "100%",
                                     gap: "1rem",
-                                }, children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.sessionTitle), children: stepsContent[type_1.ChangePasscodeViewStep.CONFIRM_NEW_PASSCODE].title }), (0, jsx_runtime_1.jsx)(xhub_keyboard_1.Label, { autoFocus: true, useBrowserInput: false, htmlFor: "change-passcode-keyboard", children: (0, jsx_runtime_1.jsx)(OTP_1.default, { value: confirmPasscode, onChange: handleConfirmPasscodeChange, numInputs: passcodeLength, otpInputType: OTP_1.OtpInputType.PASSWORD, readOnly: true }) }), error && (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.validationError), children: error }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.sessionDescription), children: stepsContent[type_1.ChangePasscodeViewStep.CONFIRM_NEW_PASSCODE].description })] }) })] }) }) }) }));
+                                }, children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.sessionTitle), children: stepsContent[type_1.ChangePasscodeViewStep.CONFIRM_NEW_PASSCODE].title }), (0, jsx_runtime_1.jsx)(xhub_keyboard_1.Label, { useBrowserInput: false, htmlFor: keyboardId, children: (0, jsx_runtime_1.jsx)(OTP_1.default, { value: confirmPasscode, onChange: handleConfirmPasscodeChange, numInputs: passcodeLength, otpInputType: OTP_1.OtpInputType.PASSWORD, readOnly: true }) }), error && (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.validationError), children: error }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.sessionDescription), children: stepsContent[type_1.ChangePasscodeViewStep.CONFIRM_NEW_PASSCODE].description })] }) })] }) }) }) }));
 };
 exports.ChangePasscodeView = ChangePasscodeView;
 exports.default = exports.ChangePasscodeView;

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

@@ -349,7 +349,7 @@ var theme = {
             textTransform: "capitalize",
         },
         listDescription: {
-            color: "text.black64",
+            color: text.black64,
             fontWeight: typography.fontWeight400,
             fontSize: typography.fontSize12,
             lineHeight: typography.leading140,

package/dist/components/TekWallet/utils/sort.utils.d.ts

@@ -1,2 +1,3 @@
 import { SortBalance } from "../components/ui/WithdrawFunction";
 export declare function sortByBalance(list: any[], sortBalance?: SortBalance): any[];
+export declare function sortByName(list: any[], sortName?: SortBalance): any[];

package/dist/components/TekWallet/utils/sort.utils.js

@@ -2,6 +2,7 @@
 /* eslint-disable @typescript-eslint/no-explicit-any */
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.sortByBalance = sortByBalance;
+exports.sortByName = sortByName;
 var WithdrawFunction_1 = require("../components/ui/WithdrawFunction");
 function sortByBalance(list, sortBalance) {
     if (sortBalance === void 0) { sortBalance = WithdrawFunction_1.SortBalance.ASC; }
@@ -12,3 +13,12 @@ function sortByBalance(list, sortBalance) {
         return list === null || list === void 0 ? void 0 : list.sort(function (a, b) { return Number(b === null || b === void 0 ? void 0 : b.balance) - Number(a === null || a === void 0 ? void 0 : a.balance); });
     }
 }
+function sortByName(list, sortName) {
+    if (sortName === void 0) { sortName = WithdrawFunction_1.SortBalance.ASC; }
+    if (sortName === WithdrawFunction_1.SortBalance.ASC) {
+        return list === null || list === void 0 ? void 0 : list.sort(function (a, b) { var _a; return (_a = a === null || a === void 0 ? void 0 : a.name) === null || _a === void 0 ? void 0 : _a.localeCompare(b === null || b === void 0 ? void 0 : b.name); });
+    }
+    else {
+        return list === null || list === void 0 ? void 0 : list.sort(function (a, b) { var _a; return (_a = b === null || b === void 0 ? void 0 : b.name) === null || _a === void 0 ? void 0 : _a.localeCompare(a === null || a === void 0 ? void 0 : a.name); });
+    }
+}

package/package.json

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