tek-wallet 0.0.131 → 0.0.133

package/dist/components/ui/BackArrow/index.js

@@ -30,6 +30,6 @@ var getIcon_1 = __importDefault(require("../../../utils/getIcon"));
 var Icon_1 = __importDefault(require("../Icon"));
 var BackArrow = function (props) {
     var rest = __rest(props, []);
-    return ((0, jsx_runtime_1.jsx)(Icon_1.default, __assign({ src: (0, getIcon_1.default)("arrow_back"), sx: __assign({ width: "1.5rem", height: "1.5rem" }, props.sx) }, rest)));
+    return ((0, jsx_runtime_1.jsx)(Icon_1.default, __assign({ src: (0, getIcon_1.default)("arrow_back"), width: 24, sx: __assign({}, props.sx) }, rest)));
 };
 exports.default = BackArrow;

package/dist/components/ui/BackHeader/index.js

@@ -31,10 +31,10 @@ var BackHeader = function (props) {
         }
         router.back();
     };
-    return ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign({ display: "flex", alignItems: "center", gap: "1rem", height: "100%" }, props.sx), children: [!hideBack && ((0, jsx_runtime_1.jsxs)(material_1.Box, { component: "button", sx: {
+    return ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign({ display: "flex", alignItems: "center", gap: theme.mixins.gaps.g16, height: "100%" }, props.sx), children: [!hideBack && ((0, jsx_runtime_1.jsxs)(material_1.Box, { component: "button", sx: {
                     display: "flex",
                     alignItems: "center",
-                    gap: "0.25rem",
+                    gap: theme.mixins.gaps.g4,
                     cursor: "pointer",
                     "&:active": {
                         transform: "translateX(-0.25rem)",

package/dist/components/ui/CloseModal/index.d.ts

@@ -0,0 +1,5 @@
+import { GeneralProps } from "../../../types/ui";
+interface CloseModalProps extends GeneralProps {
+}
+declare const CloseModal: (props: CloseModalProps) => import("react/jsx-runtime").JSX.Element;
+export default CloseModal;

package/dist/components/ui/CloseModal/index.js

@@ -0,0 +1,35 @@
+"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 __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var jsx_runtime_1 = require("react/jsx-runtime");
+var getIcon_1 = __importDefault(require("../../../utils/getIcon"));
+var Icon_1 = __importDefault(require("../Icon"));
+var CloseModal = function (props) {
+    var rest = __rest(props, []);
+    return ((0, jsx_runtime_1.jsx)(Icon_1.default, __assign({ src: (0, getIcon_1.default)("close_modal"), sx: __assign({ width: "1.5rem", height: "1.5rem" }, props.sx) }, rest)));
+};
+exports.default = CloseModal;

package/dist/components/ui/CopyTextComponent/index.d.ts

@@ -0,0 +1,8 @@
+import { GeneralProps } from "../../../types/ui";
+interface CopyTextComponentProps extends GeneralProps {
+    value: string;
+    iconSuccess?: React.ReactNode;
+    hideTextMessage?: boolean;
+}
+declare const CopyTextComponent: ({ value, iconSuccess, children, hideTextMessage, sx, }: CopyTextComponentProps) => import("react/jsx-runtime").JSX.Element;
+export default CopyTextComponent;

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

@@ -0,0 +1,106 @@
+"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 __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g = Object.create((typeof Iterator === "function" ? Iterator : Object).prototype);
+    return g.next = verb(0), g["throw"] = verb(1), g["return"] = verb(2), typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (g && (g = 0, op[0] && (_ = 0)), _) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var jsx_runtime_1 = require("react/jsx-runtime");
+var react_1 = require("react");
+var material_1 = require("@mui/material");
+var Icon_1 = __importDefault(require("../Icon"));
+var getIcon_1 = __importDefault(require("../../../utils/getIcon"));
+var Text_1 = __importDefault(require("../Text"));
+var CopyTextComponent = function (_a) {
+    var value = _a.value, iconSuccess = _a.iconSuccess, children = _a.children, hideTextMessage = _a.hideTextMessage, sx = _a.sx;
+    var theme = (0, material_1.useTheme)();
+    var _b = (0, react_1.useState)(false), showSuccess = _b[0], setShowSuccess = _b[1];
+    var CopyTextComponent = function () { return __awaiter(void 0, void 0, void 0, function () {
+        var err_1;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    _a.trys.push([0, 2, , 3]);
+                    return [4 /*yield*/, navigator.clipboard.writeText(value)];
+                case 1:
+                    _a.sent();
+                    setShowSuccess(true);
+                    setTimeout(function () {
+                        setShowSuccess(false);
+                    }, 800);
+                    return [3 /*break*/, 3];
+                case 2:
+                    err_1 = _a.sent();
+                    console.error("Failed to copy: ", err_1);
+                    return [3 /*break*/, 3];
+                case 3: return [2 /*return*/];
+            }
+        });
+    }); };
+    return ((0, jsx_runtime_1.jsxs)(material_1.Box, { onClick: CopyTextComponent, sx: __assign({ position: "relative", cursor: "pointer" }, sx), children: [children, (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: {
+                    display: "flex",
+                    alignItems: "center",
+                    justifyContent: "center",
+                    gap: theme.spacing(4),
+                    opacity: showSuccess ? 1 : 0,
+                    position: "absolute",
+                    inset: 0,
+                    backgroundColor: "rgb(0, 0, 0)",
+                    backdropFilter: "blur(12px)",
+                    WebkitBackdropFilter: "blur(12px)",
+                    transition: "opacity 0.3s ease-in-out",
+                }, children: [iconSuccess || ((0, jsx_runtime_1.jsx)(Icon_1.default, { src: (0, getIcon_1.default)("copied_check"), sx: {
+                            width: "1rem",
+                            height: "1rem",
+                        } })), !hideTextMessage && ((0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
+                            color: "text.whiteText",
+                            display: "inline-block",
+                            fontSize: "0.8em",
+                        }, children: "Copied" }))] })] }));
+};
+exports.default = CopyTextComponent;

package/dist/components/ui/CustomTooltip/index.d.ts

@@ -0,0 +1,10 @@
+import * as React from "react";
+import { PopoverProps } from "@mui/material/Popover";
+interface CustomTooltipProps extends Omit<PopoverProps, "open"> {
+    trigger: React.ReactNode;
+    children: React.ReactNode;
+    disabled?: boolean;
+    className?: string;
+}
+declare const CustomTooltip: ({ trigger, children, disabled, anchorOrigin, anchorPosition, transformOrigin, ...rest }: CustomTooltipProps) => import("react/jsx-runtime").JSX.Element;
+export default CustomTooltip;

package/dist/components/ui/CustomTooltip/index.js

@@ -0,0 +1,81 @@
+"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 __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var jsx_runtime_1 = require("react/jsx-runtime");
+var React = __importStar(require("react"));
+var Popover_1 = __importDefault(require("@mui/material/Popover"));
+var material_1 = require("@mui/material");
+var CustomTooltip = function (_a) {
+    var trigger = _a.trigger, children = _a.children, disabled = _a.disabled, _b = _a.anchorOrigin, anchorOrigin = _b === void 0 ? {
+        vertical: "bottom",
+        horizontal: "center",
+    } : _b, anchorPosition = _a.anchorPosition, transformOrigin = _a.transformOrigin, rest = __rest(_a, ["trigger", "children", "disabled", "anchorOrigin", "anchorPosition", "transformOrigin"]);
+    var _c = React.useState(null), anchorEl = _c[0], setAnchorEl = _c[1];
+    var handleClick = function (event) {
+        setAnchorEl(event.currentTarget);
+    };
+    var handleClose = function () {
+        setAnchorEl(null);
+    };
+    var open = Boolean(anchorEl);
+    var id = open ? "simple-popover" : undefined;
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Box, { component: "button", disabled: disabled, "aria-describedby": id, onClick: handleClick, sx: { textAlign: "left" }, children: trigger }), (0, jsx_runtime_1.jsx)(Popover_1.default, __assign({ id: id, open: open, anchorEl: anchorEl, onClose: handleClose, anchorOrigin: anchorOrigin, anchorPosition: anchorPosition, transformOrigin: transformOrigin }, rest, { children: children }))] }));
+};
+exports.default = CustomTooltip;

