tek-wallet 0.0.636 → 0.0.638

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

@@ -0,0 +1,10 @@
+import React from "react";
+import { SupportedToken } from "../../../services/axios/get-swap-tokens-list-service/type";
+interface Props {
+    className?: string;
+    selectedToken?: SupportedToken;
+    number?: number;
+    onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;
+}
+declare const CardForm: ({ selectedToken, onChange, number }: Props) => import("react/jsx-runtime").JSX.Element;
+export default CardForm;

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

@@ -0,0 +1,90 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var jsx_runtime_1 = require("react/jsx-runtime");
+var material_1 = require("@mui/material");
+var react_1 = require("react");
+var Icon_1 = __importDefault(require("../Icon"));
+var getIcon_1 = __importDefault(require("../../../utils/getIcon"));
+var providers_1 = require("../../../providers");
+var useWallet_1 = __importDefault(require("../../../hooks/useWallet"));
+var useBoolean_1 = require("../../../hooks/useBoolean");
+var Button_1 = __importDefault(require("../Button"));
+var Text_1 = __importDefault(require("../Text"));
+var getStandardNumber_1 = __importDefault(require("../../../utils/getStandardNumber"));
+var CardForm = function (_a) {
+    var _b, _c, _d, _e, _f, _g;
+    var selectedToken = _a.selectedToken, onChange = _a.onChange, number = _a.number;
+    var selectTokenForm = (0, useBoolean_1.useBoolean)("selectTokenForm");
+    var _h = (0, useWallet_1.default)(), updateSwapTokens = _h.updateSwapTokens, fromTokens = _h.fromTokens;
+    var theme = (0, providers_1.useTheme)();
+    (0, react_1.useEffect)(function () {
+        if (!fromTokens) {
+            updateSwapTokens();
+        }
+    }, [fromTokens, updateSwapTokens]);
+    var displayToken = (0, react_1.useMemo)(function () {
+        return selectedToken;
+    }, [selectedToken]);
+    var handleClickGetMaxValue = function () {
+        if ((displayToken === null || displayToken === void 0 ? void 0 : displayToken.max_value) && onChange) {
+            var balance = Number(displayToken.balance);
+            var maxValue = Number(displayToken.max_value);
+            var minValue = Math.min(balance, maxValue);
+            onChange({
+                target: { value: minValue.toString() },
+            });
+        }
+    };
+    return ((0, jsx_runtime_1.jsxs)(material_1.Box, { className: "p-4 rounded-16 backdrop-blur-[12px]", sx: {
+            border: "1px solid",
+            borderColor: "".concat((number && number < ((_b = displayToken === null || displayToken === void 0 ? void 0 : displayToken.min_value) !== null && _b !== void 0 ? _b : 0)) || (number && number > ((_c = displayToken === null || displayToken === void 0 ? void 0 : displayToken.max_value) !== null && _c !== void 0 ? _c : 0)) || (number && number > ((_d = Number(displayToken === null || displayToken === void 0 ? void 0 : displayToken.balance)) !== null && _d !== void 0 ? _d : 0)) ? "red" : "".concat(theme.palette.primary.main)),
+        }, children: [(0, jsx_runtime_1.jsxs)(material_1.Box, { className: "flex justify-between", children: [(0, jsx_runtime_1.jsx)(Text_1.default, { component: "p", sx: {
+                            color: theme.palette.text.blackContrast,
+                            fontWeight: theme.typography.fontWeight600,
+                        }, children: "From" }), (0, jsx_runtime_1.jsxs)(Text_1.default, { component: "p", sx: {
+                            color: theme.palette.text.accent,
+                            fontSize: theme.typography.fontSize12,
+                            fontWeight: theme.typography.fontWeight400,
+                        }, children: ["Balance:", " ", (0, jsx_runtime_1.jsxs)(Text_1.default, { sx: {
+                                    color: theme.palette.text.blackContrast,
+                                    fontWeight: theme.typography.fontWeight500,
+                                    fontSize: theme.typography.fontSize12,
+                                }, children: [(0, getStandardNumber_1.default)(Number(displayToken === null || displayToken === void 0 ? void 0 : displayToken.balance)), " ", displayToken === null || displayToken === void 0 ? void 0 : displayToken.full_name] })] })] }), (0, jsx_runtime_1.jsxs)(material_1.Box, { className: "flex justify-between mt-5 mb-4", children: [(0, jsx_runtime_1.jsxs)(material_1.Box, { className: "flex items-center gap-1 cursor-pointer", onClick: function () { return selectTokenForm.setTrue(); }, children: [(0, jsx_runtime_1.jsx)(Icon_1.default, { src: displayToken === null || displayToken === void 0 ? void 0 : displayToken.link, width: 20, height: 20, className: "rounded-full" }), (0, jsx_runtime_1.jsx)(Text_1.default, { component: "p", sx: {
+                                    color: theme.palette.text.blackContrast,
+                                    fontWeight: theme.typography.fontWeight600,
+                                }, children: (displayToken === null || displayToken === void 0 ? void 0 : displayToken.name) || (displayToken === null || displayToken === void 0 ? void 0 : displayToken.full_name) }), (0, jsx_runtime_1.jsx)(Icon_1.default, { src: (0, getIcon_1.default)("arrow_black_drop") })] }), (0, jsx_runtime_1.jsx)(material_1.Box, { className: "w-full flex justify-end items-end", children: (0, jsx_runtime_1.jsx)(material_1.InputBase, { type: "number", value: number === undefined || number === null ? "" : (0, getStandardNumber_1.default)(number), onChange: onChange, classes: {
+                                input: "text-end text-contrast max-w-fit bg-transparent border-none outline-none text-16 leading-140 font-bold placeholder:text-accent-1",
+                            }, sx: {
+                                "input::placeholder": {
+                                    fontSize: "13px",
+                                },
+                            }, placeholder: "Min ".concat(displayToken === null || displayToken === void 0 ? void 0 : displayToken.min_value, " - Max ").concat(displayToken === null || displayToken === void 0 ? void 0 : displayToken.max_value, " ").concat(displayToken === null || displayToken === void 0 ? void 0 : displayToken.full_name) }) })] }), (number && number > ((_e = displayToken === null || displayToken === void 0 ? void 0 : displayToken.max_value) !== null && _e !== void 0 ? _e : 0)) ||
+                (number && number < ((_f = displayToken === null || displayToken === void 0 ? void 0 : displayToken.min_value) !== null && _f !== void 0 ? _f : 0)) ||
+                (number && number > ((_g = Number(displayToken === null || displayToken === void 0 ? void 0 : displayToken.balance)) !== null && _g !== void 0 ? _g : 0)) ? ((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 items-center gap-1", children: [(0, jsx_runtime_1.jsx)(Icon_1.default, { src: (0, getIcon_1.default)("alert"), width: 14, height: 14 }), (0, jsx_runtime_1.jsx)(Text_1.default, { className: "text-red-500 font-normal text-12", children: "Insufficient balance" })] }), (0, jsx_runtime_1.jsx)(Button_1.default, { sx: {
+                            textTransform: "capitalize",
+                            backgroundColor: theme.palette.background.tertiary,
+                            borderRadius: theme.mixins.customRadius.r8,
+                            color: theme.palette.text.primary,
+                            height: theme.typography.fontSize24,
+                            padding: theme.mixins.customPadding.p12,
+                        }, onClick: handleClickGetMaxValue, children: (0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
+                                color: theme.palette.primary.main,
+                                fontWeight: theme.typography.fontWeight600,
+                                fontSize: theme.typography.fontSize12,
+                            }, children: "Max" }) })] })) : ((0, jsx_runtime_1.jsx)(material_1.Box, { className: "flex justify-end", children: (0, jsx_runtime_1.jsx)(Button_1.default, { sx: {
+                        textTransform: "capitalize",
+                        backgroundColor: theme.palette.background.tertiary,
+                        borderRadius: theme.mixins.customRadius.r8,
+                        color: theme.palette.text.primary,
+                        height: theme.typography.fontSize24,
+                        padding: theme.mixins.customPadding.p12,
+                    }, onClick: handleClickGetMaxValue, children: (0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
+                            color: theme.palette.primary.main,
+                            fontWeight: theme.typography.fontWeight600,
+                            fontSize: theme.typography.fontSize12,
+                        }, children: "Max" }) }) }))] }));
+};
+exports.default = CardForm;

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

