tek-wallet 0.0.806 → 0.0.808

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

@@ -1,4 +1,5 @@
 "use strict";
+"use client";
 var __assign = (this && this.__assign) || function () {
     __assign = Object.assign || function(t) {
         for (var s, i = 1, n = arguments.length; i < n; i++) {
@@ -18,7 +19,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.TIME_FILTER_LABEL = exports.TimeFilterType = void 0;
 var jsx_runtime_1 = require("react/jsx-runtime");
 var material_1 = require("@mui/material");
-var ThemeProvider_1 = require("../../../providers/ThemeProvider");
+var mui_1 = require("../../../theme/mui");
 var react_1 = require("react");
 var Text_1 = __importDefault(require("../Text"));
 var date_fns_1 = require("date-fns");
@@ -39,7 +40,7 @@ exports.TIME_FILTER_LABEL = (_a = {},
     _a);
 var TimeFilter = function (_a) {
     var _b = _a.initialValue, initialValue = _b === void 0 ? TimeFilterType.ALL : _b, onChange = _a.onChange, hideAll = _a.hideAll, sx = _a.sx;
-    var theme = (0, ThemeProvider_1.useTheme)();
+    var theme = (0, mui_1.useTheme)();
     var _c = (0, react_1.useState)({
         type: initialValue,
     }), value = _c[0], setValue = _c[1];
@@ -113,11 +114,11 @@ var TimeFilter = function (_a) {
         setValue(newData);
         onChange === null || onChange === void 0 ? void 0 : onChange(newData);
     }, []);
-    return ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g6, alignItems: "flex-start" }), sx), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
-                    color: theme.palette.text.accent2,
+    return ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign(__assign({}, theme.styleMixins.column), { gap: theme.styleMixins.gaps.g6, alignItems: "flex-start" }), sx), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
+                    color: theme.palette.text.secondary,
                     fontWeight: theme.typography.fontWeight500,
                     fontSize: theme.typography.fontSize11,
-                }, children: getTimeFilterLabel(value) }), (0, jsx_runtime_1.jsx)(material_1.ToggleButtonGroup, { defaultValue: initialValue, onChange: handleChange, sx: { gap: theme.mixins.gaps.g8 }, children: Object.values(TimeFilterType).map(function (type) {
+                }, children: getTimeFilterLabel(value) }), (0, jsx_runtime_1.jsx)(material_1.ToggleButtonGroup, { defaultValue: initialValue, onChange: handleChange, sx: { gap: theme.styleMixins.gaps.g8 }, children: Object.values(TimeFilterType).map(function (type) {
                     if (hideAll && type === TimeFilterType.ALL)
                         return null;
                     var isActive = (value === null || value === void 0 ? void 0 : value.type) === type;
@@ -128,11 +129,11 @@ var TimeFilter = function (_a) {
                                 position: "relative",
                                 textTransform: "capitalize",
                                 fontSize: theme.typography.fontSize11,
-                                borderRadius: theme.mixins.customRadius.r10,
+                                borderRadius: theme.styleMixins.customRadius.r10,
                                 borderWidth: 1,
-                                borderColor: isActive ? theme.palette.primary.main : theme.palette.border.accent3,
+                                borderColor: isActive ? theme.palette.primary.main : theme.palette.divider,
                                 backgroundColor: isActive ? theme.palette.secondary.main : "transparent",
-                                color: isActive ? theme.palette.primary.main : theme.palette.text.accent,
+                                color: isActive ? theme.palette.primary.main : theme.palette.text.secondary,
                                 fontWeight: theme.typography.fontWeight600,
                                 transition: "background 0.2s, color 0.2s, border-color 0.2s",
                                 overflow: "hidden",

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

@@ -18,5 +18,5 @@ function TimeText(_a) {
         }
         return "".concat(pad(minutes), ":").concat(pad(secs));
     };
-    return ((0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "title03", color: seconds ? "success" : "error", children: formatTime(seconds, format) }));
+    return ((0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "h3", color: seconds ? "success" : "error", children: formatTime(seconds, format) }));
 }

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

@@ -21,10 +21,10 @@ var Icon_1 = __importDefault(require("../Icon"));
 var Text_1 = __importDefault(require("../Text"));
 var Formatter_1 = __importDefault(require("../Formatter"));
 var material_1 = require("@mui/material");
-var ThemeProvider_1 = require("../../../providers/ThemeProvider");
+var mui_1 = require("../../../theme/mui");
 var user_1 = __importDefault(require("../../../store/user"));
 var TokenItem = function (props) {
-    var theme = (0, ThemeProvider_1.useTheme)();
+    var theme = (0, mui_1.useTheme)();
     var tokenData = (0, react_1.useMemo)(function () { return JSON.parse(props.tokenData); }, [props.tokenData]);
     var currency = (0, react_1.useMemo)(function () { return tokenData.currency; }, [tokenData]);
     var isShowBalance = (0, user_1.default)(function (state) { return state.settings.balance.isShowBalance; });
@@ -38,19 +38,11 @@ var TokenItem = function (props) {
     return ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: {
             display: !shouldHideSmallAsset ? "grid" : "none",
             gridTemplateColumns: "1fr auto",
-            gap: theme.mixins.gaps.g12,
-            py: theme.mixins.customPadding.p8,
-        }, children: [(0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g8 }), children: [(0, jsx_runtime_1.jsx)(Icon_1.default, { width: 20, sx: {
-                            borderRadius: theme.mixins.customRadius.full,
-                        }, src: currency.link }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { flex: 1 }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.value), children: currency.name }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.valueDescription), children: currency.full_name })] })] }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g1, justifyContent: "center", alignItems: "end" }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.value), { fontWeight: theme.typography.fontWeight700 }), children: isShowBalance ? (0, jsx_runtime_1.jsx)(Formatter_1.default, { value: balance }) : "****" }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.valueDescription), children: isShowBalance ? (0, jsx_runtime_1.jsx)(Formatter_1.default, { start: "$", value: balanceInUSD }) : "****" })] }), false && ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g1, textAlign: "right" }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.value), { color: theme.palette.text.alertStatus, fontWeight: theme.typography.fontWeight700 }), children: isShowBalance ? ((0, jsx_runtime_1.jsx)(Formatter_1.default, { value: 70000 })) : ((0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
-                                fontSize: theme.typography.fontSize14,
-                                fontWeight: theme.typography.fontWeight600,
-                                color: theme.palette.text.black,
-                            }, children: "****" })) }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.valueDescription), { color: theme.palette.text.alertStatus }), children: isShowBalance ? ((0, jsx_runtime_1.jsx)(Formatter_1.default, { value: 3.72 })) : ((0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
-                                fontSize: theme.typography.fontSize12,
-                                fontWeight: theme.typography.fontWeight600,
-                                color: theme.palette.text.accent2,
-                            }, children: "****" })) })] }))] }));
+            gap: theme.styleMixins.gaps.g12,
+            py: theme.styleMixins.customPadding.p8,
+        }, children: [(0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.styleMixins.row), { gap: theme.styleMixins.gaps.g8 }), children: [(0, jsx_runtime_1.jsx)(Icon_1.default, { width: 20, sx: {
+                            borderRadius: theme.styleMixins.customRadius.full,
+                        }, src: currency.link }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.styleMixins.column), { flex: 1 }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.styleMixins.value), children: currency.name }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.styleMixins.valueDescription), children: currency.full_name })] })] }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.styleMixins.column), { gap: theme.styleMixins.gaps.g1, justifyContent: "center", alignItems: "end" }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.styleMixins.value), { fontWeight: theme.typography.fontWeight700 }), children: isShowBalance ? (0, jsx_runtime_1.jsx)(Formatter_1.default, { value: balance }) : "****" }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.styleMixins.valueDescription), children: isShowBalance ? (0, jsx_runtime_1.jsx)(Formatter_1.default, { start: "$", value: balanceInUSD }) : "****" })] })] }));
 };
 exports.TokenItem = TokenItem;
 exports.default = exports.TokenItem;

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