package/dist/components/ui/DepositFunction/index.d.ts

@@ -0,0 +1,9 @@
+import { GeneralProps } from "../../../types/ui";
+interface DepositFunctionProps extends GeneralProps {
+}
+type DepositFunctionRef = {
+    open: () => void;
+    close: () => void;
+};
+declare const DepositFunction: import("react").ForwardRefExoticComponent<DepositFunctionProps & import("react").RefAttributes<DepositFunctionRef>>;
+export default DepositFunction;

package/dist/components/ui/DepositFunction/index.js

@@ -0,0 +1,172 @@
+"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 DrawerComponent_1 = __importDefault(require("../DrawerComponent"));
+var SwiperControlled_1 = __importDefault(require("../SwiperControlled"));
+var useWalletData_1 = __importDefault(require("../../../hooks/useWalletData"));
+var ModalLayout_1 = __importDefault(require("../ModalLayout"));
+var CloseModal_1 = __importDefault(require("../CloseModal"));
+var react_2 = require("swiper/react");
+var BackHeader_1 = __importDefault(require("../BackHeader"));
+var ModalTitle_1 = __importDefault(require("../ModalTitle"));
+var QRCode_1 = __importDefault(require("../QRCode"));
+var HorizontalScroll_1 = __importDefault(require("../HorizontalScroll"));
+var Text_1 = __importDefault(require("../Text"));
+var material_1 = require("@mui/material");
+var CopyTextComponent_1 = __importDefault(require("../CopyTextComponent"));
+var Button_1 = __importDefault(require("../Button"));
+var Icon_1 = __importDefault(require("../Icon"));
+var getIcon_1 = __importDefault(require("../../../utils/getIcon"));
+var Share_1 = __importDefault(require("../Share"));
+var NetworkSelection_1 = __importDefault(require("../NetworkSelection"));
+var TokenSelection_1 = __importDefault(require("../TokenSelection"));
+var DepositStep;
+(function (DepositStep) {
+    DepositStep[DepositStep["SELECT_TOKEN"] = 1] = "SELECT_TOKEN";
+    DepositStep[DepositStep["SELECT_NETWORK"] = 2] = "SELECT_NETWORK";
+    DepositStep[DepositStep["SHOW_QR_CODE"] = 3] = "SHOW_QR_CODE";
+})(DepositStep || (DepositStep = {}));
+var DepositFunction = (0, react_1.forwardRef)(function (props, ref) {
+    var drawerRef = (0, react_1.useRef)(null);
+    var swiperRef = (0, react_1.useRef)(null);
+    var theme = (0, material_1.useTheme)();
+    var _a = (0, react_1.useState)(DepositStep.SELECT_TOKEN), currentStep = _a[0], setCurrentStep = _a[1];
+    var tokens = (0, useWalletData_1.default)().tokens;
+    var open = function () {
+        var _a;
+        (_a = drawerRef.current) === null || _a === void 0 ? void 0 : _a.open();
+    };
+    var close = function () {
+        var _a;
+        (_a = drawerRef.current) === null || _a === void 0 ? void 0 : _a.close();
+    };
+    var prevStep = function () {
+        var _a;
+        (_a = swiperRef.current) === null || _a === void 0 ? void 0 : _a.prev();
+        setCurrentStep(currentStep - 1);
+    };
+    (0, react_1.useImperativeHandle)(ref, function () { return ({
+        open: open,
+        close: close,
+    }); });
+    return ((0, jsx_runtime_1.jsx)(DrawerComponent_1.default, { ref: drawerRef, trigger: props.children, children: (0, jsx_runtime_1.jsxs)(ModalLayout_1.default, { title: "Select token", onClose: close, hideHeader: true, children: [(0, jsx_runtime_1.jsx)(CloseModal_1.default, { onClick: close, sx: {
+                        position: "absolute",
+                        right: "1rem",
+                        zIndex: 10,
+                    } }), (0, jsx_runtime_1.jsxs)(SwiperControlled_1.default, { ref: swiperRef, initialActiveTab: currentStep, swiperProps: { autoHeight: true }, children: [(0, jsx_runtime_1.jsxs)(react_2.SwiperSlide, { children: [(0, jsx_runtime_1.jsx)(BackHeader_1.default, { sx: { paddingBottom: "1rem" }, hideBack: true, children: (0, jsx_runtime_1.jsx)(ModalTitle_1.default, { children: "Select token" }) }), (0, jsx_runtime_1.jsx)(material_1.Box, { sx: {
+                                        display: "flex",
+                                        flexDirection: "column",
+                                        gap: "0.75rem",
+                                    }, children: tokens === null || tokens === void 0 ? void 0 : tokens.map(function (item, index) {
+                                        var stringifiedTokenData = JSON.stringify(__assign(__assign({}, item), { name: "Fake", fullname: "Fake fullname" }));
+                                        return ((0, jsx_runtime_1.jsx)(TokenSelection_1.default, { tokenData: stringifiedTokenData, active: index === 1 }, item.id));
+                                    }) })] }, "slice1"), (0, jsx_runtime_1.jsxs)(react_2.SwiperSlide, { children: [(0, jsx_runtime_1.jsx)(BackHeader_1.default, { sx: { paddingBottom: "1rem" }, overrideBack: prevStep, children: (0, jsx_runtime_1.jsx)(ModalTitle_1.default, { children: "Select network" }) }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: {
+                                        display: "flex",
+                                        flexDirection: "column",
+                                        gap: "0.75rem",
+                                    }, children: [(0, jsx_runtime_1.jsx)(HorizontalScroll_1.default, { children: (0, jsx_runtime_1.jsx)(material_1.Box, { sx: {
+                                                    display: "flex",
+                                                    alignItems: "center",
+                                                    gap: "0.5rem",
+                                                }, children: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10].map(function (item) {
+                                                    return ((0, jsx_runtime_1.jsx)(NetworkSelection_1.default, { networkData: JSON.stringify({
+                                                            name: "network ".concat(item),
+                                                            icon: "https://via.placeholder.com/150",
+                                                        }) }, item));
+                                                }) }) }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: {
+                                                width: "100%",
+                                                display: "flex",
+                                                flexDirection: "column",
+                                                gap: "0.75rem",
+                                                backgroundColor: "ui-background-222",
+                                                borderRadius: "0.75rem",
+                                                padding: "1.5rem",
+                                                alignItems: "flex-start",
+                                            }, id: "share-deposit-info", children: [(0, jsx_runtime_1.jsxs)(material_1.Box, { sx: {
+                                                        display: "flex",
+                                                        flexDirection: "column",
+                                                        gap: "0.125rem",
+                                                        color: "text.white",
+                                                        alignSelf: "center",
+                                                    }, children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
+                                                                fontSize: theme.typography.fontSize12,
+                                                                fontWeight: theme.typography.fontWeight500,
+                                                                leading: "typography.leading150",
+                                                            }, children: "Harry Andrew" }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
+                                                                fontSize: theme.typography.fontSize12,
+                                                                fontWeight: theme.typography.fontWeight400,
+                                                                leading: "typography.leading150",
+                                                            }, children: "@user1234we" })] }), (0, jsx_runtime_1.jsx)(material_1.Box, { sx: {
+                                                        alignSelf: "center",
+                                                        padding: "0.75rem",
+                                                        backgroundColor: "ui-background-white",
+                                                    }, children: (0, jsx_runtime_1.jsx)(QRCode_1.default, {}) }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: {
+                                                        display: "flex",
+                                                        flexDirection: "column",
+                                                        gap: "0.125rem",
+                                                        color: "text.white",
+                                                    }, children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
+                                                                fontSize: theme.typography.fontSize10,
+                                                                leading: "typography.leading150",
+                                                            }, children: "Network" }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
+                                                                fontSize: theme.typography.fontSize13,
+                                                                fontWeight: theme.typography.fontWeight500,
+                                                                leading: "typography.leading150",
+                                                            }, children: "Ethereum (ERC20)" })] }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: {
+                                                        display: "flex",
+                                                        flexDirection: "column",
+                                                        gap: "0.125rem",
+                                                        color: "text.white",
+                                                    }, children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
+                                                                fontSize: theme.typography.fontSize10,
+                                                                leading: "typography.leading150",
+                                                            }, children: "Address" }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
+                                                                fontSize: theme.typography.fontSize13,
+                                                                fontWeight: theme.typography.fontWeight500,
+                                                                leading: "typography.leading150",
+                                                                wordBreak: "break-all",
+                                                            }, children: "tebfwe78w237dbyuc78wb4b3y8cbwebd8732w9bcubf638uegyg7dt63ged87dxi8w3gdyhf73" })] }), (0, jsx_runtime_1.jsx)(material_1.Box, { sx: {
+                                                        display: "flex",
+                                                        alignItems: "center",
+                                                        gap: "8px",
+                                                        backgroundColor: "ui-background-white-16",
+                                                        borderRadius: "12px",
+                                                        padding: "8px 12px",
+                                                    }, children: (0, jsx_runtime_1.jsxs)(Text_1.default, { className: "text-11 text-ui-text-white leading-140", children: ["Deposit min ", (0, jsx_runtime_1.jsx)("strong", { children: "0.001" }), " ETH and select the correct network, ", "or you'll lose your assets."] }) })] }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: {
+                                                display: "flex",
+                                                alignItems: "center",
+                                                gap: "0.75rem",
+                                                justifyContent: "center",
+                                            }, children: [(0, jsx_runtime_1.jsx)(CopyTextComponent_1.default, { value: "https://reactjs.org/", children: (0, jsx_runtime_1.jsxs)(Button_1.default.Secondary, { className: "gap-1.5 flex items-center", children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
+                                                                    fontSize: theme.typography.fontSize12,
+                                                                    fontWeight: theme.typography.fontWeight400,
+                                                                    leading: "typography.leading150",
+                                                                    textTransform: "capitalize",
+                                                                }, children: "Copy" }), (0, jsx_runtime_1.jsx)(Icon_1.default, { src: (0, getIcon_1.default)("copy"), width: 20 })] }) }), (0, jsx_runtime_1.jsx)(Share_1.default, { elementId: "share-deposit-info", children: (0, jsx_runtime_1.jsxs)(Button_1.default.Secondary, { sx: {
+                                                            gap: "0.125rem",
+                                                            display: "flex",
+                                                            alignItems: "center",
+                                                        }, children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
+                                                                    fontSize: theme.typography.fontSize12,
+                                                                    fontWeight: theme.typography.fontWeight400,
+                                                                    leading: "typography.leading150",
+                                                                    textTransform: "capitalize",
+                                                                }, children: "Share" }), (0, jsx_runtime_1.jsx)(Icon_1.default, { src: (0, getIcon_1.default)("copy"), width: 20 })] }) })] })] })] }, "slice2")] })] }) }));
+});
+DepositFunction.displayName = "DepositFunction";
+exports.default = DepositFunction;