@@ -0,0 +1,10 @@
+import { Output, SupportedToken } from "../../../services/axios/get-swap-tokens-list-service/type";
+interface Props {
+    className?: string;
+    token?: SupportedToken;
+    selectedOutputToken?: Output;
+    value?: number;
+    onClick?: () => void;
+}
+declare const CardTo: ({ selectedOutputToken, token, value }: Props) => import("react/jsx-runtime").JSX.Element;
+export default CardTo;

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

@@ -0,0 +1,39 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var jsx_runtime_1 = require("react/jsx-runtime");
+var material_1 = require("@mui/material");
+var Icon_1 = __importDefault(require("../Icon"));
+var getIcon_1 = __importDefault(require("../../../utils/getIcon"));
+var providers_1 = require("../../../providers");
+var useBoolean_1 = require("../../../hooks/useBoolean");
+var Text_1 = __importDefault(require("../Text"));
+var roundToTwoSignificantDecimals_1 = __importDefault(require("../../../utils/roundToTwoSignificantDecimals"));
+var CardTo = function (_a) {
+    var selectedOutputToken = _a.selectedOutputToken, token = _a.token, value = _a.value;
+    var selectTokenTo = (0, useBoolean_1.useBoolean)("selectTokenTo");
+    var cardFromUSDRate = Number(token === null || token === void 0 ? void 0 : token.usd_rate);
+    var cardToUSDRate = Number(selectedOutputToken === null || selectedOutputToken === void 0 ? void 0 : selectedOutputToken.usd_rate);
+    var totalAmount = (cardFromUSDRate * (value !== undefined ? value : 0)) / cardToUSDRate;
+    var theme = (0, providers_1.useTheme)();
+    return ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: {
+            padding: theme.mixins.customPadding.p12,
+            backgroundColor: theme.palette.background.tertiary,
+            borderRadius: theme.mixins.customRadius.r12,
+        }, children: [(0, jsx_runtime_1.jsx)(material_1.Box, { className: "flex justify-between", children: (0, jsx_runtime_1.jsx)(Text_1.default, { component: "p", sx: {
+                        color: theme.palette.text.blackContrast,
+                        fontWeight: theme.typography.fontWeight600,
+                    }, children: "To" }) }), (0, jsx_runtime_1.jsxs)(material_1.Box, { className: "flex justify-between mt-5 mb-4", children: [(0, jsx_runtime_1.jsxs)(material_1.Box, { className: "flex items-center gap-1 cursor-pointer", onClick: function () { return selectTokenTo.setTrue(); }, children: [(0, jsx_runtime_1.jsx)(Icon_1.default, { src: selectedOutputToken === null || selectedOutputToken === void 0 ? void 0 : selectedOutputToken.link, width: 20, height: 20, className: "rounded-full" }), (0, jsx_runtime_1.jsx)(Text_1.default, { component: "p", sx: {
+                                    color: theme.palette.text.blackContrast,
+                                    fontWeight: theme.typography.fontWeight600,
+                                }, children: (selectedOutputToken === null || selectedOutputToken === void 0 ? void 0 : selectedOutputToken.name) || (selectedOutputToken === null || selectedOutputToken === void 0 ? void 0 : selectedOutputToken.full_name) }), (0, jsx_runtime_1.jsx)(Icon_1.default, { src: (0, getIcon_1.default)("arrow_black_drop") })] }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
+                            color: theme.palette.text.blackContrast,
+                            fontWeight: theme.typography.fontWeight600,
+                            fontSize: theme.typography.fontSize16,
+                        }, children: (0, roundToTwoSignificantDecimals_1.default)(totalAmount) || ((0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
+                                color: theme.palette.text.accent,
+                            }, children: "--" })) })] })] }));
+};
+exports.default = CardTo;

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