@@ -32,10 +32,10 @@ var Formatter_1 = __importDefault(require("../Formatter"));
 var Text_1 = __importDefault(require("../Text"));
 var Icon_1 = __importDefault(require("../Icon"));
 var material_1 = require("@mui/material");
-var ThemeProvider_1 = require("../../../providers/ThemeProvider");
+var mui_1 = require("../../../theme/mui");
 var TokenSelection = function (props) {
     var tokenDataString = props.tokenData, sx = props.sx, onClick = props.onClick, active = props.active, rest = __rest(props, ["tokenData", "sx", "onClick", "active"]);
-    var theme = (0, ThemeProvider_1.useTheme)();
+    var theme = (0, mui_1.useTheme)();
     var tokenData = (0, react_1.useMemo)(function () { return (0, parsePropsData_1.default)(tokenDataString); }, [tokenDataString]);
     var balance = (0, react_1.useMemo)(function () {
         var _a;
@@ -47,8 +47,8 @@ var TokenSelection = function (props) {
     }, [balance, tokenData]);
     return ((0, jsx_runtime_1.jsxs)(material_1.Box, __assign({ onClick: function () { return onClick === null || onClick === void 0 ? void 0 : onClick(tokenData); }, sx: __assign({ backgroundColor: active
                 ? "".concat(theme.palette.background.tertiary)
-                : "".concat(theme.palette.background.white16), border: "1px solid", backdropFilter: "blur(12px)", borderColor: active ? "".concat(theme.palette.primary.main) : "".concat(theme.palette.border.accent3), borderRadius: theme.mixins.customRadius.r16, padding: theme.mixins.customPadding.p16, display: "flex", alignItems: "center", cursor: "pointer" }, sx) }, rest, { children: [(0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g12 }), children: [(0, jsx_runtime_1.jsx)(Icon_1.default, { width: 20, src: tokenData === null || tokenData === void 0 ? void 0 : tokenData.link, sx: {
-                            borderRadius: theme.mixins.customRadius.full,
-                        } }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g2 }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.value), { whiteSpace: "nowrap" }), 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: "~ $" }) })] })] })));
+                : "".concat(theme.palette.background.default), border: "1px solid", backdropFilter: "blur(12px)", borderColor: active ? "".concat(theme.palette.primary.main) : "".concat(theme.palette.divider), borderRadius: theme.styleMixins.customRadius.r16, padding: theme.styleMixins.customPadding.p16, display: "flex", alignItems: "center", cursor: "pointer" }, sx) }, rest, { children: [(0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.styleMixins.row), { gap: theme.styleMixins.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.styleMixins.customRadius.full,
+                        } }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.styleMixins.column), { gap: theme.styleMixins.gaps.g2 }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.styleMixins.value), { whiteSpace: "nowrap" }), children: tokenData === null || tokenData === void 0 ? void 0 : tokenData.name }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: theme.styleMixins.valueDescription, children: tokenData === null || tokenData === void 0 ? void 0 : tokenData.full_name })] })] }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.styleMixins.column), { marginLeft: "auto", alignItems: "end", gap: theme.styleMixins.gaps.g2 }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: theme.styleMixins.value, children: (0, jsx_runtime_1.jsx)(Formatter_1.default, { value: balance }) }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.styleMixins.valueDescription), { color: theme.palette.text.secondary }), children: (0, jsx_runtime_1.jsx)(Formatter_1.default, { value: balanceInUSD, start: "~ $" }) })] })] })));
 };
 exports.default = TokenSelection;

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

@@ -20,37 +20,37 @@ var Text_1 = __importDefault(require("../Text"));
 var CheckBoxComponent_1 = __importDefault(require("../CheckBoxComponent"));
 var TokenItem_1 = __importDefault(require("../TokenItem"));
 var material_1 = require("@mui/material");
