tek-wallet 0.0.762 → 0.0.764
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/TekWallet/components/index.d.ts +2 -0
- package/dist/components/TekWallet/components/index.js +2 -0
- package/dist/components/TekWallet/components/layouts/ChildPageLayout/index.d.ts +6 -0
- package/dist/components/TekWallet/components/layouts/ChildPageLayout/index.js +2 -2
- package/dist/components/TekWallet/components/layouts/ChildPageLayout/style.d.ts +2 -0
- package/dist/components/TekWallet/components/layouts/ChildPageLayout/style.js +9 -0
- package/dist/components/TekWallet/components/ui/ActivitiesTypeSlice/index.d.ts +2 -0
- package/dist/components/TekWallet/components/ui/ActivitiesTypeSlice/index.js +6 -6
- package/dist/components/TekWallet/components/ui/ActivityDetail/index.js +5 -4
- package/dist/components/TekWallet/components/ui/ActivityItem/index.js +2 -2
- package/dist/components/TekWallet/components/ui/AnalyticGroupCenter/index.js +1 -1
- package/dist/components/TekWallet/components/ui/Button/index.js +2 -2
- package/dist/components/TekWallet/components/ui/DelayMounted/index.js +1 -1
- package/dist/components/TekWallet/components/ui/ListItemCustom/index.js +1 -1
- package/dist/components/TekWallet/components/ui/NetworkSelection/index.js +3 -1
- package/dist/components/TekWallet/components/ui/ReceiveFunction/index.js +126 -107
- package/dist/components/TekWallet/components/ui/SmartList/index.d.ts +2 -1
- package/dist/components/TekWallet/components/ui/SmartList/index.js +2 -2
- package/dist/components/TekWallet/components/ui/SwapFunction/index.js +36 -37
- package/dist/components/TekWallet/components/ui/TokenSelection/index.js +1 -1
- package/dist/components/TekWallet/components/ui/WaitingData/index.js +7 -6
- package/dist/components/TekWallet/components/views/ActivityView/index.js +5 -2
- package/dist/components/TekWallet/components/views/AssetView/index.js +15 -6
- package/dist/components/TekWallet/components/views/DetailActivityView/index.js +1 -1
- package/dist/components/TekWallet/components/views/NotFoundView/index.js +31 -1
- package/dist/components/TekWallet/components/views/SendExternalView/components/Form.js +73 -69
- package/dist/components/TekWallet/components/views/SendExternalView/index.js +1 -7
- package/dist/components/TekWallet/components/views/SendInternalView/components/Form.js +60 -59
- package/dist/components/TekWallet/components/views/SendInternalView/index.js +1 -1
- package/dist/components/TekWallet/components/views/SettingView/index.js +47 -5
- package/dist/components/TekWallet/components/views/SwapView/components/FromCard/index.js +7 -6
- package/dist/components/TekWallet/components/views/SwapView/index.d.ts +1 -10
- package/dist/components/TekWallet/components/views/SwapView/index.js +3 -27
- package/dist/components/TekWallet/components/views/TekWalletView/index.js +0 -1
- package/dist/components/TekWallet/providers/ActivitiesProvider/const.d.ts +1 -1
- package/dist/components/TekWallet/providers/ActivitiesProvider/const.js +1 -1
- package/dist/components/TekWallet/providers/TekWalletProvider/index.d.ts +6 -0
- package/dist/components/TekWallet/providers/TekWalletProvider/index.js +7 -1
- package/dist/components/TekWallet/theme/mui/theme.js +2 -2
- package/package.json +1 -1
|
@@ -1,10 +1,12 @@
|
|
|
1
1
|
import { SxProps } from "@mui/material";
|
|
2
2
|
import { TransactionType } from "../../../services/axios/get-activities-service/type";
|
|
3
|
+
import { SmartListProps } from "../SmartList";
|
|
3
4
|
export interface ActivitiesTypeSlicePropsType {
|
|
4
5
|
type: TransactionType;
|
|
5
6
|
isActive?: boolean;
|
|
6
7
|
limitItems?: number;
|
|
7
8
|
sx?: SxProps;
|
|
9
|
+
smartListProps?: Partial<SmartListProps>;
|
|
8
10
|
}
|
|
9
11
|
export declare enum Status {
|
|
10
12
|
Loading = "loading",
|
|
@@ -38,7 +38,7 @@ function ActivitiesTypeSlice(props) {
|
|
|
38
38
|
var _a, _b;
|
|
39
39
|
var theme = (0, ThemeProvider_1.useTheme)();
|
|
40
40
|
var _c = (0, useActivities_1.default)(), activities = _c.activities, loadActivities = _c.loadActivities, loadOutActivityType = _c.loadOutActivityType;
|
|
41
|
-
var type = props.type, isActive = props.isActive, limitItems = props.limitItems, sx = props.sx;
|
|
41
|
+
var type = props.type, isActive = props.isActive, limitItems = props.limitItems, sx = props.sx, smartListProps = props.smartListProps;
|
|
42
42
|
var options = (0, TekWalletProvider_1.useWalletConfig)().options;
|
|
43
43
|
var basePath = (options || {}).basePath;
|
|
44
44
|
var activitiesByType = (0, react_1.useMemo)(function () {
|
|
@@ -61,14 +61,14 @@ function ActivitiesTypeSlice(props) {
|
|
|
61
61
|
var loadMore = (0, react_1.useCallback)(function () {
|
|
62
62
|
loadActivities(type.slug);
|
|
63
63
|
}, [loadActivities, type.slug]);
|
|
64
|
-
return ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign({ width: "100%", height: "100%", display: "flex"
|
|
65
|
-
((activitiesByType === null || activitiesByType === void 0 ? void 0 : activitiesByType.length) || 0) < (limitItems || Infinity), loadingComponent: (0, jsx_runtime_1.jsx)(WaitingData_1.default, { numberOfSkeleton:
|
|
64
|
+
return ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign({ width: "100%", height: "100%", display: "flex" }, sx), children: [status === Status.Loading && ((0, jsx_runtime_1.jsx)(WaitingData_1.default, { sx: { marginBottom: "auto", p: theme.mixins.customPadding.p16 } })), status === Status.Empty && ((0, jsx_runtime_1.jsx)(EmptyData_1.default, { sx: { marginBottom: "auto", marginTop: "4rem" }, icon: (0, getIcon_1.default)(prefix + "empty_" + type.slug), description: "No ".concat((_a = type.name) === null || _a === void 0 ? void 0 : _a.toLowerCase(), " activity") })), status === Status.Filled && ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(SmartList_1.default, { loadMoreData: loadMore, sx: __assign({ px: theme.mixins.customPadding.p16 }, smartListProps === null || smartListProps === void 0 ? void 0 : smartListProps.sx), hasMore: !loadOutActivityType[type.slug] &&
|
|
65
|
+
((activitiesByType === null || activitiesByType === void 0 ? void 0 : activitiesByType.length) || 0) < (limitItems || Infinity), loadingComponent: (0, jsx_runtime_1.jsx)(WaitingData_1.default, { numberOfSkeleton: 4, sx: {
|
|
66
|
+
marginTop: theme.mixins.customMargin.m12,
|
|
67
|
+
} }), bodySx: __assign({ pb: theme.mixins.customPadding.p32, pt: theme.mixins.customPadding.p16 }, smartListProps === null || smartListProps === void 0 ? void 0 : smartListProps.bodySx), children: (0, jsx_runtime_1.jsx)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g12 }), children: (_b = activitiesByType === null || activitiesByType === void 0 ? void 0 : activitiesByType.slice(0, limitItems)) === null || _b === void 0 ? void 0 : _b.map(function (activity, index) {
|
|
66
68
|
if (!activity)
|
|
67
69
|
return null;
|
|
68
70
|
var dataAsJson = JSON.stringify(activity);
|
|
69
|
-
return ((0, jsx_runtime_1.jsx)(ActivityItem_1.default
|
|
70
|
-
// onClick={() => openDetail(activity)}
|
|
71
|
-
, { data: dataAsJson, component: link_1.default, href: "".concat(basePath || "", "/tek-wallet/activity/").concat(activity.id) }, index));
|
|
71
|
+
return ((0, jsx_runtime_1.jsx)(ActivityItem_1.default, { data: dataAsJson, component: link_1.default, href: "".concat(basePath || "", "/tek-wallet/activity/").concat(activity.id) }, activity.id + index));
|
|
72
72
|
}) }) }) }))] }));
|
|
73
73
|
}
|
|
74
74
|
exports.default = ActivitiesTypeSlice;
|
|
@@ -26,6 +26,7 @@ var Text_1 = __importDefault(require("../Text"));
|
|
|
26
26
|
var formatDate_1 = __importDefault(require("../../../utils/formatDate"));
|
|
27
27
|
var CopyTextComponent_1 = __importDefault(require("../CopyTextComponent"));
|
|
28
28
|
var useWalletData_1 = __importDefault(require("../../../hooks/useWalletData"));
|
|
29
|
+
var SvgPath_1 = require("../SvgPath");
|
|
29
30
|
function ActivityDetail(props) {
|
|
30
31
|
var theme = (0, ThemeProvider_1.useTheme)();
|
|
31
32
|
var activityData = props.activityData;
|
|
@@ -37,12 +38,12 @@ function ActivityDetail(props) {
|
|
|
37
38
|
var slug = (0, react_2.useMemo)(function () {
|
|
38
39
|
return type === null || type === void 0 ? void 0 : type.slug;
|
|
39
40
|
}, [type]);
|
|
40
|
-
var isIncrease = (0, react_2.useMemo)(function () {
|
|
41
|
-
return slug === type_1.TransactionSlug.DEPOSIT;
|
|
42
|
-
}, [slug]);
|
|
43
41
|
var isReceive = (0, react_2.useMemo)(function () {
|
|
44
42
|
return slug === type_1.TransactionSlug.RECEIVE || slug === type_1.TransactionSlug.DEPOSIT;
|
|
45
43
|
}, [slug]);
|
|
44
|
+
var isIncrease = (0, react_2.useMemo)(function () {
|
|
45
|
+
return isReceive;
|
|
46
|
+
}, [isReceive]);
|
|
46
47
|
var isSwap = (0, react_2.useMemo)(function () {
|
|
47
48
|
return slug === type_1.TransactionSlug.SWAP;
|
|
48
49
|
}, [slug]);
|
|
@@ -90,6 +91,6 @@ function ActivityDetail(props) {
|
|
|
90
91
|
fontSize: theme.typography.fontSize12,
|
|
91
92
|
textTransform: "capitalize",
|
|
92
93
|
color: getStatusColor(),
|
|
93
|
-
}, children: status })] }))] }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.paper), { p: 0, width: "100%" }), children: [isReceive && ((0, jsx_runtime_1.jsx)(CopyTextComponent_1.default, { value: activityData === null || activityData === void 0 ? void 0 : activityData.from_address, children: (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g4 }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.valueDescription), children: "From" }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.value), { wordBreak: "break-all", textAlign: "left" }), children: activityData === null || activityData === void 0 ? void 0 : activityData.from_address })] }) })), !!toAddress && ((0, jsx_runtime_1.jsx)(CopyTextComponent_1.default, { value: toAddress, children: (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g4 }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.valueDescription), children: "Recipient address" }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.value), { wordBreak: "break-all", textAlign: "left" }), children: toAddress })] }) }))] })] }));
|
|
94
|
+
}, children: status })] }))] }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.paper), { p: 0, width: "100%" }), children: [isReceive && ((0, jsx_runtime_1.jsx)(CopyTextComponent_1.default, { value: activityData === null || activityData === void 0 ? void 0 : activityData.from_address, children: (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g4 }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.valueDescription), children: "From" }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g24, alignItems: "center" }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.value), { wordBreak: "break-all", textAlign: "left" }), children: activityData === null || activityData === void 0 ? void 0 : activityData.from_address }), (0, jsx_runtime_1.jsx)(material_1.SvgIcon, { sx: { width: 16, height: 16 }, children: SvgPath_1.IC_COPY })] })] }) })), !!toAddress && ((0, jsx_runtime_1.jsx)(CopyTextComponent_1.default, { value: toAddress, children: (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g4 }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.valueDescription), children: "Recipient address" }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g24, alignItems: "center" }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.value), { wordBreak: "break-all", textAlign: "left" }), children: toAddress }), (0, jsx_runtime_1.jsx)(material_1.SvgIcon, { sx: { width: 16, height: 16 }, children: SvgPath_1.IC_COPY })] })] }) }))] })] }));
|
|
94
95
|
}
|
|
95
96
|
exports.default = ActivityDetail;
|
|
@@ -92,10 +92,10 @@ function ActivityItem(props) {
|
|
|
92
92
|
}, [isIncrease, theme]);
|
|
93
93
|
if (!activityData)
|
|
94
94
|
return null;
|
|
95
|
-
return ((0, jsx_runtime_1.jsxs)(material_1.ListItemButton, __assign({ sx: __assign(__assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g8, backgroundColor: theme.palette.background.tertiary, borderRadius: theme.mixins.customRadius.r16, p: theme.mixins.customPadding.
|
|
95
|
+
return ((0, jsx_runtime_1.jsxs)(material_1.ListItemButton, __assign({ sx: __assign(__assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g8, backgroundColor: theme.palette.background.tertiary, borderRadius: theme.mixins.customRadius.r16, backdropFilter: "blur(12px)", p: theme.mixins.customPadding.p16, flexGrow: "unset" }), sx) }, rest, { children: [(0, jsx_runtime_1.jsx)(material_1.Box, { sx: {
|
|
96
96
|
width: "fit-content",
|
|
97
97
|
height: "fit-content",
|
|
98
|
-
}, children: (0, jsx_runtime_1.jsx)(Icon_1.default, { src: type === null || type === void 0 ? void 0 : type.link, width: 28, sx: { borderRadius: theme.mixins.customRadius.full } }) }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { width: "fit-content", gap: theme.mixins.gaps.
|
|
98
|
+
}, children: (0, jsx_runtime_1.jsx)(Icon_1.default, { src: type === null || type === void 0 ? void 0 : type.link, width: 28, sx: { borderRadius: theme.mixins.customRadius.full } }) }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { width: "fit-content", gap: theme.mixins.gaps.g4 }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: theme.mixins.activityTitle, children: type === null || type === void 0 ? void 0 : type.name }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: theme.mixins.activityDescription, children: descriptionElement }), status !== type_1.TransactionStatus.Success && ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g4 }), children: [status === type_1.TransactionStatus.Processing && ((0, jsx_runtime_1.jsx)(material_1.CircularProgress, { size: 12, sx: {
|
|
99
99
|
color: theme.palette.text.loadingStatus,
|
|
100
100
|
} })), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
|
|
101
101
|
fontSize: theme.typography.fontSize12,
|
|
@@ -52,7 +52,7 @@ var AnalyticGroup = function (props) {
|
|
|
52
52
|
fontSize: theme.typography.fontSize12,
|
|
53
53
|
}, children: (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign(__assign({}, theme.mixins.row), theme.mixins.value), { alignItems: "baseline", fontSize: theme.typography.fontSize20, gap: theme.mixins.gaps.g2 }), children: isShowBalance ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Formatter_1.default, { sx: { fontWeight: theme.typography.fontWeight700 }, value: totalBalanceInUSD, unit: "USD", hideUnitOutSide: true }), !!totalBalanceInUSD && ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g2 }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
|
|
54
54
|
fontWeight: theme.typography.fontWeight400,
|
|
55
|
-
fontSize: "
|
|
55
|
+
fontSize: "1em",
|
|
56
56
|
}, children: "$" }), false && ((0, jsx_runtime_1.jsx)(material_1.SvgIcon, { sx: { cursor: "pointer", width: 8, height: 8 }, children: SvgPath_1.ARROW_DROP_DOWN }))] }))] })) : ((0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
|
|
57
57
|
fontSize: theme.typography.fontSize24,
|
|
58
58
|
fontWeight: theme.typography.fontWeight700,
|
|
@@ -40,7 +40,7 @@ var Button = function (props) {
|
|
|
40
40
|
};
|
|
41
41
|
Button.displayName = "Button";
|
|
42
42
|
Button.Primary = function (props) {
|
|
43
|
-
var children = props.children, _a = props.status, status = _a === void 0 ? BUTTON_STATUS.ENABLED : _a, sx = props.sx, rest = __rest(props, ["children", "status", "sx"]);
|
|
43
|
+
var children = props.children, _a = props.status, status = _a === void 0 ? BUTTON_STATUS.ENABLED : _a, sx = props.sx, loading = props.loading, rest = __rest(props, ["children", "status", "sx", "loading"]);
|
|
44
44
|
var theme = (0, ThemeProvider_1.useTheme)();
|
|
45
45
|
// const disabledStyles: Record<string, SxProps> = {
|
|
46
46
|
// [BUTTON_STATUS.LOADING]: {
|
|
@@ -56,7 +56,7 @@ Button.Primary = function (props) {
|
|
|
56
56
|
// color: theme.palette.text.white24,
|
|
57
57
|
// },
|
|
58
58
|
// };
|
|
59
|
-
return ((0, jsx_runtime_1.jsxs)(Button, __assign({}, rest, { variant: "contained", status: status, sx: __assign({ backgroundColor: theme.palette.background.primary, color: theme.palette.text.secondary, borderRadius: theme.mixins.customRadius.r12, textTransform: "capitalize", position: "relative", px: theme.mixins.customPadding.p16, py: theme.mixins.customPadding.p12, fontWeight: theme.typography.fontWeight500, fontSize: theme.typography.fontSize14, lineHeight: theme.typography.leading100 }, sx), disabled: status !== BUTTON_STATUS.ENABLED, children: [status === BUTTON_STATUS.LOADING && ((0, jsx_runtime_1.jsx)(material_1.Box, { sx: {
|
|
59
|
+
return ((0, jsx_runtime_1.jsxs)(Button, __assign({}, rest, { variant: "contained", status: status, sx: __assign({ backgroundColor: theme.palette.background.primary, color: theme.palette.text.secondary, borderRadius: theme.mixins.customRadius.r12, textTransform: "capitalize", position: "relative", px: theme.mixins.customPadding.p16, py: theme.mixins.customPadding.p12, fontWeight: theme.typography.fontWeight500, fontSize: theme.typography.fontSize14, lineHeight: theme.typography.leading100 }, sx), disabled: status !== BUTTON_STATUS.ENABLED, loading: loading || status === BUTTON_STATUS.LOADING, children: [status === BUTTON_STATUS.LOADING && ((0, jsx_runtime_1.jsx)(material_1.Box, { sx: {
|
|
60
60
|
position: "absolute",
|
|
61
61
|
inset: 0,
|
|
62
62
|
display: "flex",
|
|
@@ -5,7 +5,7 @@ var react_1 = require("react");
|
|
|
5
5
|
function DelayMounted(_a) {
|
|
6
6
|
var children = _a.children, _b = _a.delay, delay = _b === void 0 ? 1000 : _b;
|
|
7
7
|
var _c = (0, react_1.useState)(false), allowMount = _c[0], setAllowMount = _c[1];
|
|
8
|
-
(0, react_1.
|
|
8
|
+
(0, react_1.useLayoutEffect)(function () {
|
|
9
9
|
var timeout = setTimeout(function () {
|
|
10
10
|
setAllowMount(true);
|
|
11
11
|
}, delay);
|
|
@@ -33,7 +33,7 @@ var SvgPath_1 = require("../SvgPath");
|
|
|
33
33
|
function ListItemCustom(_a) {
|
|
34
34
|
var title = _a.title, description = _a.description, icon = _a.icon, rightIcon = _a.rightIcon, hideDefaultRightIcon = _a.hideDefaultRightIcon, sx = _a.sx, recommended = _a.recommended, hideTag = _a.hideTag, rest = __rest(_a, ["title", "description", "icon", "rightIcon", "hideDefaultRightIcon", "sx", "recommended", "hideTag"]);
|
|
35
35
|
var theme = (0, ThemeProvider_1.useTheme)();
|
|
36
|
-
return ((0, jsx_runtime_1.jsxs)(material_1.ListItemButton, __assign({}, rest, { sx: __assign(__assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g12, padding: "calc(".concat(theme.mixins.customPadding.p16, " + 6px) ").concat(theme.mixins.customPadding.p16), border: "1px solid ".concat(theme.palette.border.accent3), borderRadius: theme.mixins.customRadius.r16, backgroundColor: theme.palette.background.white, position: "relative", overflow: "hidden" }), sx), children: [!hideTag && ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: {
|
|
36
|
+
return ((0, jsx_runtime_1.jsxs)(material_1.ListItemButton, __assign({}, rest, { sx: __assign(__assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g12, padding: "calc(".concat(theme.mixins.customPadding.p16, " + 6px) ").concat(theme.mixins.customPadding.p16), border: "1px solid ".concat(theme.palette.border.accent3), borderRadius: theme.mixins.customRadius.r16, backgroundColor: theme.palette.background.white, backdropFilter: "blur(12px)", position: "relative", overflow: "hidden" }), sx), children: [!hideTag && ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: {
|
|
37
37
|
position: "absolute",
|
|
38
38
|
top: "-9px",
|
|
39
39
|
left: "-1px",
|
|
@@ -40,6 +40,8 @@ var NetworkSelection = function (props) {
|
|
|
40
40
|
var networkData = (0, react_1.useMemo)(function () { return (0, parsePropsData_1.default)(networkDataString); }, [networkDataString]);
|
|
41
41
|
return ((0, jsx_runtime_1.jsxs)(material_1.Box, __assign({}, rest, { sx: __assign(__assign({}, theme.mixins.row), { backgroundColor: active
|
|
42
42
|
? "".concat(theme.palette.background.tertiary)
|
|
43
|
-
: "".concat(theme.palette.background.white), padding: theme.mixins.customPadding.p16, borderRadius: theme.mixins.customRadius.
|
|
43
|
+
: "".concat(theme.palette.background.white), backdropFilter: "blur(12px)", padding: theme.mixins.customPadding.p16, borderRadius: theme.mixins.customRadius.r16, border: "1px solid", borderColor: active ? "".concat(theme.palette.primary.main) : "".concat(theme.palette.border.accent3), gap: theme.mixins.gaps.g8, justifyContent: "space-between" }), onClick: function () {
|
|
44
|
+
onClick === null || onClick === void 0 ? void 0 : onClick(networkData);
|
|
45
|
+
}, children: [(0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g8 }), children: [(0, jsx_runtime_1.jsx)(Icon_1.default, { src: networkData === null || networkData === void 0 ? void 0 : networkData.link, sx: { borderRadius: theme.mixins.customRadius.full }, width: 24 }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g2 }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.value), { color: "text.white", whiteSpace: "nowrap", textTransform: "capitalize" }), children: networkData === null || networkData === void 0 ? void 0 : networkData.name }), (0, jsx_runtime_1.jsxs)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.activityDescription), { color: theme.palette.text.accent, fontSize: theme.typography.fontSize13, fontWeight: theme.typography.fontWeight400 }), children: ["Minimum transaction amount:", " ", (0, jsx_runtime_1.jsx)("strong", { children: (0, jsx_runtime_1.jsx)(Formatter_1.default, { value: networkData === null || networkData === void 0 ? void 0 : networkData.min_value, unit: token === null || token === void 0 ? void 0 : token.name }) })] })] })] }), (0, jsx_runtime_1.jsx)(material_1.SvgIcon, { sx: { width: 20, height: 20 }, children: active ? SvgPath_1.IC_CHECK : SvgPath_1.IC_UNCHECK })] })));
|
|
44
46
|
};
|
|
45
47
|
exports.default = NetworkSelection;
|
|
@@ -87,7 +87,6 @@ var Share_1 = __importDefault(require("../Share"));
|
|
|
87
87
|
var NetworkSelection_1 = __importDefault(require("../NetworkSelection"));
|
|
88
88
|
var TokenSelection_1 = __importDefault(require("../TokenSelection"));
|
|
89
89
|
var useReceiveData_1 = __importDefault(require("../../../hooks/useReceiveData"));
|
|
90
|
-
var RequireConnect_1 = __importDefault(require("../RequireConnect"));
|
|
91
90
|
var WaitingData_1 = __importDefault(require("../WaitingData"));
|
|
92
91
|
var EmptyData_1 = __importDefault(require("../EmptyData"));
|
|
93
92
|
var Formatter_1 = __importDefault(require("../Formatter"));
|
|
@@ -107,6 +106,7 @@ var lodash_1 = require("lodash");
|
|
|
107
106
|
var HelpButton_1 = __importDefault(require("./components/HelpButton"));
|
|
108
107
|
var SortGroup_1 = __importStar(require("./components/SortGroup"));
|
|
109
108
|
var SortTool_1 = require("./components/SortTool");
|
|
109
|
+
var DefaultPageLayout_1 = __importDefault(require("../../layouts/DefaultPageLayout"));
|
|
110
110
|
var ReceiveMethods;
|
|
111
111
|
(function (ReceiveMethods) {
|
|
112
112
|
ReceiveMethods["RECEIVE_INTERNAL"] = "Receive internally";
|
|
@@ -429,113 +429,132 @@ exports.ReceiveFunction = (0, react_1.forwardRef)(function (_a, ref) {
|
|
|
429
429
|
var handleClearSearch = function () {
|
|
430
430
|
setSearchValue("");
|
|
431
431
|
};
|
|
432
|
-
return ((0, jsx_runtime_1.jsx)(
|
|
433
|
-
|
|
434
|
-
|
|
435
|
-
|
|
436
|
-
|
|
437
|
-
|
|
438
|
-
|
|
439
|
-
|
|
440
|
-
|
|
441
|
-
|
|
442
|
-
|
|
443
|
-
|
|
444
|
-
|
|
445
|
-
|
|
446
|
-
|
|
447
|
-
|
|
448
|
-
|
|
449
|
-
|
|
450
|
-
|
|
451
|
-
|
|
452
|
-
|
|
453
|
-
|
|
454
|
-
|
|
455
|
-
|
|
456
|
-
|
|
457
|
-
|
|
458
|
-
|
|
459
|
-
|
|
460
|
-
|
|
461
|
-
|
|
462
|
-
|
|
463
|
-
|
|
464
|
-
|
|
465
|
-
|
|
466
|
-
|
|
467
|
-
|
|
468
|
-
|
|
469
|
-
|
|
470
|
-
|
|
471
|
-
|
|
472
|
-
|
|
473
|
-
|
|
474
|
-
|
|
475
|
-
|
|
476
|
-
|
|
477
|
-
|
|
478
|
-
|
|
479
|
-
|
|
480
|
-
|
|
481
|
-
|
|
482
|
-
if (!item)
|
|
483
|
-
return null;
|
|
484
|
-
return ((0, jsx_runtime_1.jsx)(TokenSelection_1.default, { onClick: handleSelectToken, tokenData: stringifiedTokenData, active: (selectedToken === null || selectedToken === void 0 ? void 0 : selectedToken.id) === item.id }, "token_".concat(item.id, "_").concat(index)));
|
|
485
|
-
})] }) }, "slide_step_".concat(ReceiveStep.SELECT_TOKEN)), (0, jsx_runtime_1.jsx)(react_2.SwiperSlide, { children: (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g12, display: isExternal ? "flex" : "none" }), children: [(networks === null || networks === void 0 ? void 0 : networks.length) > 0 && ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.paper), { borderRadius: theme.mixins.customRadius.r16, background: theme.palette.background.accent3, gap: theme.mixins.gaps.g2 }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.fieldTitle), { fontWeight: theme.typography.fontWeight700, color: theme.palette.text.darkContrast }), children: "Choosing a network? Let us help!" }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.activityDescription), { color: theme.palette.text.accent, fontWeight: theme.typography.fontWeight500 }), children: "Select the network used by your sending platform." }), (0, jsx_runtime_1.jsxs)(material_1.Stack, { direction: "row", gap: 0.125, alignItems: "center", children: [(0, jsx_runtime_1.jsx)(DrawerComponent_1.default, { ref: chooseNetworkSupportDrawerRef, sx: {
|
|
486
|
-
mt: 0.25,
|
|
487
|
-
}, trigger: (0, jsx_runtime_1.jsx)(Text_1.default, { component: "div", sx: {
|
|
488
|
-
color: theme.palette.primary.main,
|
|
489
|
-
fontWeight: theme.typography.fontWeight600,
|
|
490
|
-
fontSize: theme.typography.fontSize10,
|
|
491
|
-
lineHeight: "100%",
|
|
492
|
-
}, children: "Learn more" }), children: (0, jsx_runtime_1.jsx)(ModalLayout_1.default, { title: "How to choose my top up network", onClose: closeChooseNetworkSupport, 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)(Text_1.default, { component: "div", sx: __assign(__assign({}, theme.mixins.listDescription), { color: theme.palette.text.blackContrast }), children: "Lorem ipsum dolor sit amet consectetur. Vitae faucibus ornare lectus arcu sit sed et. Eu integer pharetra posuere lobortis varius dapibus risus. Pellentesque quis id diam ante lectus ornare tristique." }), (0, jsx_runtime_1.jsx)(Text_1.default, { component: "div", sx: __assign(__assign({}, theme.mixins.listDescription), { color: theme.palette.text.blackContrast }), children: "Eget viverra quis facilisis velit mattis. Risus sed egestas vitae ridiculus odio sit eu adipiscing. Scelerisque nunc nec nisl mauris venenatis viverra est dictumst adipiscing." }), (0, jsx_runtime_1.jsx)(Text_1.default, { component: "div", sx: __assign(__assign({}, theme.mixins.listDescription), { color: theme.palette.text.blackContrast }), children: "Id pulvinar aliquam quam ut sed ut pharetra turpis ipsum. Condimentum eget a interdum neque sagittis lobortis proin nisi. Magna id massa risus elit at." })] }) }) }), (0, jsx_runtime_1.jsx)(material_1.SvgIcon, { sx: { width: 6, height: 6, mt: "4px" }, children: (0, jsx_runtime_1.jsx)("svg", { width: "4", height: "6", viewBox: "0 0 4 6", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: (0, jsx_runtime_1.jsx)("path", { d: "M3.7 3L0.7 6L0 5.3L2.3 3L0 0.7L0.7 0L3.7 3Z", fill: "#044C2F" }) }) })] })] })), networks === null || networks === void 0 ? void 0 : networks.map(function (item, index) {
|
|
493
|
-
if (!item)
|
|
494
|
-
return null;
|
|
495
|
-
return ((0, jsx_runtime_1.jsx)(NetworkSelection_1.default, { onClick: handleSelectNetwork, networkData: JSON.stringify(item), active: (selectedNetwork === null || selectedNetwork === void 0 ? void 0 : selectedNetwork.id) === item.id, token: selectedToken }, "network_".concat(item.id, "_").concat(index)));
|
|
496
|
-
})] }) }, "slide_step_".concat(ReceiveStep.SELECT_NETWORK)), (0, jsx_runtime_1.jsx)(react_2.SwiperSlide, { children: (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: {
|
|
497
|
-
display: "flex",
|
|
498
|
-
flexDirection: "column",
|
|
499
|
-
gap: theme.mixins.gaps.g16,
|
|
500
|
-
}, children: [(0, jsx_runtime_1.jsx)("div", { id: "share-receive-info", children: (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({ width: "100%" }, theme.mixins.column), { gap: theme.mixins.gaps.g12, backgroundColor: theme.palette.background.tertiary, borderRadius: theme.mixins.customRadius.r16, padding: theme.mixins.customPadding.p16, paddingTop: "5rem", alignItems: "flex-start", position: "relative", marginTop: "4.6875rem" }), children: [(0, jsx_runtime_1.jsx)(material_1.Divider, { sx: {
|
|
501
|
-
color: theme.palette.border.accent,
|
|
502
|
-
width: "100%",
|
|
503
|
-
} }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.center), { top: 0, width: "fit-content", height: "fit-content", borderRadius: theme.mixins.customRadius.r12, padding: theme.mixins.customPadding.p8 }), children: [(0, jsx_runtime_1.jsx)(QRCode_1.default, { value: qrCodeValue, logo: selectedToken === null || selectedToken === void 0 ? void 0 : selectedToken.link, bgColor: "transparent", size: 150 }), (0, jsx_runtime_1.jsx)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.center), { padding: theme.mixins.customPadding.p4, borderRadius: 9999, backgroundColor: theme.palette.background.white }), children: (0, jsx_runtime_1.jsx)(Icon_1.default, { crossOrigin: "anonymous", width: 24, height: 24, src: selectedToken === null || selectedToken === void 0 ? void 0 : selectedToken.link, sx: {
|
|
504
|
-
borderRadius: 9999,
|
|
505
|
-
} }) })] }), isExternal && ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g4 }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.valueDescription), children: "Network" }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign({}, theme.mixins.row), onClick: handleBack, children: [(0, jsx_runtime_1.jsxs)(material_1.Box, { component: "button", sx: __assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g4, cursor: "pointer", transition: "transform 0.3s ease-in-out", "&:active": {
|
|
506
|
-
transform: "translateX(0.5rem)",
|
|
507
|
-
} }), children: [(0, jsx_runtime_1.jsx)(Icon_1.default, { width: 24, height: 24, sx: {
|
|
508
|
-
borderRadius: "9999px",
|
|
509
|
-
}, src: selectedNetwork === null || selectedNetwork === void 0 ? void 0 : selectedNetwork.link }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.value), children: selectedNetwork === null || selectedNetwork === void 0 ? void 0 : selectedNetwork.name })] }), (0, jsx_runtime_1.jsx)(material_1.SvgIcon, { sx: {
|
|
510
|
-
width: 12,
|
|
511
|
-
height: 12,
|
|
512
|
-
ml: "auto",
|
|
513
|
-
transform: "rotate(90deg)",
|
|
514
|
-
}, children: SvgPath_1.IC_CHEVRON_RIGHT })] })] })), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g4 }), children: [(0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g4 }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.valueDescription), children: isInternal ? "Internal address" : "Address" }), isInternal && ((0, jsx_runtime_1.jsx)(CustomTooltip_1.default, { trigger: (0, jsx_runtime_1.jsx)(material_1.SvgIcon, { sx: { width: 16, height: 16, mb: "3px" }, children: SvgPath_1.IC_TOOLTIP }), children: (0, jsx_runtime_1.jsx)(DialogContentLayout_1.default, { content: (0, jsx_runtime_1.jsxs)(Text_1.default, { sx: __assign({}, theme.mixins.warning), children: ["This address is used to receive token by internal transfer. You can not use it for blockchain transaction. If you want to receive token by blockchain, please select the ", (0, jsx_runtime_1.jsx)("strong", { children: "Receive External" }), " method instead."] }) }) }))] }), (0, jsx_runtime_1.jsxs)(CopyTextComponent_1.default, { sx: __assign(__assign({}, theme.mixins.row), { justifyContent: "space-between" }), value: receiveAddress || "", children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.value), { wordBreak: "break-all", maxWidth: "85%" }), children: receiveAddress }), (0, jsx_runtime_1.jsx)(material_1.SvgIcon, { sx: { width: 20, height: 20 }, children: SvgPath_1.IC_COPY })] })] }), (!!userInfo || !!amount || isExternal || !!warningMessage) && ((0, jsx_runtime_1.jsx)(material_1.Divider, { sx: {
|
|
515
|
-
color: theme.palette.border.accent,
|
|
516
|
-
width: "100%",
|
|
517
|
-
} })), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({ width: "100%" }, theme.mixins.column), { gap: theme.mixins.gaps.g12 }), children: [!!userInfo && ((0, jsx_runtime_1.jsx)(LineValue_1.default, { sx: {
|
|
518
|
-
alignItems: "start",
|
|
519
|
-
}, field: (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.valueDescription), { color: theme.palette.text.accent, fontSize: theme.typography.fontSize13 }), children: "Received user" }), 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, { width: 16, height: 16, src: userInfo === null || userInfo === void 0 ? void 0 : userInfo.avatar, sx: {
|
|
520
|
-
borderRadius: "9999px",
|
|
521
|
-
} }), (0, jsx_runtime_1.jsx)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g2 }), children: (0, jsx_runtime_1.jsxs)(Text_1.default, { children: [userInfo === null || userInfo === void 0 ? void 0 : userInfo.nickname, " "] }) })] }), valueDescription: (0, jsx_runtime_1.jsx)(Text_1.default, { children: userInfo === null || userInfo === void 0 ? void 0 : userInfo.username }) })), !!amount && ((0, jsx_runtime_1.jsx)(LineValue_1.default, { field: (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.valueDescription), { color: theme.palette.text.accent, fontSize: theme.typography.fontSize13 }), children: "Amount" }), value: (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.value), { fontSize: theme.typography.fontSize13 }), children: (0, jsx_runtime_1.jsx)(Formatter_1.default, { value: amount, unit: " ".concat(selectedToken === null || selectedToken === void 0 ? void 0 : selectedToken.name) }) }) })), isExternal && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(LineValue_1.default, { field: (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.valueDescription), { color: theme.palette.text.accent, fontSize: theme.typography.fontSize13 }), children: "Top Up Arrival Time" }), value: (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.value), { fontSize: theme.typography.fontSize13 }), children: "~ 7 Minutes" }) }), (0, jsx_runtime_1.jsx)(LineValue_1.default, { field: (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.valueDescription), { color: theme.palette.text.accent, fontSize: theme.typography.fontSize13 }), children: "Withdrawal Arrival Time" }), value: (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.value), { fontSize: theme.typography.fontSize13 }), children: "~ 20 Minutes" }) })] }))] }), !!warningMessage && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Divider, { sx: {
|
|
522
|
-
color: theme.palette.border.accent,
|
|
523
|
-
width: "100%",
|
|
524
|
-
mt: theme.mixins.customMargin.m12,
|
|
525
|
-
} }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.valueDescription), children: warningMessage })] }))] }) }), isInternal && ((0, jsx_runtime_1.jsx)(DrawerComponent_1.default, { ref: amountDrawerRef, sx: {
|
|
526
|
-
width: "100%",
|
|
527
|
-
display: "flex",
|
|
528
|
-
justifyContent: "center",
|
|
529
|
-
}, onOpen: handleAmountModalOpen, onClose: onCloseAmountModal, trigger: (0, jsx_runtime_1.jsx)(xhub_keyboard_1.Label, { htmlFor: keyboardId, children: (0, jsx_runtime_1.jsxs)(Button_1.default.Text, { sx: {
|
|
530
|
-
fontSize: theme.typography.fontSize14,
|
|
531
|
-
textTransform: "none",
|
|
432
|
+
return ((0, jsx_runtime_1.jsx)(DrawerComponent_1.default, { ref: drawerRef, trigger: props.children, onOpen: props.onOpen, onClose: handleOnClose, sx: props.sx, children: (0, jsx_runtime_1.jsx)(ModalLayout_1.default, { title: RECEIVE_STEP_NAME[ReceiveStep.SELECT_METHOD], onClose: close, children: (0, jsx_runtime_1.jsx)(DrawerComponent_1.default, { ref: stepDrawerRef, direction: DrawerComponent_1.DRAWER_DIRECTION.RIGHT, sx: {
|
|
433
|
+
width: "100%",
|
|
434
|
+
}, trigger: (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g12, height: "fit-content", width: "100%" }), children: [functionsList.includes(ReceiveMethods.RECEIVE_INTERNAL) && ((0, jsx_runtime_1.jsx)(ListItemCustom_1.default, { title: "Top up via internal transfer", description: "Receive crypto from other Ting users", icon: (0, jsx_runtime_1.jsx)(material_1.SvgIcon, { sx: { width: 24, height: 24 }, children: SvgPath_1.IC_RECEIVE_INTERNAL }), onClick: function () { return handleSelectMethod(ReceiveMethods.RECEIVE_INTERNAL); }, recommended: true })), functionsList.includes(ReceiveMethods.RECEIVE_EXTERNAL) && ((0, jsx_runtime_1.jsx)(ListItemCustom_1.default, { title: "Top up via blockchain", description: "Deposit using a Web3 or an Exchange wallet", icon: (0, jsx_runtime_1.jsx)(material_1.SvgIcon, { sx: { width: 24, height: 24 }, children: SvgPath_1.IC_RECEIVE_EXTERNAL }), onClick: function () { return handleSelectMethod(ReceiveMethods.RECEIVE_EXTERNAL); }, recommended: true })), functionsList.includes(ReceiveMethods.RECEIVE_FIAT) && ((0, jsx_runtime_1.jsx)(FiatDeposit_1.default, { children: (0, jsx_runtime_1.jsx)(ListItemCustom_1.default, { title: "Fiat-Gateway", description: "Experimental deposit via bank transfer", icon: (0, jsx_runtime_1.jsx)(material_1.SvgIcon, { sx: { width: 24, height: 24 }, children: SvgPath_1.IC_RECEIVE_EXTERNAL }), recommended: false, onClick: function () { return handleSelectMethod(ReceiveMethods.RECEIVE_FIAT); } }) }))] }), children: (0, jsx_runtime_1.jsx)(ChildPageLayout_1.default, { sx: {
|
|
435
|
+
position: "relative",
|
|
436
|
+
sx: "100dvh",
|
|
437
|
+
}, sxs: {
|
|
438
|
+
body: {
|
|
439
|
+
height: "100%",
|
|
440
|
+
overflowY: "hidden",
|
|
441
|
+
},
|
|
442
|
+
}, header: (0, jsx_runtime_1.jsx)(PageHeader_1.default, { title: RECEIVE_STEP_NAME[Math.max(currentStep, ReceiveStep.SELECT_TOKEN)], overrideBack: handleBack, children: false && ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g8, marginLeft: "auto" }), children: [(0, jsx_runtime_1.jsx)(HelpButton_1.default, {}), !!handleGotoHistory && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Divider, { orientation: "vertical", sx: {
|
|
443
|
+
height: "1rem",
|
|
444
|
+
width: "1px",
|
|
445
|
+
backgroundColor: theme.palette.border.accent3,
|
|
446
|
+
} }), (0, jsx_runtime_1.jsx)(material_1.SvgIcon, { sx: { width: 20, height: 20, display: "block" }, onClick: handleGotoHistory, children: SvgPath_1.IC_HISTORY })] }))] })) }), footer: (0, jsx_runtime_1.jsx)(material_1.Box, { sx: {
|
|
447
|
+
maxHeight: currentStep === ReceiveStep.SHOW_QR_CODE ? "120px" : 0,
|
|
448
|
+
overflow: "hidden",
|
|
449
|
+
transition: currentStep === ReceiveStep.SHOW_QR_CODE
|
|
450
|
+
? "max-height 0.3s linear 0.3s"
|
|
451
|
+
: "max-height 0s linear",
|
|
452
|
+
}, children: (0, jsx_runtime_1.jsx)(Share_1.default, { elementId: "share-receive-info", onProgress: handleShareProgress, onFinish: handleShareFinish, imageName: sharedImageName, children: (0, jsx_runtime_1.jsx)(BottomActionLayout_1.default, { children: (0, jsx_runtime_1.jsx)(Button_1.default.Primary, { fullWidth: true, status: isSharing ? Button_1.BUTTON_STATUS.LOADING : undefined, children: "Share" }) }) }) }), children: (0, jsx_runtime_1.jsxs)(SwiperControlled_1.default, { ref: stepSwiperRef, swiperProps: {
|
|
453
|
+
spaceBetween: 32,
|
|
454
|
+
}, disableSwipe: true, initialActiveTab: currentStep - 1, sx: {
|
|
455
|
+
height: "100%",
|
|
456
|
+
}, swiperStyle: {
|
|
457
|
+
height: "100%",
|
|
458
|
+
overflowY: "hidden",
|
|
459
|
+
}, children: [(0, jsx_runtime_1.jsx)(react_2.SwiperSlide, { style: {
|
|
460
|
+
height: "100%",
|
|
461
|
+
overflow: "hidden",
|
|
462
|
+
}, children: (0, jsx_runtime_1.jsx)(ChildPageLayout_1.default, { children: (0, jsx_runtime_1.jsx)(DefaultPageLayout_1.default, { children: (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g12, height: "fit-content" }), children: [(0, jsx_runtime_1.jsxs)(material_1.Box, { sx: {
|
|
463
|
+
position: "sticky",
|
|
464
|
+
backgroundColor: theme.palette.background.white,
|
|
465
|
+
zIndex: 100,
|
|
466
|
+
top: "0px",
|
|
467
|
+
pb: theme.mixins.customPadding.p12,
|
|
468
|
+
}, children: [!isEmptyDepositTokens && ((0, jsx_runtime_1.jsx)(material_1.InputBase, { onChange: handleSearch, startAdornment: (0, jsx_runtime_1.jsx)(material_1.InputAdornment, { position: "start", children: (0, jsx_runtime_1.jsx)(material_1.SvgIcon, { sx: { width: 20, height: 20 }, children: SvgPath_1.IC_SEARCH }) }), value: searchValue, placeholder: "Search", sx: {
|
|
469
|
+
borderRadius: theme.mixins.customRadius.r12,
|
|
470
|
+
border: "1px solid",
|
|
471
|
+
borderColor: theme.palette.border.accent3,
|
|
472
|
+
background: theme.palette.background.white,
|
|
473
|
+
color: theme.palette.text.black,
|
|
474
|
+
py: theme.mixins.customPadding.p6,
|
|
475
|
+
px: theme.mixins.customPadding.p12,
|
|
476
|
+
fontSize: theme.typography.fontSize16,
|
|
477
|
+
width: "100%",
|
|
478
|
+
lineHeight: "100%",
|
|
479
|
+
"input::placeholder": {
|
|
480
|
+
fontSize: theme.typography.fontSize12,
|
|
481
|
+
pl: theme.mixins.customPadding.p4,
|
|
532
482
|
fontWeight: theme.typography.fontWeight500,
|
|
533
|
-
|
|
534
|
-
|
|
535
|
-
|
|
536
|
-
|
|
537
|
-
|
|
538
|
-
|
|
483
|
+
color: theme.palette.text.black,
|
|
484
|
+
lineHeight: "100%",
|
|
485
|
+
},
|
|
486
|
+
}, endAdornment: (0, jsx_runtime_1.jsx)(material_1.InputAdornment, { position: "end", sx: {
|
|
487
|
+
visibility: isSearching ? "visible" : "hidden",
|
|
488
|
+
}, children: (0, jsx_runtime_1.jsx)(material_1.SvgIcon, { sx: {
|
|
489
|
+
width: 20,
|
|
490
|
+
height: 20,
|
|
491
|
+
p: theme.mixins.customPadding.p4,
|
|
492
|
+
cursor: "pointer",
|
|
493
|
+
}, onClick: handleClearSearch, children: SvgPath_1.IC_CLOSE }) }) })), (tokenRender === null || tokenRender === void 0 ? void 0 : tokenRender.length) > 0 && (0, jsx_runtime_1.jsx)(SortGroup_1.default, { onChange: handleSort })] }), isLoadingDepositTokens && (0, jsx_runtime_1.jsx)(WaitingData_1.default, {}), isEmptyDepositTokens && ((0, jsx_runtime_1.jsx)(EmptyData_1.default, { sx: { py: "4rem" }, title: "No deposit tokens", description: "No deposit tokens" })), isSearching && isEmptySearch && ((0, jsx_runtime_1.jsx)(EmptyData_1.default, { sx: { py: "4rem" }, title: "No search results", description: "Let's try again with a different search" })), tokenRender === null || tokenRender === void 0 ? void 0 : tokenRender.map(function (item, index) {
|
|
494
|
+
var stringifiedTokenData = JSON.stringify(item);
|
|
495
|
+
if (!item)
|
|
496
|
+
return null;
|
|
497
|
+
return ((0, jsx_runtime_1.jsx)(TokenSelection_1.default, { onClick: handleSelectToken, tokenData: stringifiedTokenData, active: (selectedToken === null || selectedToken === void 0 ? void 0 : selectedToken.id) === item.id }, "token_".concat(item.id, "_").concat(index)));
|
|
498
|
+
})] }) }) }) }, "slide_step_".concat(ReceiveStep.SELECT_TOKEN)), (0, jsx_runtime_1.jsx)(react_2.SwiperSlide, { style: {
|
|
499
|
+
height: "100%",
|
|
500
|
+
overflow: "hidden",
|
|
501
|
+
}, children: (0, jsx_runtime_1.jsx)(ChildPageLayout_1.default, { children: (0, jsx_runtime_1.jsx)(DefaultPageLayout_1.default, { children: (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g12, display: isExternal ? "flex" : "none" }), children: [(networks === null || networks === void 0 ? void 0 : networks.length) > 0 && ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.paper), { borderRadius: theme.mixins.customRadius.r16, background: theme.palette.background.accent3, gap: theme.mixins.gaps.g2 }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.fieldTitle), { fontWeight: theme.typography.fontWeight700, color: theme.palette.text.darkContrast }), children: "Choosing a network? Let us help!" }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.activityDescription), { color: theme.palette.text.accent, fontWeight: theme.typography.fontWeight500 }), children: "Select the network used by your sending platform." }), (0, jsx_runtime_1.jsxs)(material_1.Stack, { direction: "row", gap: 0.125, alignItems: "center", children: [(0, jsx_runtime_1.jsx)(DrawerComponent_1.default, { ref: chooseNetworkSupportDrawerRef, sx: {
|
|
502
|
+
mt: 0.25,
|
|
503
|
+
}, trigger: (0, jsx_runtime_1.jsx)(Text_1.default, { component: "div", sx: {
|
|
504
|
+
color: theme.palette.primary.main,
|
|
505
|
+
fontWeight: theme.typography.fontWeight600,
|
|
506
|
+
fontSize: theme.typography.fontSize10,
|
|
507
|
+
lineHeight: "100%",
|
|
508
|
+
}, children: "Learn more" }), children: (0, jsx_runtime_1.jsx)(ModalLayout_1.default, { title: "How to choose my top up network", onClose: closeChooseNetworkSupport, 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)(Text_1.default, { component: "div", sx: __assign(__assign({}, theme.mixins.listDescription), { color: theme.palette.text.blackContrast }), children: "Lorem ipsum dolor sit amet consectetur. Vitae faucibus ornare lectus arcu sit sed et. Eu integer pharetra posuere lobortis varius dapibus risus. Pellentesque quis id diam ante lectus ornare tristique." }), (0, jsx_runtime_1.jsx)(Text_1.default, { component: "div", sx: __assign(__assign({}, theme.mixins.listDescription), { color: theme.palette.text.blackContrast }), children: "Eget viverra quis facilisis velit mattis. Risus sed egestas vitae ridiculus odio sit eu adipiscing. Scelerisque nunc nec nisl mauris venenatis viverra est dictumst adipiscing." }), (0, jsx_runtime_1.jsx)(Text_1.default, { component: "div", sx: __assign(__assign({}, theme.mixins.listDescription), { color: theme.palette.text.blackContrast }), children: "Id pulvinar aliquam quam ut sed ut pharetra turpis ipsum. Condimentum eget a interdum neque sagittis lobortis proin nisi. Magna id massa risus elit at." })] }) }) }), (0, jsx_runtime_1.jsx)(material_1.SvgIcon, { sx: { width: 6, height: 6, mt: "4px" }, children: (0, jsx_runtime_1.jsx)("svg", { width: "4", height: "6", viewBox: "0 0 4 6", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: (0, jsx_runtime_1.jsx)("path", { d: "M3.7 3L0.7 6L0 5.3L2.3 3L0 0.7L0.7 0L3.7 3Z", fill: "#044C2F" }) }) })] })] })), networks === null || networks === void 0 ? void 0 : networks.map(function (item, index) {
|
|
509
|
+
if (!item)
|
|
510
|
+
return null;
|
|
511
|
+
return ((0, jsx_runtime_1.jsx)(NetworkSelection_1.default, { onClick: handleSelectNetwork, networkData: JSON.stringify(item), active: (selectedNetwork === null || selectedNetwork === void 0 ? void 0 : selectedNetwork.id) === item.id, token: selectedToken }, "network_".concat(item.id, "_").concat(index)));
|
|
512
|
+
})] }) }) }) }, "slide_step_".concat(ReceiveStep.SELECT_NETWORK)), (0, jsx_runtime_1.jsx)(react_2.SwiperSlide, { style: {
|
|
513
|
+
height: "100%",
|
|
514
|
+
overflow: "hidden",
|
|
515
|
+
}, children: (0, jsx_runtime_1.jsx)(ChildPageLayout_1.default, { children: (0, jsx_runtime_1.jsx)(DefaultPageLayout_1.default, { children: (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: {
|
|
516
|
+
display: "flex",
|
|
517
|
+
flexDirection: "column",
|
|
518
|
+
gap: theme.mixins.gaps.g16,
|
|
519
|
+
}, children: [(0, jsx_runtime_1.jsx)("div", { id: "share-receive-info", children: (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({ width: "100%" }, theme.mixins.column), { gap: theme.mixins.gaps.g12, backgroundColor: theme.palette.background.tertiary, borderRadius: theme.mixins.customRadius.r16, padding: theme.mixins.customPadding.p16, paddingTop: "5rem", alignItems: "flex-start", position: "relative", marginTop: "4.6875rem" }), children: [(0, jsx_runtime_1.jsx)(material_1.Divider, { sx: {
|
|
520
|
+
color: theme.palette.border.accent,
|
|
521
|
+
width: "100%",
|
|
522
|
+
} }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.center), { top: 0, width: "fit-content", height: "fit-content", borderRadius: theme.mixins.customRadius.r12, padding: theme.mixins.customPadding.p8 }), children: [(0, jsx_runtime_1.jsx)(QRCode_1.default, { value: qrCodeValue, logo: selectedToken === null || selectedToken === void 0 ? void 0 : selectedToken.link, bgColor: "transparent", size: 150 }), (0, jsx_runtime_1.jsx)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.center), { padding: theme.mixins.customPadding.p4, borderRadius: 9999, backgroundColor: theme.palette.background.white }), children: (0, jsx_runtime_1.jsx)(Icon_1.default, { crossOrigin: "anonymous", width: 24, height: 24, src: selectedToken === null || selectedToken === void 0 ? void 0 : selectedToken.link, sx: {
|
|
523
|
+
borderRadius: 9999,
|
|
524
|
+
} }) })] }), isExternal && ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g4 }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.valueDescription), children: "Network" }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign({}, theme.mixins.row), onClick: handleBack, children: [(0, jsx_runtime_1.jsxs)(material_1.Box, { component: "button", sx: __assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g4, cursor: "pointer", transition: "transform 0.3s ease-in-out", "&:active": {
|
|
525
|
+
transform: "translateX(0.5rem)",
|
|
526
|
+
} }), children: [(0, jsx_runtime_1.jsx)(Icon_1.default, { width: 24, height: 24, sx: {
|
|
527
|
+
borderRadius: "9999px",
|
|
528
|
+
}, src: selectedNetwork === null || selectedNetwork === void 0 ? void 0 : selectedNetwork.link }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.value), children: selectedNetwork === null || selectedNetwork === void 0 ? void 0 : selectedNetwork.name })] }), (0, jsx_runtime_1.jsx)(material_1.SvgIcon, { sx: {
|
|
529
|
+
width: 12,
|
|
530
|
+
height: 12,
|
|
531
|
+
ml: "auto",
|
|
532
|
+
transform: "rotate(90deg)",
|
|
533
|
+
}, children: SvgPath_1.IC_CHEVRON_RIGHT })] })] })), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g4 }), children: [(0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g4 }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.valueDescription), children: isInternal ? "Internal address" : "Address" }), isInternal && ((0, jsx_runtime_1.jsx)(CustomTooltip_1.default, { trigger: (0, jsx_runtime_1.jsx)(material_1.SvgIcon, { sx: { width: 16, height: 16, mb: "3px" }, children: SvgPath_1.IC_TOOLTIP }), children: (0, jsx_runtime_1.jsx)(DialogContentLayout_1.default, { content: (0, jsx_runtime_1.jsxs)(Text_1.default, { sx: __assign({}, theme.mixins.warning), children: ["This address is used to receive token by internal transfer. You can not use it for blockchain transaction. If you want to receive token by blockchain, please select the ", (0, jsx_runtime_1.jsx)("strong", { children: "Receive External" }), " method instead."] }) }) }))] }), (0, jsx_runtime_1.jsxs)(CopyTextComponent_1.default, { sx: __assign(__assign({}, theme.mixins.row), { justifyContent: "space-between" }), value: receiveAddress || "", children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.value), { wordBreak: "break-all", maxWidth: "85%" }), children: receiveAddress }), (0, jsx_runtime_1.jsx)(material_1.SvgIcon, { sx: { width: 20, height: 20 }, children: SvgPath_1.IC_COPY })] })] }), (!!userInfo || !!amount || isExternal || !!warningMessage) && ((0, jsx_runtime_1.jsx)(material_1.Divider, { sx: {
|
|
534
|
+
color: theme.palette.border.accent,
|
|
535
|
+
width: "100%",
|
|
536
|
+
} })), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({ width: "100%" }, theme.mixins.column), { gap: theme.mixins.gaps.g12 }), children: [!!userInfo && ((0, jsx_runtime_1.jsx)(LineValue_1.default, { sx: {
|
|
537
|
+
alignItems: "start",
|
|
538
|
+
}, field: (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.valueDescription), { color: theme.palette.text.accent, fontSize: theme.typography.fontSize13 }), children: "Received user" }), 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, { width: 16, height: 16, src: userInfo === null || userInfo === void 0 ? void 0 : userInfo.avatar, sx: {
|
|
539
|
+
borderRadius: "9999px",
|
|
540
|
+
} }), (0, jsx_runtime_1.jsx)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g2 }), children: (0, jsx_runtime_1.jsxs)(Text_1.default, { children: [userInfo === null || userInfo === void 0 ? void 0 : userInfo.nickname, " "] }) })] }), valueDescription: (0, jsx_runtime_1.jsx)(Text_1.default, { children: userInfo === null || userInfo === void 0 ? void 0 : userInfo.username }) })), !!amount && ((0, jsx_runtime_1.jsx)(LineValue_1.default, { field: (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.valueDescription), { color: theme.palette.text.accent, fontSize: theme.typography.fontSize13 }), children: "Amount" }), value: (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.value), { fontSize: theme.typography.fontSize13 }), children: (0, jsx_runtime_1.jsx)(Formatter_1.default, { value: amount, unit: " ".concat(selectedToken === null || selectedToken === void 0 ? void 0 : selectedToken.name) }) }) })), isExternal && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(LineValue_1.default, { field: (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.valueDescription), { color: theme.palette.text.accent, fontSize: theme.typography.fontSize13 }), children: "Top Up Arrival Time" }), value: (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.value), { fontSize: theme.typography.fontSize13 }), children: "~ 7 Minutes" }) }), (0, jsx_runtime_1.jsx)(LineValue_1.default, { field: (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.valueDescription), { color: theme.palette.text.accent, fontSize: theme.typography.fontSize13 }), children: "Withdrawal Arrival Time" }), value: (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.value), { fontSize: theme.typography.fontSize13 }), children: "~ 20 Minutes" }) })] }))] }), !!warningMessage && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Divider, { sx: {
|
|
541
|
+
color: theme.palette.border.accent,
|
|
542
|
+
width: "100%",
|
|
543
|
+
mt: theme.mixins.customMargin.m12,
|
|
544
|
+
} }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.valueDescription), children: warningMessage })] }))] }) }), isInternal && ((0, jsx_runtime_1.jsx)(DrawerComponent_1.default, { ref: amountDrawerRef, sx: {
|
|
545
|
+
width: "100%",
|
|
546
|
+
display: "flex",
|
|
547
|
+
justifyContent: "center",
|
|
548
|
+
}, onOpen: handleAmountModalOpen, onClose: onCloseAmountModal, trigger: (0, jsx_runtime_1.jsx)(xhub_keyboard_1.Label, { htmlFor: keyboardId, children: (0, jsx_runtime_1.jsxs)(Button_1.default.Text, { sx: {
|
|
549
|
+
fontSize: theme.typography.fontSize14,
|
|
550
|
+
textTransform: "none",
|
|
551
|
+
fontWeight: theme.typography.fontWeight500,
|
|
552
|
+
display: "flex",
|
|
553
|
+
alignItems: "center",
|
|
554
|
+
gap: theme.mixins.gaps.g4,
|
|
555
|
+
}, children: [(0, jsx_runtime_1.jsx)(material_1.SvgIcon, { sx: { width: 20, height: 20 }, children: amount ? SvgPath_1.IC_EDIT : SvgPath_1.IC_SET }), amount ? "Edit" : "Set", " amount"] }) }), children: (0, jsx_runtime_1.jsx)(xhub_keyboard_1.Keyboard, { id: keyboardId, onChange: handleChangeAmount, keyboardType: xhub_keyboard_1.KeyboardType.Double, value: inputAmount === null || inputAmount === void 0 ? void 0 : inputAmount.toString(), keyboardId: "amount-keyboard-id", children: (0, jsx_runtime_1.jsx)(ModalLayout_1.default, { onClose: closeAmountModal, title: (0, jsx_runtime_1.jsxs)(Text_1.default, { sx: __assign({}, theme.mixins.fieldTitle), children: [amount ? "Edit" : "Set", " ", selectedToken === null || selectedToken === void 0 ? void 0 : selectedToken.name, " amount"] }), children: (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g12 }), children: [(0, jsx_runtime_1.jsx)(xhub_keyboard_1.Label, { htmlFor: keyboardId, children: (0, jsx_runtime_1.jsx)(xhub_keyboard_1.Input, { ref: amountInputRef, elementsAcceptIds: ["amount-keyboard-id"], value: inputAmount === null || inputAmount === void 0 ? void 0 : inputAmount.toString(), displayType: xhub_keyboard_1.DisplayType.Double, rightElement: (0, jsx_runtime_1.jsx)(Button_1.default.Secondary, { onClick: handleClickMaxAmount, sx: __assign({}, theme.mixins.smallButton), children: "Max" }) }) }), amountError && ((0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.validationError), children: amountError })), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.row), { width: "100%", mt: theme.mixins.customMargin.m8, gap: theme.mixins.gaps.g12 }), children: [!!amount && ((0, jsx_runtime_1.jsx)(Button_1.default.Text, { onClick: handleUnset, children: "Unset" })), (0, jsx_runtime_1.jsx)(Button_1.default.Primary, { sx: { flex: 1 }, onClick: handleContinue, status: !!amountError || !inputAmount
|
|
556
|
+
? Button_1.BUTTON_STATUS.DISABLED
|
|
557
|
+
: Button_1.BUTTON_STATUS.ENABLED, children: "Continue" })] })] }) }) }) }))] }) }) }) }, "slide_step_".concat(ReceiveStep.SHOW_QR_CODE))] }) }) }) }) }));
|
|
539
558
|
});
|
|
540
559
|
exports.ReceiveFunction.displayName = "ReceiveFunction";
|
|
541
560
|
exports.default = exports.ReceiveFunction;
|
|
@@ -1,10 +1,11 @@
|
|
|
1
1
|
import { BoxProps } from "@mui/material";
|
|
2
|
-
interface SmartListProps extends BoxProps {
|
|
2
|
+
export interface SmartListProps extends BoxProps {
|
|
3
3
|
children: React.ReactNode;
|
|
4
4
|
loadMoreData: () => void;
|
|
5
5
|
hasMore: boolean;
|
|
6
6
|
loadingComponent?: React.ReactNode;
|
|
7
7
|
loadingComponentProps?: BoxProps;
|
|
8
|
+
bodySx?: BoxProps;
|
|
8
9
|
}
|
|
9
10
|
declare const SmartList: (props: SmartListProps) => import("react/jsx-runtime").JSX.Element;
|
|
10
11
|
export default SmartList;
|
|
@@ -17,7 +17,7 @@ var material_1 = require("@mui/material");
|
|
|
17
17
|
var ThemeProvider_1 = require("../../../providers/ThemeProvider");
|
|
18
18
|
var react_1 = require("react");
|
|
19
19
|
var SmartList = function (props) {
|
|
20
|
-
var children = props.children, loadMoreData = props.loadMoreData, hasMore = props.hasMore, loadingComponent = props.loadingComponent, loadingComponentProps = props.loadingComponentProps;
|
|
20
|
+
var children = props.children, loadMoreData = props.loadMoreData, hasMore = props.hasMore, loadingComponent = props.loadingComponent, loadingComponentProps = props.loadingComponentProps, bodySx = props.bodySx;
|
|
21
21
|
var theme = (0, ThemeProvider_1.useTheme)();
|
|
22
22
|
var containerRef = (0, react_1.useRef)(null);
|
|
23
23
|
var loadingRef = (0, react_1.useRef)(null);
|
|
@@ -46,6 +46,6 @@ var SmartList = function (props) {
|
|
|
46
46
|
observer.disconnect();
|
|
47
47
|
};
|
|
48
48
|
}, [loadMoreData, hasMore]);
|
|
49
|
-
return ((0, jsx_runtime_1.jsx)(material_1.Box, { sx: __assign({ overflowY: "auto", width: "100%", height: "100%" }, props.sx), ref: containerRef, children: (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { height: "fit-content", my: "auto", gap: 0 }), children: [children, (0, jsx_runtime_1.jsx)("div", { ref: loadingRef }), hasMore && ((0, jsx_runtime_1.jsx)(material_1.Box, { sx: __assign({ width: "100%" }, loadingComponentProps), children: loadingComponent }))] }) }));
|
|
49
|
+
return ((0, jsx_runtime_1.jsx)(material_1.Box, { sx: __assign({ overflowY: "auto", width: "100%", height: "100%" }, props.sx), ref: containerRef, children: (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign(__assign({}, theme.mixins.column), { height: "fit-content", my: "auto", gap: 0 }), bodySx), children: [children, (0, jsx_runtime_1.jsx)("div", { ref: loadingRef }), hasMore && ((0, jsx_runtime_1.jsx)(material_1.Box, { sx: __assign({ width: "100%" }, loadingComponentProps), children: loadingComponent }))] }) }));
|
|
50
50
|
};
|
|
51
51
|
exports.default = SmartList;
|