@@ -0,0 +1,11 @@
+interface Props {
+    className?: string;
+    icon?: string;
+    symbol?: string;
+    balance?: string;
+    price?: string;
+    rate?: string;
+    isActive?: boolean;
+}
+declare const CardToken: ({ icon, symbol, balance, price, rate, isActive }: Props) => import("react/jsx-runtime").JSX.Element;
+export default CardToken;

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

@@ -0,0 +1,37 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var jsx_runtime_1 = require("react/jsx-runtime");
+var material_1 = require("@mui/material");
+var Icon_1 = __importDefault(require("../Icon"));
+var getIcon_1 = __importDefault(require("../../../utils/getIcon"));
+var providers_1 = require("../../../providers");
+var Text_1 = __importDefault(require("../Text"));
+var CardToken = function (_a) {
+    var icon = _a.icon, symbol = _a.symbol, balance = _a.balance, price = _a.price, rate = _a.rate, _b = _a.isActive, isActive = _b === void 0 ? false : _b;
+    var theme = (0, providers_1.useTheme)();
+    return ((0, jsx_runtime_1.jsx)(material_1.Box, { sx: {
+            border: "1px solid",
+            borderColor: "".concat(isActive ? theme.palette.primary.main : theme.palette.border.accent3),
+            backgroundColor: "".concat(isActive ? theme.palette.background.tertiary : theme.palette.background.white),
+        }, className: "p-4 rounded-16", children: (0, jsx_runtime_1.jsxs)(material_1.Box, { className: "flex justify-between items-center", children: [(0, jsx_runtime_1.jsxs)(material_1.Box, { className: "flex items-center gap-3", children: [(0, jsx_runtime_1.jsx)(Icon_1.default, { src: icon || (0, getIcon_1.default)("".concat(icon)), width: 20, height: 20 }), (0, jsx_runtime_1.jsxs)(material_1.Box, { className: "flex flex-col justify-start", children: [(0, jsx_runtime_1.jsx)(Text_1.default, { component: "p", sx: {
+                                        color: theme.palette.text.blackContrast,
+                                        fontWeight: theme.typography.fontWeight400,
+                                        fontSize: theme.typography.fontSize14,
+                                    }, children: symbol }), (0, jsx_runtime_1.jsx)(Text_1.default, { component: "p", sx: {
+                                        color: theme.palette.text.accent,
+                                        fontWeight: theme.typography.fontWeight400,
+                                        fontSize: theme.typography.fontSize12,
+                                    }, children: balance })] })] }), (0, jsx_runtime_1.jsxs)(material_1.Box, { className: "flex flex-col justify-end items-end", children: [(0, jsx_runtime_1.jsx)(Text_1.default, { component: "p", sx: {
+                                color: theme.palette.text.blackContrast,
+                                fontWeight: theme.typography.fontWeight500,
+                                fontSize: theme.typography.fontSize14,
+                            }, children: price }), (0, jsx_runtime_1.jsxs)(Text_1.default, { component: "p", sx: {
+                                color: theme.palette.text.accent,
+                                fontWeight: theme.typography.fontWeight400,
+                                fontSize: theme.typography.fontSize12,
+                            }, children: ["~$", rate] })] })] }) }));
+};
+exports.default = CardToken;

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