-var ThemeProvider_1 = require("../../../providers/ThemeProvider");
+var mui_1 = require("../../../theme/mui");
 var WaitingData_1 = __importDefault(require("../WaitingData"));
 var react_1 = require("react");
 var TokensBoard = function () {
     var tokens = (0, useWalletData_1.default)().tokens;
-    var theme = (0, ThemeProvider_1.useTheme)();
+    var theme = (0, mui_1.useTheme)();
     var _a = (0, react_1.useState)(false), showSmallAssets = _a[0], setShowSmallAssets = _a[1];
     var toggleDisplay = function () {
         setShowSmallAssets(!showSmallAssets);
     };
     return ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: {
-        // ...theme.mixins.paper,
+        // ...theme.styleMixins.paper,
         // backgroundColor: "background.white",
         // boxShadow: theme.shadows[1],
-        }, children: [(0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g12, my: theme.mixins.customMargin.m4 }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.headerTitle), { pb: theme.mixins.customPadding.p8 }), children: "Asset management" }), false && ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g2, ml: "auto" }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
-                                    // ...theme.mixins.valueDescription
+        }, children: [(0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.styleMixins.row), { gap: theme.styleMixins.gaps.g12, my: theme.styleMixins.customMargin.m4 }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.styleMixins.headerTitle), { pb: theme.styleMixins.customPadding.p8 }), children: "Asset management" }), false && ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.styleMixins.row), { gap: theme.styleMixins.gaps.g2, ml: "auto" }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
+                                    // ...theme.styleMixins.valueDescription
                                     fontSize: theme.typography.fontSize12,
                                     fontWeight: theme.typography.fontWeight600,
-                                    color: theme.palette.text.accent2,
+                                    color: theme.palette.text.secondary,
                                 }, children: "Hide small assets" }), (0, jsx_runtime_1.jsx)(CheckBoxComponent_1.default, { sx: {
                                     width: "1.5rem",
                                     height: "1.5rem",
                                     "& .MuiSvgIcon-root": {
-                                        color: theme.palette.text.accent,
+                                        color: theme.palette.text.secondary,
                                     },
                                 }, onClick: toggleDisplay })] }))] }), (0, jsx_runtime_1.jsx)(material_1.Divider, { sx: {
-                    borderColor: theme.palette.border.accent3,
-                } }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g12, mt: theme.mixins.customMargin.m8, pt: theme.mixins.customPadding.p8, minHeight: !tokens ? "20rem" : "unset" }), children: [!!tokens && ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: {
+                    borderColor: theme.palette.divider,
+                } }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.styleMixins.column), { gap: theme.styleMixins.gaps.g12, mt: theme.styleMixins.customMargin.m8, pt: theme.styleMixins.customPadding.p8, minHeight: !tokens ? "20rem" : "unset" }), children: [!!tokens && ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: {
                             display: "grid",
                             gridTemplateColumns: "1fr auto",
-                            gap: theme.mixins.gaps.g12,
+                            gap: theme.styleMixins.gaps.g12,
                             fontSize: theme.typography.fontSize11,
                             color: "text.white",
                             lineHeight: theme.typography.leading140,
@@ -58,12 +58,12 @@ var TokensBoard = function () {
                                     textAlign: "left",
                                     fontSize: theme.typography.fontSize14,
                                     fontWeight: theme.typography.fontWeight600,
-                                    color: theme.palette.text.accent2,
+                                    color: theme.palette.text.secondary,
                                 }, children: "Token" }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
                                     textAlign: "left",
                                     fontSize: theme.typography.fontSize14,
                                     fontWeight: theme.typography.fontWeight600,
-                                    color: theme.palette.text.accent2,
+                                    color: theme.palette.text.secondary,
                                 }, children: "Balance" })] })), tokens === null || tokens === void 0 ? void 0 : tokens.map(function (item) {
                         var stringifiedTokenData = JSON.stringify(__assign({}, item));
                         return ((0, jsx_runtime_1.jsx)(TokenItem_1.default, { showSmallAssets: showSmallAssets, tokenData: stringifiedTokenData }, item.id));

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

@@ -99,7 +99,7 @@ var validate_wallet_address_service_1 = __importDefault(require("../../../servic
 var type_2 = require("../../../services/axios/validate-wallet-address-service/type");
 var ConfirmByPasscode_1 = __importDefault(require("../ConfirmByPasscode"));
 var instructions_service_1 = __importDefault(require("../../../services/axios/instructions-service"));
-var providers_1 = require("../../../providers");
+var mui_1 = require("../../../theme/mui");
 var useWallet_1 = __importDefault(require("../../../hooks/useWallet"));
 var TransferConfirmationError;
 (function (TransferConfirmationError) {
@@ -111,7 +111,7 @@ var TransferConfirmationError;
 })(TransferConfirmationError || (exports.TransferConfirmationError = TransferConfirmationError = {}));
 exports.TransferConfirmation = (0, react_1.forwardRef)(function (props, ref) {
     var _a, _b;
-    var theme = (0, providers_1.useTheme)();
+    var theme = (0, mui_1.useTheme)();
     var transferData = props.transferData, transferContent = props.transferContent;
     var _c = (0, useWallet_1.default)(), isInitPasscode = _c.isInitPasscode, sendInternalTokens = _c.sendInternalTokens, updateSendInternalToken = _c.updateSendInternalToken;
     var confirmLayoutDrawerRef = (0, react_1.useRef)(null);
@@ -247,7 +247,7 @@ exports.TransferConfirmation = (0, react_1.forwardRef)(function (props, ref) {
                     ? DrawerComponent_1.DRAWER_TRIGGER_STATUS.DISABLED
                     : DrawerComponent_1.DRAWER_TRIGGER_STATUS.ENABLED, children: (0, jsx_runtime_1.jsx)(Button_1.default.Primary, { status: !!error || isValidatingAddress || errorAddress || !isEnoughBalance
                         ? Button_1.BUTTON_STATUS.DISABLED
-                        : buttonStatus, sx: { width: "100%" }, 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) })] })), !!errorAddress && ((0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.validationError), { mt: (_b = theme.mixins.gaps) === null || _b === void 0 ? void 0 : _b.g6 }), children: errorAddress }))] }) }));
+                        : buttonStatus, sx: { width: "100%" }, children: "Confirm" }) }), children: [transferContent, !!error && ((0, jsx_runtime_1.jsxs)(Text_1.default, { sx: __assign(__assign({}, theme.styleMixins.validationError), { mt: (_a = theme.styleMixins.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) })] })), !!errorAddress && ((0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.styleMixins.validationError), { mt: (_b = theme.styleMixins.gaps) === null || _b === void 0 ? void 0 : _b.g6 }), children: errorAddress }))] }) }));
 });
 exports.TransferConfirmation.displayName = "TransferConfirmation";
 exports.default = exports.TransferConfirmation;

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