package/dist/components/ui/Formatter/index.d.ts

@@ -0,0 +1,25 @@
+import React, { CSSProperties } from "react";
+import { GeneralProps } from "../../../types/ui";
+interface FormatterProps extends GeneralProps {
+    value?: number | string;
+    start?: string;
+    unit?: string;
+    unitCustomStyle?: string;
+    lengthValueAllowed?: number;
+    noUnitSpacing?: boolean;
+    allowShowZero?: boolean;
+    useCompact?: boolean;
+    disableTooltip?: boolean;
+    isUnitStyle?: boolean;
+    disableAdjustUnitColor?: boolean;
+    isLessThan?: boolean;
+    overrideLessThanClass?: string;
+    unitStyle?: CSSProperties;
+    useCompactOnThousand?: boolean;
+    startStyle?: CSSProperties;
+    hideStart?: boolean;
+    hideUnit?: boolean;
+    onClickUnit?: (data?: any) => any;
+}
+declare const Formatter: React.FC<FormatterProps>;
+export default Formatter;

package/dist/components/ui/Formatter/index.js

@@ -0,0 +1,54 @@
+"use strict";
+"use client";
+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 getStandardNumber_1 = __importDefault(require("../../../utils/getStandardNumber"));
+var lengthFromDotToFirstNonZero_1 = __importDefault(require("../../../utils/lengthFromDotToFirstNonZero"));
+var CustomTooltip_1 = __importDefault(require("../CustomTooltip"));
+var cn_1 = __importDefault(require("../../../utils/cn"));
+var material_1 = require("@mui/material");
+var formatter_1 = __importDefault(require("../../../utils/formatter"));
+var Formatter = function (_a) {
+    var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
+    var value = _a.value, _o = _a.start, start = _o === void 0 ? "" : _o, _p = _a.unit, unit = _p === void 0 ? "" : _p, _q = _a.lengthValueAllowed, lengthValueAllowed = _q === void 0 ? 2 : _q, _r = _a.noUnitSpacing, noUnitSpacing = _r === void 0 ? false : _r, _s = _a.allowShowZero, allowShowZero = _s === void 0 ? false : _s, _t = _a.useCompact, useCompact = _t === void 0 ? true : _t, disableTooltip = _a.disableTooltip, isUnitStyle = _a.isUnitStyle, unitCustomStyle = _a.unitCustomStyle, disableAdjustUnitColor = _a.disableAdjustUnitColor, isLessThan = _a.isLessThan, overrideLessThanClass = _a.overrideLessThanClass, unitStyle = _a.unitStyle, _u = _a.useCompactOnThousand, useCompactOnThousand = _u === void 0 ? false : _u, startStyle = _a.startStyle, hideStart = _a.hideStart, hideUnit = _a.hideUnit, onClickUnit = _a.onClickUnit;
+    var tokensRateState = {}.tokensRateState;
+    var userInfo = {}.userInfo;
+    //   const { tokensRateState } = useRealtimeData();
+    //   const { userInfo } = useGlobalData();
+    if (value === undefined)
+        return;
+    var rate = (start === null || start === void 0 ? void 0 : start.includes("$")) || ((_b = start === null || start === void 0 ? void 0 : start.toLowerCase()) === null || _b === void 0 ? void 0 : _b.includes("usd"))
+        ? +(((_d = tokensRateState === null || tokensRateState === void 0 ? void 0 : tokensRateState[(_c = userInfo === null || userInfo === void 0 ? void 0 : userInfo.settings) === null || _c === void 0 ? void 0 : _c.currency]) === null || _d === void 0 ? void 0 : _d.USD) || 1)
+        : 1;
+    var numberDisplay = Number(value) / rate;
+    var startDisplay = (start === null || start === void 0 ? void 0 : start.includes("$")) || ((_e = start === null || start === void 0 ? void 0 : start.toLowerCase()) === null || _e === void 0 ? void 0 : _e.includes("usd"))
+        ? ((_g = (_f = userInfo === null || userInfo === void 0 ? void 0 : userInfo.settings) === null || _f === void 0 ? void 0 : _f.currency) === null || _g === void 0 ? void 0 : _g.toLowerCase()) == "usd"
+            ? "$"
+            : ""
+        : start;
+    var unitDisplay = (start === null || start === void 0 ? void 0 : start.includes("$")) || ((_h = start === null || start === void 0 ? void 0 : start.toLowerCase()) === null || _h === void 0 ? void 0 : _h.includes("usd"))
+        ? ((_k = (_j = userInfo === null || userInfo === void 0 ? void 0 : userInfo.settings) === null || _j === void 0 ? void 0 : _j.currency) === null || _k === void 0 ? void 0 : _k.toLowerCase()) == "usd"
+            ? unit
+            : ((_l = userInfo === null || userInfo === void 0 ? void 0 : userInfo.settings) === null || _l === void 0 ? void 0 : _l.currency) && " ".concat((_m = userInfo === null || userInfo === void 0 ? void 0 : userInfo.settings) === null || _m === void 0 ? void 0 : _m.currency)
+        : unit;
+    var formattedNumber = (0, getStandardNumber_1.default)(numberDisplay);
+    var lengthFromDot = (0, lengthFromDotToFirstNonZero_1.default)(formattedNumber);
+    var lessThan = numberDisplay > 0 && numberDisplay < 0.01 && isLessThan;
+    return ((0, jsx_runtime_1.jsx)(CustomTooltip_1.default, { disabled: disableTooltip, trigger: (0, jsx_runtime_1.jsx)(material_1.Box, { sx: {
+                whiteSpace: "nowrap",
+            }, children: numberDisplay === 0 && !allowShowZero ? ("--") : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [lessThan && ((0, jsx_runtime_1.jsx)("span", { className: (0, cn_1.default)("relative -top-0.5 font-primary mr-0.5", overrideLessThanClass), children: "< " })), !(numberDisplay === 0) && !hideStart && ((0, jsx_runtime_1.jsx)("span", { className: "font-primary", style: startStyle, children: startDisplay })), !lessThan && numberDisplay > 0 && numberDisplay < 0.000001 ? ((0, jsx_runtime_1.jsxs)("span", { className: "font-primary", children: ["0.0", (0, jsx_runtime_1.jsx)("sub", { children: lengthFromDot }), formattedNumber.slice(2 + lengthFromDot, lengthValueAllowed - 2 + lengthFromDot)] })) : ((0, jsx_runtime_1.jsx)("span", { className: "font-primary", children: lessThan
+                            ? "0.01"
+                            : (0, formatter_1.default)(isLessThan
+                                ? Number(numberDisplay).toFixed(2)
+                                : numberDisplay, useCompact, useCompactOnThousand, lengthValueAllowed) })), !hideUnit &&
+                        !!unitDisplay &&
+                        !noUnitSpacing &&
+                        !(numberDisplay === 0) && ((0, jsx_runtime_1.jsx)("span", { className: (0, cn_1.default)("font-primary", unitCustomStyle, {
+                            "text-secondary": isUnitStyle,
+                            not_apply_adjust_color_tbk: disableAdjustUnitColor,
+                        }), style: unitStyle, onClick: onClickUnit, children: unitDisplay }))] })) }), children: (0, jsx_runtime_1.jsx)(Formatter, { disableTooltip: true, start: start, value: value, lengthValueAllowed: 12, useCompact: false, unit: unit, allowShowZero: true, disableAdjustUnitColor: true, hideStart: hideStart, hideUnit: hideUnit }) }));
+};
+exports.default = Formatter;