@@ -0,0 +1,7 @@
+import { Output, SupportedToken } from "../../../services/axios/get-swap-tokens-list-service/type";
+interface DetailSwapProps {
+    selectedToken?: SupportedToken;
+    selectOutputToken?: Output;
+}
+declare const DetailSwap: (props: DetailSwapProps) => import("react/jsx-runtime").JSX.Element;
+export default DetailSwap;

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

@@ -0,0 +1,51 @@
+"use strict";
+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 __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var jsx_runtime_1 = require("react/jsx-runtime");
+var material_1 = require("@mui/material");
+var providers_1 = require("../../../providers");
+var getIcon_1 = __importDefault(require("../../../utils/getIcon"));
+var Icon_1 = __importDefault(require("../Icon"));
+var LineValue_1 = __importDefault(require("../LineValue"));
+var Text_1 = __importDefault(require("../Text"));
+var DetailSwap = function (props) {
+    var _a, _b;
+    var theme = (0, providers_1.useTheme)();
+    var getOutputID = props.selectOutputToken &&
+        ((_a = props.selectedToken) === null || _a === void 0 ? void 0 : _a.outputs.find(function (output) { var _a; return output.id === Number((_a = props.selectOutputToken) === null || _a === void 0 ? void 0 : _a.id); }));
+    return ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign({}, theme.mixins.column), className: "gap-3 mt-2", children: [(0, jsx_runtime_1.jsx)(material_1.Box, { children: (0, jsx_runtime_1.jsx)(Text_1.default, { className: "capitalize opacity-90", sx: {
+                        color: theme.palette.text.accent2,
+                        fontSize: theme.typography.fontSize13,
+                        fontWeight: theme.typography.fontWeight400,
+                    }, children: "Transaction summary:" }) }), (0, jsx_runtime_1.jsx)(LineValue_1.default, { field: (0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
+                        color: theme.palette.text.accent,
+                        fontSize: theme.typography.fontSize12,
+                        fontWeight: theme.typography.fontWeight400,
+                    }, children: "Best Price" }), value: (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g4 }), children: [(0, jsx_runtime_1.jsx)(Icon_1.default, { src: (0, getIcon_1.default)("ellipse"), width: 12, height: 12 }), (0, jsx_runtime_1.jsxs)(Text_1.default, { className: "truncate", sx: {
+                                color: theme.palette.text.blackContrast,
+                                fontSize: theme.typography.fontSize12,
+                                fontWeight: theme.typography.fontWeight500,
+                            }, children: ["1 ", (_b = props.selectedToken) === null || _b === void 0 ? void 0 : _b.full_name, " ~ ", getOutputID === null || getOutputID === void 0 ? void 0 : getOutputID.swap_amount, " ", getOutputID && getOutputID.full_name] })] }) }), (0, jsx_runtime_1.jsx)(LineValue_1.default, { field: (0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
+                        color: theme.palette.text.accent,
+                        fontSize: theme.typography.fontSize12,
+                        fontWeight: theme.typography.fontWeight400,
+                    }, className: "capitalize", children: "Powered by" }), value: (0, jsx_runtime_1.jsx)(Text_1.default, { className: "truncate", sx: {
+                        color: theme.palette.text.blackContrast,
+                        fontSize: theme.typography.fontSize12,
+                        fontWeight: theme.typography.fontWeight500,
+                    }, children: "Liquidity Protocol" }) })] }));
+};
+exports.default = DetailSwap;

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