@@ -99,7 +99,7 @@ var useWithdrawData_1 = __importDefault(require("../../../hooks/useWithdrawData"
 var send_internal_service_1 = __importDefault(require("../../../services/axios/send-internal-service"));
 var validate_wallet_address_service_1 = __importDefault(require("../../../services/axios/validate-wallet-address-service"));
 var type_2 = require("../../../services/axios/validate-wallet-address-service/type");
-var ThemeProvider_1 = require("../../../providers/ThemeProvider");
+var mui_1 = require("../../../theme/mui");
 var TransferError;
 (function (TransferError) {
     TransferError["TOKEN_NOT_FOUND"] = "Token not found";
@@ -110,7 +110,7 @@ var TransferError;
 })(TransferError || (exports.TransferError = TransferError = {}));
 exports.TransferInternal = (0, react_1.forwardRef)(function (props, ref) {
     var _a;
-    var theme = (0, ThemeProvider_1.useTheme)();
+    var theme = (0, mui_1.useTheme)();
     var transferData = props.transferData, transferContent = props.transferContent;
     var _b = (0, useWithdrawData_1.default)(), sendInternalTokens = _b.sendInternalTokens, updateSendInternalToken = _b.updateSendInternalToken;
     var isInitPasscode = (0, useWalletData_1.default)().isInitPasscode;
@@ -238,7 +238,7 @@ exports.TransferInternal = (0, react_1.forwardRef)(function (props, ref) {
                         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) })] }))] }) }));
+                        : buttonStatus, fullWidth: true, children: "Confirm" }) }), children: [transferContent, !!error && ((0, jsx_runtime_1.jsxs)(Text_1.default, { sx: __assign(__assign({}, theme.styleMixins.validationError), { mt: (_a = theme.styleMixins.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) })] }))] }) }));
 });
 exports.TransferInternal.displayName = "TransferInternal";
 exports.default = exports.TransferInternal;

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

@@ -87,7 +87,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.UpdateLockToken = exports.UpdateLockTokenError = void 0;
 var jsx_runtime_1 = require("react/jsx-runtime");
 var material_1 = require("@mui/material");
-var ThemeProvider_1 = require("../../../providers/ThemeProvider");
+var mui_1 = require("../../../theme/mui");
 var Button_1 = __importStar(require("../Button"));
 var ConfirmLayout_1 = __importDefault(require("../ConfirmLayout"));
 var LineValue_1 = __importDefault(require("../LineValue"));
@@ -110,7 +110,7 @@ var UpdateLockTokenError;
 })(UpdateLockTokenError || (exports.UpdateLockTokenError = UpdateLockTokenError = {}));
 exports.UpdateLockToken = (0, react_1.forwardRef)(function (props, ref) {
     var _a;
-    var theme = (0, ThemeProvider_1.useTheme)();
+    var theme = (0, mui_1.useTheme)();
     var _b = (0, useLockTokenData_1.default)(), lockedTokens = _b.lockedTokens, lockTokens = _b.lockTokens, updateLockedToken = _b.updateLockedToken;
     var isInitPasscode = (0, useWalletData_1.default)().isInitPasscode;
     var confirmLayoutDrawerRef = (0, react_1.useRef)(null);
@@ -213,10 +213,10 @@ exports.UpdateLockToken = (0, react_1.forwardRef)(function (props, ref) {
             return;
         updateLockedToken();
     }, [isInitPasscode, lockedTokens]);
-    return ((0, jsx_runtime_1.jsx)(RequireConnect_1.default, { children: (0, jsx_runtime_1.jsx)(ConfirmLayout_1.default, { ref: confirmLayoutDrawerRef, action: action, trigger: props.children, 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)(material_1.Box, { sx: __assign({}, theme.mixins.paper), children: (0, jsx_runtime_1.jsx)(LineValue_1.default, { field: "Amount", value: (0, jsx_runtime_1.jsx)(Formatter_1.default, { value: props.lockData.locked_amount, unit: " ".concat(token === null || token === void 0 ? void 0 : token.name) }) }) }), (0, jsx_runtime_1.jsxs)(Text_1.default, { sx: __assign({}, theme.mixins.value), children: ["Your balance is", " ", (0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
+    return ((0, jsx_runtime_1.jsx)(RequireConnect_1.default, { children: (0, jsx_runtime_1.jsx)(ConfirmLayout_1.default, { ref: confirmLayoutDrawerRef, action: action, trigger: props.children, children: (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.styleMixins.column), { gap: theme.styleMixins.gaps.g12 }), children: [(0, jsx_runtime_1.jsx)(material_1.Box, { sx: __assign({}, theme.styleMixins.paper), children: (0, jsx_runtime_1.jsx)(LineValue_1.default, { field: "Amount", value: (0, jsx_runtime_1.jsx)(Formatter_1.default, { value: props.lockData.locked_amount, unit: " ".concat(token === null || token === void 0 ? void 0 : token.name) }) }) }), (0, jsx_runtime_1.jsxs)(Text_1.default, { sx: __assign({}, theme.styleMixins.value), children: ["Your balance is", " ", (0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
                                     fontWeight: theme.typography.fontWeight600,
                                     color: theme.palette.text.secondary,
-                                }, children: (0, jsx_runtime_1.jsx)(Formatter_1.default, { value: token === null || token === void 0 ? void 0 : token.balance, unit: " ".concat(token === null || token === void 0 ? void 0 : token.name) }) })] }), !!error && ((0, jsx_runtime_1.jsxs)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.validationError), { mt: theme.mixins.gaps.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) })] })), (0, jsx_runtime_1.jsx)(ConfirmByPasscode_1.default, { action: action, onConfirmSuccess: handleLockToken, children: (0, jsx_runtime_1.jsx)(Button_1.default.Primary, { status: !!error ? Button_1.BUTTON_STATUS.DISABLED : buttonStatus, sx: { width: "100%" }, children: "Confirm" }) })] }) }) }));
+                                }, children: (0, jsx_runtime_1.jsx)(Formatter_1.default, { value: token === null || token === void 0 ? void 0 : token.balance, unit: " ".concat(token === null || token === void 0 ? void 0 : token.name) }) })] }), !!error && ((0, jsx_runtime_1.jsxs)(Text_1.default, { sx: __assign(__assign({}, theme.styleMixins.validationError), { mt: theme.styleMixins.gaps.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) })] })), (0, jsx_runtime_1.jsx)(ConfirmByPasscode_1.default, { action: action, onConfirmSuccess: handleLockToken, children: (0, jsx_runtime_1.jsx)(Button_1.default.Primary, { status: !!error ? Button_1.BUTTON_STATUS.DISABLED : buttonStatus, sx: { width: "100%" }, children: "Confirm" }) })] }) }) }));
 });
 exports.UpdateLockToken.displayName = "UpdateLockToken";
 exports.default = exports.UpdateLockToken;

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