package/dist/components/ui/HorizontalScroll/index.d.ts

@@ -0,0 +1,5 @@
+import { GeneralProps } from "../../../types/ui";
+interface HorizontalScrollPropsType extends GeneralProps {
+}
+declare function HorizontalScroll({ children }: HorizontalScrollPropsType): import("react/jsx-runtime").JSX.Element;
+export default HorizontalScroll;

package/dist/components/ui/HorizontalScroll/index.js

@@ -0,0 +1,41 @@
+"use strict";
+"use client";
+Object.defineProperty(exports, "__esModule", { value: true });
+var jsx_runtime_1 = require("react/jsx-runtime");
+var react_1 = require("react");
+function HorizontalScroll(_a) {
+    var children = _a.children;
+    var scrollContainerRef = (0, react_1.useRef)(null);
+    var isDragging = (0, react_1.useRef)(false);
+    var startX = (0, react_1.useRef)(0);
+    var scrollLeft = (0, react_1.useRef)(0);
+    var handleMouseDown = function (e) {
+        var _a, _b;
+        isDragging.current = true;
+        startX.current = e.pageX - (((_a = scrollContainerRef.current) === null || _a === void 0 ? void 0 : _a.offsetLeft) || 0);
+        scrollLeft.current = ((_b = scrollContainerRef.current) === null || _b === void 0 ? void 0 : _b.scrollLeft) || 0;
+    };
+    var handleMouseMove = function (e) {
+        var _a;
+        if (!isDragging.current)
+            return;
+        e.preventDefault();
+        var x = e.pageX - (((_a = scrollContainerRef.current) === null || _a === void 0 ? void 0 : _a.offsetLeft) || 0);
+        var walk = (x - startX.current) * 2; // Adjust scroll speed by changing multiplier
+        if (scrollContainerRef.current) {
+            scrollContainerRef.current.scrollLeft = scrollLeft.current - walk;
+        }
+    };
+    var handleMouseUp = function () {
+        isDragging.current = false;
+    };
+    var handleMouseLeave = function () {
+        isDragging.current = false;
+    };
+    return ((0, jsx_runtime_1.jsx)("div", { className: "hide_scrollbar", ref: scrollContainerRef, onMouseDown: handleMouseDown, onMouseLeave: handleMouseLeave, onMouseUp: handleMouseUp, onMouseMove: handleMouseMove, onTouchMove: function (e) { return e.stopPropagation(); }, style: {
+            overflowX: "auto",
+            display: "flex",
+            cursor: "grab",
+        }, children: children }));
+}
+exports.default = HorizontalScroll;

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

@@ -2,6 +2,8 @@ import { GeneralProps } from "../../../types/ui";
 export interface IconProps extends Omit<GeneralProps, "onClick">, React.ImgHTMLAttributes<HTMLImageElement> {
     src?: string;
     alt?: string;
+    width?: number;
+    height?: number;
 }
 declare const Icon: (props: IconProps) => import("react/jsx-runtime").JSX.Element;
 export default Icon;

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

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

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

@@ -0,0 +1,8 @@
+import { GeneralProps } from "../../../types/ui";
+interface ModalLayoutProps extends GeneralProps {
+    title?: string;
+    onClose?: () => void;
+    hideHeader?: boolean;
+}
+declare const ModalLayout: (props: ModalLayoutProps) => import("react/jsx-runtime").JSX.Element;
+export default ModalLayout;