@@ -0,0 +1,8 @@
+import React from "react";
+import { SwapResponse } from "../../../services/axios/swap-service/type";
+interface DetailSwapResultProps {
+    onClose?: () => void;
+    swapData?: SwapResponse;
+}
+declare const DetailSwapResult: React.FC<DetailSwapResultProps>;
+export default DetailSwapResult;

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

@@ -0,0 +1,122 @@
+"use strict";
+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 __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 react_1 = require("react");
+var useWallet_1 = __importDefault(require("../../../hooks/useWallet"));
+var providers_1 = require("../../../providers");
+var ChildPageLayout_1 = __importDefault(require("../../layouts/ChildPageLayout"));
+var Button_1 = __importDefault(require("../Button"));
+var Text_1 = __importDefault(require("../Text"));
+var material_1 = require("@mui/material");
+var Icon_1 = __importDefault(require("../Icon"));
+var getIcon_1 = __importDefault(require("../../../utils/getIcon"));
+var LineValue_1 = __importDefault(require("../LineValue"));
+var formatDate_1 = __importDefault(require("../../../utils/formatDate"));
+var roundToTwoSignificantDecimals_1 = __importDefault(require("../../../utils/roundToTwoSignificantDecimals"));
+var DetailSwapResult = function (_a) {
+    var _b, _c;
+    var onClose = _a.onClose, swapData = _a.swapData;
+    var transaction = (0, useWallet_1.default)().transaction;
+    var theme = (0, providers_1.useTheme)();
+    var resultData = transaction || (swapData === null || swapData === void 0 ? void 0 : swapData.data);
+    var feeInfo = (0, react_1.useMemo)(function () {
+        var _a;
+        return (_a = resultData === null || resultData === void 0 ? void 0 : resultData.fee_info) === null || _a === void 0 ? void 0 : _a.fee_detail.map(function (item) { return item === null || item === void 0 ? void 0 : item.currency; });
+    }, [resultData]);
+    var getOutputs = feeInfo === null || feeInfo === void 0 ? void 0 : feeInfo.map(function (item) { return item === null || item === void 0 ? void 0 : item.outputs; });
+    var getDetailOutputs = getOutputs === null || getOutputs === void 0 ? void 0 : getOutputs[0].map(function (item) { return item; });
+    var getInfoDetailOutputs = (0, react_1.useMemo)(function () {
+        return getDetailOutputs === null || getDetailOutputs === void 0 ? void 0 : getDetailOutputs[0];
+    }, [getDetailOutputs]);
+    (0, react_1.useEffect)(function () { }, [resultData, resultData === null || resultData === void 0 ? void 0 : resultData.id]);
+    return ((0, jsx_runtime_1.jsx)(ChildPageLayout_1.default, { sx: __assign({ color: theme.palette.text.black }, theme.mixins.pagePadding), footer: (0, jsx_runtime_1.jsx)(material_1.Box, { sx: {
+                px: theme.mixins.customPadding.p12,
+                position: "relative",
+                bottom: theme.typography.fontSize24,
+            }, children: (resultData === null || resultData === void 0 ? void 0 : resultData.transaction_status) == "processing" || (resultData === null || resultData === void 0 ? void 0 : resultData.transaction_status) == "failed" ? ((0, jsx_runtime_1.jsx)(Button_1.default.Primary, { onClick: onClose, sx: __assign(__assign({ gap: theme.mixins.gaps.g4 }, theme.mixins.row), { color: theme.palette.text.secondary, borderRadius: theme.mixins.customRadius.r12, height: "40px" }), fullWidth: true, children: (0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
+                        fontSize: theme.typography.fontSize12,
+                        fontWeight: theme.typography.fontWeight600,
+                        leading: theme.typography.leading160,
+                        textTransform: "none",
+                        color: theme.palette.secondary.main,
+                    }, children: "Close" }) })) : ((resultData === null || resultData === void 0 ? void 0 : resultData.transaction_status) == "success" && ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g8, justifyContent: "center" }), children: [(0, jsx_runtime_1.jsx)(Button_1.default.Secondary, { onClick: onClose, sx: __assign(__assign({ gap: theme.mixins.gaps.g4 }, theme.mixins.row), { borderRadius: theme.mixins.customRadius.r12, borderColor: theme.palette.primary.main, backgroundColor: "transparent", maxWidth: "168px", height: "40px" }), fullWidth: true, children: (0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
+                                fontSize: theme.typography.fontSize13,
+                                fontWeight: theme.typography.fontWeight600,
+                                color: theme.palette.primary.main,
+                                leading: theme.typography.leading160,
+                                textTransform: "none",
+                            }, children: "Close" }) }), (0, jsx_runtime_1.jsx)(Button_1.default.Primary, { onClick: onClose, sx: __assign(__assign({ gap: theme.mixins.gaps.g4 }, theme.mixins.row), { color: theme.palette.text.secondary, borderRadius: theme.mixins.customRadius.r12, maxWidth: "168px", height: "40px" }), fullWidth: true, children: (0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
+                                fontSize: theme.typography.fontSize13,
+                                fontWeight: theme.typography.fontWeight600,
+                                leading: theme.typography.leading160,
+                                textTransform: "none",
+                                color: theme.palette.secondary.main,
+                            }, children: "View asset" }) })] }))) }), children: (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({ width: "100%" }, theme.mixins.column), { top: 0, transform: "translateY(30%)", 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" }), children: [(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)(Icon_1.default, { width: 100, height: 100, src: (0, getIcon_1.default)((resultData === null || resultData === void 0 ? void 0 : resultData.transaction_status) == "success"
+                            ? "success"
+                            : (resultData === null || resultData === void 0 ? void 0 : resultData.transaction_status) == "failed"
+                                ? "failed"
+                                : (resultData === null || resultData === void 0 ? void 0 : resultData.transaction_status) == "processing"
+                                    ? "processing"
+                                    : "") }) }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { mt: theme.mixins.customMargin.m8, textAlign: "center" }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
+                                color: theme.palette.text.accent2,
+                                fontSize: theme.typography.fontSize14,
+                                fontWeight: theme.typography.fontWeight400,
+                            }, children: "Swapping Token" }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
+                                color: (resultData === null || resultData === void 0 ? void 0 : resultData.transaction_status) == "processing"
+                                    ? theme.palette.text.warningStatus
+                                    : (resultData === null || resultData === void 0 ? void 0 : resultData.transaction_status) == "failed"
+                                        ? theme.palette.text.errorStatus
+                                        : (resultData === null || resultData === void 0 ? void 0 : resultData.transaction_status) == "success"
+                                            ? theme.palette.text.alertStatus
+                                            : theme.palette.text.warningStatus,
+                                fontSize: theme.typography.fontSize24,
+                                fontWeight: theme.typography.fontWeight600,
+                                textTransform: "capitalize",
+                            }, children: resultData === null || resultData === void 0 ? void 0 : resultData.transaction_status }), (0, jsx_runtime_1.jsx)(material_1.Divider, { sx: {
+                                width: "100%",
+                                color: theme.palette.text.accent,
+                                mt: theme.mixins.customMargin.m12,
+                            } }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.row), { justifyContent: "space-between", mt: theme.mixins.customMargin.m16 }), 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: (_b = resultData === null || resultData === void 0 ? void 0 : resultData.currency_data) === null || _b === void 0 ? void 0 : _b.link, width: 20, height: 20, className: "rounded-full" }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
+                                                fontSize: theme.typography.fontSize14,
+                                                fontWeight: theme.typography.fontWeight700,
+                                            }, children: resultData === null || resultData === void 0 ? void 0 : resultData.amount })] }), (0, jsx_runtime_1.jsx)(Icon_1.default, { src: (0, getIcon_1.default)("swap_horizontal"), width: 20, height: 20 }), (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: getInfoDetailOutputs === null || getInfoDetailOutputs === void 0 ? void 0 : getInfoDetailOutputs.link, width: 20, height: 20, className: "rounded-full" }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
+                                                fontSize: theme.typography.fontSize14,
+                                                fontWeight: theme.typography.fontWeight700,
+                                            }, children: (0, roundToTwoSignificantDecimals_1.default)((resultData === null || resultData === void 0 ? void 0 : resultData.amount) * (getInfoDetailOutputs === null || getInfoDetailOutputs === void 0 ? void 0 : getInfoDetailOutputs.swap_amount)) })] })] }), (0, jsx_runtime_1.jsx)(material_1.Divider, { sx: {
+                                width: "100%",
+                                color: theme.palette.text.accent,
+                                mt: theme.mixins.customMargin.m12,
+                            } }), (0, jsx_runtime_1.jsx)(LineValue_1.default, { sx: {
+                                mt: theme.mixins.customMargin.m16,
+                                mb: theme.mixins.customMargin.m16,
+                            }, field: (0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
+                                    fontSize: theme.typography.fontSize12,
+                                    color: theme.palette.text.blackContrast,
+                                }, children: "Price" }), value: (0, jsx_runtime_1.jsxs)(Text_1.default, { sx: {
+                                    fontSize: theme.typography.fontSize14,
+                                    fontWeight: theme.typography.fontWeight700,
+                                    ml: theme.mixins.customMargin.m8,
+                                }, children: ["1 ", (_c = resultData === null || resultData === void 0 ? void 0 : resultData.currency_data) === null || _c === void 0 ? void 0 : _c.full_name, " ~ ", getInfoDetailOutputs === null || getInfoDetailOutputs === void 0 ? void 0 : getInfoDetailOutputs.swap_amount, " ", getInfoDetailOutputs === null || getInfoDetailOutputs === void 0 ? void 0 : getInfoDetailOutputs.full_name] }) }), (0, jsx_runtime_1.jsx)(LineValue_1.default, { field: (0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
+                                    fontSize: theme.typography.fontSize12,
+                                    color: theme.palette.text.blackContrast,
+                                }, children: "Date time" }), value: (0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
+                                    fontSize: theme.typography.fontSize14,
+                                    fontWeight: theme.typography.fontWeight700,
+                                    ml: theme.mixins.customMargin.m8,
+                                }, children: (0, formatDate_1.default)(resultData === null || resultData === void 0 ? void 0 : resultData.date_created) }) })] })] }) }));
+};
+exports.default = DetailSwapResult;

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