@@ -8,22 +8,22 @@ var jsx_runtime_1 = require("react/jsx-runtime");
 var getImage_1 = __importDefault(require("../../../utils/getImage"));
 var Text_1 = __importDefault(require("../Text"));
 var material_1 = require("@mui/material");
-var ThemeProvider_1 = require("../../../providers/ThemeProvider");
+var mui_1 = require("../../../theme/mui");
 function UserInfo(_a) {
     var _b;
     var user = _a.user, rightPart = _a.rightPart;
-    var theme = (0, ThemeProvider_1.useTheme)();
+    var theme = (0, mui_1.useTheme)();
     if (!user)
         return "loading...";
     return ((0, jsx_runtime_1.jsxs)(material_1.Box, { className: "flex items-center justify-between", children: [(0, jsx_runtime_1.jsxs)(material_1.Box, { className: "flex gap-3 items-center", children: [(0, jsx_runtime_1.jsx)(material_1.Avatar, { src: (_b = user.avatar) !== null && _b !== void 0 ? _b : (0, getImage_1.default)("default-ava", "png"), sx: {
                             width: 24,
                             height: 24,
                         } }), (0, jsx_runtime_1.jsxs)(material_1.Box, { className: "flex flex-col", children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
-                                    color: theme.palette.background.white,
+                                    color: theme.palette.background.default,
                                     fontWeight: theme.typography.fontWeight500,
                                     fontSize: theme.typography.fontSize13,
                                 }, children: user.nick_name }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
-                                    color: theme.palette.text.accent,
+                                    color: theme.palette.text.secondary,
                                     fontWeight: theme.typography.fontWeight500,
                                     fontSize: theme.typography.fontSize11,
                                 }, children: user.user_name })] })] }), rightPart] }));

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

@@ -13,39 +13,40 @@ var __assign = (this && this.__assign) || function () {
 Object.defineProperty(exports, "__esModule", { value: true });
 var jsx_runtime_1 = require("react/jsx-runtime");
 var material_1 = require("@mui/material");
-var providers_1 = require("../../../providers");
+var mui_1 = require("../../../theme/mui");
+var getContractColor_1 = require("../../../utils/getContractColor");
 var WaitingData = function (props) {
-    var theme = (0, providers_1.useTheme)();
+    var theme = (0, mui_1.useTheme)();
     var sx = props.sx, _a = props.numberOfSkeleton, numberOfSkeleton = _a === void 0 ? 5 : _a;
-    return ((0, jsx_runtime_1.jsx)(material_1.Box, { sx: __assign({ display: "flex", alignItems: "center", justifyContent: "center", flexDirection: "column", gap: theme.mixins.gaps.g12, width: "100%", height: "fit-content" }, sx), children: Array.from({ length: numberOfSkeleton }).map(function (_, index) { return ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: {
-                backgroundColor: theme.palette.background.white16,
+    return ((0, jsx_runtime_1.jsx)(material_1.Box, { sx: __assign({ display: "flex", alignItems: "center", justifyContent: "center", flexDirection: "column", gap: theme.styleMixins.gaps.g12, width: "100%", height: "fit-content" }, sx), children: Array.from({ length: numberOfSkeleton }).map(function (_, index) { return ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: {
+                backgroundColor: (0, material_1.alpha)(theme.palette.background.default, 0.1),
                 backdropFilter: "blur(12px)",
-                borderRadius: theme.mixins.customRadius.r16,
+                borderRadius: theme.styleMixins.customRadius.r16,
                 display: "flex",
                 alignItems: "center",
                 justifyContent: "center",
-                boxShadow: "1px 1px 4px 3px rgba(0, 0, 0, 0.03)",
+                boxShadow: "1px 1px 4px 3px ".concat((0, material_1.alpha)((0, getContractColor_1.getContrastingColor)(theme.palette.background.default), 0.03)),
                 width: "100%",
-                gap: theme.mixins.gaps.g12,
-                padding: theme.mixins.customPadding.p12,
+                gap: theme.styleMixins.gaps.g12,
+                padding: theme.styleMixins.customPadding.p12,
             }, children: [(0, jsx_runtime_1.jsx)(material_1.Skeleton, { variant: "rectangular", sx: {
                         aspectRatio: 1,
                         height: "auto",
                         width: "2.5rem",
                         borderRadius: "999px",
                         opacity: 0.7,
-                    }, animation: "wave" }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g6, flex: 1 }), children: [(0, jsx_runtime_1.jsx)(material_1.Skeleton, { variant: "rectangular", width: "70%", sx: {
+                    }, animation: "wave" }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.styleMixins.column), { gap: theme.styleMixins.gaps.g6, flex: 1 }), children: [(0, jsx_runtime_1.jsx)(material_1.Skeleton, { variant: "rectangular", width: "70%", sx: {
                                 height: "1.4rem",
                                 opacity: 0.7,
-                                borderRadius: theme.mixins.customRadius.r12,
+                                borderRadius: theme.styleMixins.customRadius.r12,
                             }, animation: "wave" }), (0, jsx_runtime_1.jsx)(material_1.Skeleton, { variant: "rectangular", width: "80%", sx: {
                                 height: "1.2rem",
                                 opacity: 0.7,
-                                borderRadius: theme.mixins.customRadius.r12,
+                                borderRadius: theme.styleMixins.customRadius.r12,
                             }, animation: "wave" })] }), (0, jsx_runtime_1.jsx)(material_1.Skeleton, { variant: "rectangular", sx: {
                         height: "1.7rem",
                         width: "4rem",
-                        borderRadius: theme.mixins.customRadius.r12,
+                        borderRadius: theme.styleMixins.customRadius.r12,
                         opacity: 0.7,
                     }, animation: "wave" })] }, index)); }) }));
 };

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

@@ -6,39 +6,39 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.default = SelectToken;
 var jsx_runtime_1 = require("react/jsx-runtime");
 var material_1 = require("@mui/material");
-var providers_1 = require("../../../../providers");
 var Column_1 = __importDefault(require("../../Column"));
 var sortByToken_1 = __importDefault(require("./sortByToken"));
 var sortByBalance_1 = __importDefault(require("./sortByBalance"));
 var __1 = require("..");
 var TokenSelection_1 = __importDefault(require("../../TokenSelection"));
 var SvgPath_1 = require("../../SvgPath");
+var mui_1 = require("../../../../theme/mui");
 function SelectToken(props) {
-    var theme = (0, providers_1.useTheme)();
+    var theme = (0, mui_1.useTheme)();
     var sortToken = props.sortToken, setSortToken = props.setSortToken, sortBalance = props.sortBalance, setSortBalance = props.setSortBalance, withdrawToken = props.withdrawToken, selectedToken = props.selectedToken, handleSelectToken = props.handleSelectToken;
     return ((0, jsx_runtime_1.jsxs)(Column_1.default, { sx: {
-            gap: theme.mixins.gaps.g12,
+            gap: theme.styleMixins.gaps.g12,
             height: "fit-content",
         }, 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)(material_1.SvgIcon, { inheritViewBox: true, sx: {
                             width: 20,
                             height: 20,
                             transition: "opacity 0.2s ease-in-out",
                         }, children: SvgPath_1.IC_SEARCH }) }), placeholder: "Search", className: "w-full flex items-center py-1 px-2", sx: {
-                    borderRadius: theme.mixins.customRadius.r12,
+                    borderRadius: theme.styleMixins.customRadius.r12,
                     border: "1px solid",
-                    borderColor: theme.palette.border.accent3,
-                    background: theme.palette.background.white,
-                    color: theme.palette.text.black,
+                    borderColor: theme.palette.divider,
+                    background: theme.palette.background.default,
+                    color: theme.palette.text.primary,
                     "input::placeholder": {
                         fontSize: theme.typography.fontSize11,
-                        pl: theme.mixins.customPadding.p4,
+                        pl: theme.styleMixins.customPadding.p4,
                         fontWeight: theme.typography.fontWeight500,
-                        color: theme.palette.text.black,
+                        color: theme.palette.text.primary,
                     },
                 } }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: {
-                    display: theme.mixins.row,
+                    display: theme.styleMixins.row,
                     justifyContent: "space-between",
-                    mt: theme.mixins.customMargin.m16,
+                    mt: theme.styleMixins.customMargin.m16,
                 }, children: [(0, jsx_runtime_1.jsx)(sortByToken_1.default, { sortToken: sortToken || __1.SortToken.ASC, setSortToken: setSortToken || (function () { }) }), (0, jsx_runtime_1.jsx)(sortByBalance_1.default, { sortBalance: sortBalance || __1.SortBalance.ASC, setSortBalance: setSortBalance || (function () { }) })] }), withdrawToken === null || withdrawToken === void 0 ? void 0 : withdrawToken.map(function (item) {
                 var stringifiedTokenData = JSON.stringify(item);
                 if (!item)

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

@@ -92,17 +92,17 @@ var Formatter_1 = __importDefault(require("../../Formatter"));
 var Fees_1 = __importStar(require("../../Fees"));
 var SvgPath_1 = require("../../SvgPath");
 var Text_1 = __importDefault(require("../../Text"));
-var providers_1 = require("../../../../providers");
 var react_1 = require("react");
 var TransferInternal_1 = __importDefault(require("../../TransferInternal"));
 var type_1 = require("../../../../services/axios/get-activities-service/type");
 var Column_1 = __importDefault(require("../../Column"));
 var infoSummary_1 = __importDefault(require("./summary/infoSummary"));
 var __1 = require("..");
+var mui_1 = require("../../../../theme/mui");
 function SendForm(props) {
     var _this = this;
     var _a, _b, _c;
-    var theme = (0, providers_1.useTheme)();
+    var theme = (0, mui_1.useTheme)();
     var setRecipientAddress = props.setRecipientAddress, setRecipientAddressError = props.setRecipientAddressError;
     var inputAddressRef = (0, react_1.useRef)(null);
     var handlePaste = function () { return __awaiter(_this, void 0, void 0, function () {
@@ -119,70 +119,70 @@ function SendForm(props) {
         });
     }); };
     var recipientAddress = props.recipientAddress, estimateFee = props.estimateFee, estimateReceive = props.estimateReceive, isLoadingEstimateFee = props.isLoadingEstimateFee, comment = props.comment, amountError = props.amountError, amountErrorMessage = props.amountErrorMessage, hiddenError = props.hiddenError, selectedMethod = props.selectedMethod, memo = props.memo, recipientAddressError = props.recipientAddressError, selectedToken = props.selectedToken, amount = props.amount, handleChangeRecipientAddress = props.handleChangeRecipientAddress, handleClearRecipientAddress = props.handleClearRecipientAddress, handleChangeAmount = props.handleChangeAmount, handleClickMaxAmount = props.handleClickMaxAmount, handleChangeMemo = props.handleChangeMemo, openScannerAddressQrCode = props.openScannerAddressQrCode, handleChangeComment = props.handleChangeComment;
-    return ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g16 }), children: [(0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g8 }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
+    return ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.styleMixins.column), { gap: theme.styleMixins.gaps.g16 }), children: [(0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.styleMixins.column), { gap: theme.styleMixins.gaps.g8 }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
                             fontSize: theme.typography.fontSize14,
-                            color: theme.palette.text.black,
+                            color: theme.palette.text.primary,
                             fontWeight: theme.typography.fontWeight700,
                         }, children: "Wallet address" }), (0, jsx_runtime_1.jsx)(Input_1.default, { ref: inputAddressRef, sx: {
-                            paddingRight: theme.mixins.customPadding.p12,
-                            borderRadius: theme.mixins.customRadius.r8,
+                            paddingRight: theme.styleMixins.customPadding.p12,
+                            borderRadius: theme.styleMixins.customRadius.r8,
                             border: "1px solid",
-                            borderColor: theme.palette.border.primary,
-                            background: theme.palette.background.white,
-                            color: theme.palette.text.black,
+                            borderColor: theme.palette.divider,
+                            background: theme.palette.background.default,
+                            color: theme.palette.text.primary,
                         }, inputRest: {
                             placeholder: "Enter recipient address",
                             value: recipientAddress,
                             onChange: handleChangeRecipientAddress,
                             hiddenLabel: true,
-                        }, rightPart: (0, jsx_runtime_1.jsx)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g8 }), children: !!recipientAddress ? ((0, jsx_runtime_1.jsx)(material_1.Box, { onClick: handleClearRecipientAddress, sx: __assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g8, cursor: "pointer" }), children: (0, jsx_runtime_1.jsx)(material_1.SvgIcon, { sx: { width: 12, height: 12 }, children: SvgPath_1.IC_CLOSE }) })) : ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g8 }), children: [(0, jsx_runtime_1.jsx)(material_1.Box, { onClick: openScannerAddressQrCode, children: (0, jsx_runtime_1.jsx)(material_1.SvgIcon, { sx: { width: 18, height: 18 }, children: SvgPath_1.IC_SCAN }) }), (0, jsx_runtime_1.jsx)(material_1.Divider, { orientation: "vertical", variant: "fullWidth", flexItem: true }), (0, jsx_runtime_1.jsx)(material_1.Box, { onClick: handlePaste, children: (0, jsx_runtime_1.jsx)(material_1.SvgIcon, { sx: { width: 18, height: 18 }, children: SvgPath_1.IC_DOCUMENTS }) })] })) }) }), !!recipientAddressError && ((0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.validationError), children: recipientAddressError }))] }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g8 }), children: [(0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g8, alignItems: "center", justifyContent: "space-between" }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
+                        }, rightPart: (0, jsx_runtime_1.jsx)(material_1.Box, { sx: __assign(__assign({}, theme.styleMixins.row), { gap: theme.styleMixins.gaps.g8 }), children: !!recipientAddress ? ((0, jsx_runtime_1.jsx)(material_1.Box, { onClick: handleClearRecipientAddress, sx: __assign(__assign({}, theme.styleMixins.row), { gap: theme.styleMixins.gaps.g8, cursor: "pointer" }), children: (0, jsx_runtime_1.jsx)(material_1.SvgIcon, { sx: { width: 12, height: 12 }, children: SvgPath_1.IC_CLOSE }) })) : ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.styleMixins.row), { gap: theme.styleMixins.gaps.g8 }), children: [(0, jsx_runtime_1.jsx)(material_1.Box, { onClick: openScannerAddressQrCode, children: (0, jsx_runtime_1.jsx)(material_1.SvgIcon, { sx: { width: 18, height: 18 }, children: SvgPath_1.IC_SCAN }) }), (0, jsx_runtime_1.jsx)(material_1.Divider, { orientation: "vertical", variant: "fullWidth", flexItem: true }), (0, jsx_runtime_1.jsx)(material_1.Box, { onClick: handlePaste, children: (0, jsx_runtime_1.jsx)(material_1.SvgIcon, { sx: { width: 18, height: 18 }, children: SvgPath_1.IC_DOCUMENTS }) })] })) }) }), !!recipientAddressError && ((0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.styleMixins.validationError), children: recipientAddressError }))] }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.styleMixins.column), { gap: theme.styleMixins.gaps.g8 }), children: [(0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.styleMixins.row), { gap: theme.styleMixins.gaps.g8, alignItems: "center", justifyContent: "space-between" }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
                                     fontSize: theme.typography.fontSize14,
-                                    color: theme.palette.text.black,
+                                    color: theme.palette.text.primary,
                                     fontWeight: theme.typography.fontWeight700,
-                                }, children: "Withdrawal amount" }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g8, alignItems: "center" }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.value), { fontSize: theme.typography.fontSize11, color: theme.palette.text.accent }), children: "Your balance " }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.value), { fontSize: theme.typography.fontSize12, color: theme.palette.text.black }), children: (0, jsx_runtime_1.jsx)(Formatter_1.default, { value: selectedToken === null || selectedToken === void 0 ? void 0 : selectedToken.balance, unit: " ".concat(selectedToken === null || selectedToken === void 0 ? void 0 : selectedToken.name) }) })] })] }), (0, jsx_runtime_1.jsx)(Input_1.default, { sx: {
-                            paddingRight: theme.mixins.customPadding.p4,
-                            borderRadius: theme.mixins.customRadius.r8,
+                                }, children: "Withdrawal amount" }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.styleMixins.row), { gap: theme.styleMixins.gaps.g8, alignItems: "center" }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.styleMixins.value), { fontSize: theme.typography.fontSize11, color: theme.palette.text.secondary }), children: "Your balance " }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.styleMixins.value), { fontSize: theme.typography.fontSize12, color: theme.palette.text.primary }), children: (0, jsx_runtime_1.jsx)(Formatter_1.default, { value: selectedToken === null || selectedToken === void 0 ? void 0 : selectedToken.balance, unit: " ".concat(selectedToken === null || selectedToken === void 0 ? void 0 : selectedToken.name) }) })] })] }), (0, jsx_runtime_1.jsx)(Input_1.default, { sx: {
+                            paddingRight: theme.styleMixins.customPadding.p4,
+                            borderRadius: theme.styleMixins.customRadius.r8,
                             border: "1px solid",
-                            borderColor: theme.palette.border.primary,
-                            background: theme.palette.background.white,
-                            color: theme.palette.text.black,
+                            borderColor: theme.palette.divider,
+                            background: theme.palette.background.default,
+                            color: theme.palette.text.primary,
                         }, inputRest: {
                             placeholder: "".concat(selectedToken === null || selectedToken === void 0 ? void 0 : selectedToken.min_value, " - ").concat(selectedToken === null || selectedToken === void 0 ? void 0 : selectedToken.max_value),
                             value: amount,
                             onChange: handleChangeAmount,
                             hiddenLabel: true,
                             inputMode: "decimal",
-                        }, rightPart: (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.value), children: selectedToken === null || selectedToken === void 0 ? void 0 : selectedToken.name }), (0, jsx_runtime_1.jsx)(material_1.Box, { onClick: handleClickMaxAmount, sx: {
+                        }, rightPart: (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.styleMixins.row), { gap: theme.styleMixins.gaps.g8 }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.styleMixins.value), children: selectedToken === null || selectedToken === void 0 ? void 0 : selectedToken.name }), (0, jsx_runtime_1.jsx)(material_1.Box, { onClick: handleClickMaxAmount, sx: {
                                         background: theme.palette.background.tertiary,
-                                        color: theme.palette.text.black,
+                                        color: theme.palette.text.primary,
                                         fontSize: theme.typography.fontSize11,
                                         fontWeight: theme.typography.fontWeight700,
-                                        borderRadius: theme.mixins.customRadius.r4,
-                                        paddingX: theme.mixins.customPadding.p16,
-                                        paddingY: theme.mixins.customPadding.p8,
+                                        borderRadius: theme.styleMixins.customRadius.r4,
+                                        paddingX: theme.styleMixins.customPadding.p16,
+                                        paddingY: theme.styleMixins.customPadding.p8,
                                         border: "0px solid",
                                         cursor: "pointer",
                                     }, children: (0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
                                             fontSize: theme.typography.fontSize12,
                                             color: theme.palette.text.primary,
                                             fontWeight: theme.typography.fontWeight500,
-                                        }, children: "Max" }) })] }) }), !!amountError && !hiddenError && ((0, jsx_runtime_1.jsxs)(Text_1.default, { sx: __assign({}, theme.mixins.validationError), children: [amountErrorMessage, " ", (0, jsx_runtime_1.jsx)(Formatter_1.default, { value: amountError, unit: " ".concat(selectedToken === null || selectedToken === void 0 ? void 0 : selectedToken.name) })] }))] }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g8 }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
+                                        }, children: "Max" }) })] }) }), !!amountError && !hiddenError && ((0, jsx_runtime_1.jsxs)(Text_1.default, { sx: __assign({}, theme.styleMixins.validationError), children: [amountErrorMessage, " ", (0, jsx_runtime_1.jsx)(Formatter_1.default, { value: amountError, unit: " ".concat(selectedToken === null || selectedToken === void 0 ? void 0 : selectedToken.name) })] }))] }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.styleMixins.column), { gap: theme.styleMixins.gaps.g8 }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
                             fontSize: theme.typography.fontSize14,