@@ -0,0 +1,21 @@
+import { SxProps } from "@mui/material";
+import React from "react";
+export declare enum DRAWER_DIRECTION {
+    TOP = "top",
+    BOTTOM = "bottom",
+    LEFT = "left",
+    RIGHT = "right"
+}
+interface Props {
+    anchor?: DRAWER_DIRECTION;
+    open: boolean;
+    onClose: () => void;
+    onOpen: () => void;
+    className?: string;
+    content: React.ReactNode;
+    title?: React.ReactNode;
+    footer?: React.ReactNode;
+    sx?: SxProps;
+}
+declare const DrawerDrag: ({ anchor, open, onClose, onOpen, content, title, footer, sx }: Props) => import("react/jsx-runtime").JSX.Element;
+export default DrawerDrag;

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

@@ -0,0 +1,25 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DRAWER_DIRECTION = void 0;
+var jsx_runtime_1 = require("react/jsx-runtime");
+var material_1 = require("@mui/material");
+var providers_1 = require("../../../providers");
+var DRAWER_DIRECTION;
+(function (DRAWER_DIRECTION) {
+    DRAWER_DIRECTION["TOP"] = "top";
+    DRAWER_DIRECTION["BOTTOM"] = "bottom";
+    DRAWER_DIRECTION["LEFT"] = "left";
+    DRAWER_DIRECTION["RIGHT"] = "right";
+})(DRAWER_DIRECTION || (exports.DRAWER_DIRECTION = DRAWER_DIRECTION = {}));
+var DrawerDrag = function (_a) {
+    var anchor = _a.anchor, open = _a.open, onClose = _a.onClose, onOpen = _a.onOpen, content = _a.content, title = _a.title, footer = _a.footer, sx = _a.sx;
+    var theme = (0, providers_1.useTheme)();
+    return ((0, jsx_runtime_1.jsx)(material_1.SwipeableDrawer, { anchor: anchor || DRAWER_DIRECTION.BOTTOM, open: open, onClose: onClose || (function () { }), onOpen: onOpen, sx: sx
+            ? sx
+            : {
+                "& .MuiDrawer-paper": {
+                    backgroundColor: "transparent",
+                },
+            }, children: (0, jsx_runtime_1.jsxs)(material_1.Box, { className: "\n          \"w-full border-t border-".concat(theme.palette.border.accent3, " bg-").concat(theme.palette.background.tertiary, " blur-[50px]\",\n          className,\n          ").concat(anchor === DRAWER_DIRECTION.BOTTOM && "min-h-[33dvh]", "\n        "), children: [title, content, footer] }) }));
+};
+exports.default = DrawerDrag;

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

@@ -75,7 +75,7 @@ function Fees(props) {
         if (!isNotEnoughBalanceToPayFee) {
             setIsEnoughBalanceToPayFee === null || setIsEnoughBalanceToPayFee === void 0 ? void 0 : setIsEnoughBalanceToPayFee(!isNotEnoughBalanceToPayFee);
         }
-    }, [isNotEnoughBalanceToPayFee]);
+    }, [isNotEnoughBalanceToPayFee, setIsEnoughBalanceToPayFee]);
     var totalfee_in_usd = (0, react_1.useMemo)(function () {
         return feesData === null || feesData === void 0 ? void 0 : feesData.fee_in_usd;
     }, [feesData]);
@@ -127,12 +127,12 @@ exports.default = Fees;
 var FeeDetails = function (_a) {
     var feeName = _a.feeName, fee_in_currency = _a.fee_in_currency, fee_in_usd = _a.fee_in_usd, currencyName = _a.currencyName;
     var theme = (0, ThemeProvider_1.useTheme)();
-    return ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g4 }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
+    return ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g4, justifyContent: "space-between" }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
                     fontSize: theme.typography.fontSize11,
                     fontWeight: theme.typography.fontWeight500,
                     lineHeight: theme.typography.leading160,
                     color: theme.palette.text.accent,
                     pl: theme.mixins.gaps.g12,
                     whiteSpace: "nowrap",