-                            color: theme.palette.text.black,
+                            color: theme.palette.text.primary,
                             fontWeight: theme.typography.fontWeight700,
                         }, children: "Comment" }), (0, jsx_runtime_1.jsx)(Input_1.default, { sx: {
-                            paddingRight: theme.mixins.customPadding.p12,
-                            borderRadius: theme.mixins.customRadius.r8,
+                            paddingRight: theme.styleMixins.customPadding.p12,
+                            borderRadius: theme.styleMixins.customRadius.r8,
                             border: "1px solid",
-                            borderColor: theme.palette.border.primary,
-                            background: theme.palette.background.white,
-                            color: theme.palette.text.black,
+                            borderColor: theme.palette.divider,
+                            background: theme.palette.background.default,
+                            color: theme.palette.text.primary,
                         }, inputRest: {
                             placeholder: "Enter comment if needed",
                             value: comment,
                             onChange: handleChangeComment,
                             hiddenLabel: true,
-                        } }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.validationDescription), children: "Enter comment if your receiving platform requires one to avoid losing your funds." })] }), selectedMethod === __1.SendMethods.TRANSFER_EXTERNAL && ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g8 }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.fieldTitle), children: "Memo" }), (0, jsx_runtime_1.jsx)(Input_1.default, { inputRest: {
+                        } }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.styleMixins.validationDescription), children: "Enter comment if your receiving platform requires one to avoid losing your funds." })] }), selectedMethod === __1.SendMethods.TRANSFER_EXTERNAL && ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.styleMixins.column), { gap: theme.styleMixins.gaps.g8 }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.styleMixins.fieldTitle), children: "Memo" }), (0, jsx_runtime_1.jsx)(Input_1.default, { inputRest: {
                             placeholder: "Enter memo",
                             value: memo,
                             onChange: handleChangeMemo,

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

@@ -19,11 +19,11 @@ var jsx_runtime_1 = require("react/jsx-runtime");
 var material_1 = require("@mui/material");
 var Text_1 = __importDefault(require("../../Text"));
 var SvgPath_1 = require("../../SvgPath");
-var ThemeProvider_1 = require("../../../../providers/ThemeProvider");
+var mui_1 = require("../../../../theme/mui");
 var __1 = require("..");
 function SortByBalance(props) {
     var sortBalance = props.sortBalance, setSortBalance = props.setSortBalance;
-    var theme = (0, ThemeProvider_1.useTheme)();
+    var theme = (0, mui_1.useTheme)();
     return ((0, jsx_runtime_1.jsxs)(material_1.Stack, { direction: "row", alignItems: "center", gap: 0.5, onClick: function () {
             if (sortBalance === __1.SortBalance.ASC) {
                 setSortBalance(__1.SortBalance.DESC);
@@ -31,7 +31,7 @@ function SortByBalance(props) {
             else {
                 setSortBalance(__1.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.styleMixins.valueDescription), { color: theme.palette.text.secondary, 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: {
                             width: 8,
                             height: 5,
                             transition: "opacity 0.2s ease-in-out",