-                }, children: feeName }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g4 }), children: [(0, jsx_runtime_1.jsx)(Formatter_1.default, { sx: __assign({}, theme.mixins.value), value: fee_in_currency, unit: " ".concat(currencyName) }), (0, jsx_runtime_1.jsx)(Formatter_1.default, { sx: __assign({}, theme.mixins.valueDescription), value: fee_in_usd, start: "~ $" })] })] }));
+                }, children: feeName }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { alignItems: "end", gap: theme.mixins.gaps.g4 }), children: [(0, jsx_runtime_1.jsx)(Formatter_1.default, { sx: __assign({}, theme.mixins.value), value: fee_in_currency, unit: " ".concat(currencyName) }), (0, jsx_runtime_1.jsx)(Formatter_1.default, { sx: __assign({}, theme.mixins.valueDescription), value: fee_in_usd, start: "~ $" })] })] }));
 };

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

@@ -0,0 +1,9 @@
+import { Output, SupportedToken } from "../../../services/axios/get-swap-tokens-list-service/type";
+interface ModalSelectTokenProps {
+    setSwapToken?: (token: SupportedToken) => void;
+    token?: SupportedToken;
+    outputToken?: Output;
+    setOutputToken?: (output: Output) => void;
+}
+declare const ModalSelectToken: (props: ModalSelectTokenProps) => import("react/jsx-runtime").JSX.Element;
+export default ModalSelectToken;