tek-wallet 0.0.194 → 0.0.196
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/ui/CopyTextComponent/index.js +1 -0
- package/dist/components/ui/DepositFunction/index.js +10 -4
- package/dist/components/ui/QRCode/index.js +2 -2
- package/dist/components/ui/RequireConnect/index.js +1 -1
- package/dist/components/ui/TokenSelection/index.js +3 -1
- package/dist/theme/mui/theme.js +14 -0
- package/package.json +1 -1
|
@@ -92,6 +92,7 @@ var CopyTextComponent = function (_a) {
|
|
|
92
92
|
inset: 0,
|
|
93
93
|
backgroundColor: "rgb(0, 0, 0)",
|
|
94
94
|
backdropFilter: "blur(12px)",
|
|
95
|
+
borderRadius: theme.mixins.theBorderRadius.r12,
|
|
95
96
|
WebkitBackdropFilter: "blur(12px)",
|
|
96
97
|
transition: "opacity 0.3s ease-in-out",
|
|
97
98
|
}, children: [iconSuccess || ((0, jsx_runtime_1.jsx)(Icon_1.default, { src: (0, getIcon_1.default)("copied_check"), sx: {
|
|
@@ -123,10 +123,14 @@ var DepositFunction = (0, react_1.forwardRef)(function (props, ref) {
|
|
|
123
123
|
}, [isAuthenticated, depositTokens]);
|
|
124
124
|
return ((0, jsx_runtime_1.jsx)(DrawerComponent_1.default, { ref: drawerRef, trigger: (0, jsx_runtime_1.jsx)(RequireConnect_1.default, { children: props.children }), onOpen: props.onOpen, onClose: props.onClose, children: (0, jsx_runtime_1.jsx)(ModalLayout_1.default, { overrideHeader: (0, jsx_runtime_1.jsx)(BackHeader_1.default, { sx: {
|
|
125
125
|
width: "100%",
|
|
126
|
-
paddingBottom: theme.mixins.customPadding.p16,
|
|
127
126
|
display: "flex",
|
|
128
127
|
alignItems: "center",
|
|
129
|
-
|
|
128
|
+
minHeight: "2rem",
|
|
129
|
+
mb: theme.mixins.customMargin.p20,
|
|
130
|
+
}, overrideBack: handleBack, hideBack: currentStep === DepositStep.SELECT_TOKEN, center: DEPOSIT_STEP_NAME[currentStep], children: (0, jsx_runtime_1.jsx)(CloseModal_1.default, { sx: { marginLeft: "auto" }, onClick: close }) }), children: (0, jsx_runtime_1.jsxs)(SwiperControlled_1.default, { ref: swiperRef, swiperProps: {
|
|
131
|
+
autoHeight: true,
|
|
132
|
+
spaceBetween: 32,
|
|
133
|
+
}, disableSwipe: true, children: [(0, jsx_runtime_1.jsx)(react_2.SwiperSlide, { children: (0, jsx_runtime_1.jsx)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g12, height: "fit-content" }), children: depositTokens === null || depositTokens === void 0 ? void 0 : depositTokens.map(function (item) {
|
|
130
134
|
var stringifiedTokenData = JSON.stringify(item);
|
|
131
135
|
if (!item)
|
|
132
136
|
return null;
|
|
@@ -145,9 +149,11 @@ var DepositFunction = (0, react_1.forwardRef)(function (props, ref) {
|
|
|
145
149
|
alignSelf: "center",
|
|
146
150
|
borderRadius: theme.mixins.theBorderRadius.r12,
|
|
147
151
|
overflow: "hidden",
|
|
148
|
-
|
|
152
|
+
backgroundColor: theme.palette.background.white64,
|
|
153
|
+
backdropFilter: "blur(10px)",
|
|
154
|
+
}, children: (0, jsx_runtime_1.jsx)(QRCode_1.default, { value: qrCodeValue, title: "Deposit ".concat(selectedToken === null || selectedToken === void 0 ? void 0 : selectedToken.name), logo: (0, getIcon_1.default)("ton"), bgColor: "transparent" }) }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g4, color: "text.white" }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.valueDescription), children: "Network" }), (0, jsx_runtime_1.jsxs)(material_1.Box, { component: "button", sx: __assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g2, cursor: "pointer", transition: "transform 0.3s ease-in-out", "&:active": {
|
|
149
155
|
transform: "translateX(0.5rem)",
|
|
150
|
-
} }), onClick: handleBack, children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.value), children: selectedNetwork === null || selectedNetwork === void 0 ? void 0 : selectedNetwork.name }), (0, jsx_runtime_1.jsx)(Icon_1.default, { src: (0, getIcon_1.default)("right_arrow"), width: 10 })] })] }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g4, color: "text.white" }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.valueDescription), children: "Address" }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.value), { wordBreak: "break-all" }), children: addressByNetwork })] }), (0, jsx_runtime_1.jsx)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g4, backgroundColor: theme.palette.background.white16, borderRadius: theme.mixins.theBorderRadius.r12, padding: theme.mixins.customPadding.p8 }), children: (0, jsx_runtime_1.jsxs)(Text_1.default, { sx: __assign({}, theme.mixins.valueDescription), children: ["Deposit", " ", (0, jsx_runtime_1.jsxs)("strong", { children: ["min ", selectedToken === null || selectedToken === void 0 ? void 0 : selectedToken.min_value, " ", selectedToken === null || selectedToken === void 0 ? void 0 : selectedToken.name] }), " ", "and ", (0, jsx_runtime_1.jsx)("strong", { children: "select the correct network" }), ", or you will lose your assets."] }) })] }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g12, justifyContent: "center" }), children: [(0, jsx_runtime_1.jsx)(CopyTextComponent_1.default, { value: qrCodeValue, 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: {
|
|
156
|
+
} }), onClick: handleBack, children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.value), children: selectedNetwork === null || selectedNetwork === void 0 ? void 0 : selectedNetwork.name }), (0, jsx_runtime_1.jsx)(Icon_1.default, { src: (0, getIcon_1.default)("right_arrow"), width: 10 })] })] }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g4, color: "text.white" }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.valueDescription), children: "Address" }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.value), { wordBreak: "break-all" }), children: addressByNetwork })] }), (0, jsx_runtime_1.jsx)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g4, backgroundColor: theme.palette.background.white16, borderRadius: theme.mixins.theBorderRadius.r12, padding: theme.mixins.customPadding.p8 }), children: (0, jsx_runtime_1.jsxs)(Text_1.default, { sx: __assign({}, theme.mixins.valueDescription), children: ["Deposit", " ", (0, jsx_runtime_1.jsxs)("strong", { style: { color: theme.palette.text.white }, children: ["min ", selectedToken === null || selectedToken === void 0 ? void 0 : selectedToken.min_value, " ", selectedToken === null || selectedToken === void 0 ? void 0 : selectedToken.name] }), " ", "and", " ", (0, jsx_runtime_1.jsx)("strong", { style: { color: theme.palette.text.white }, children: "select the correct network" }), ", or you will lose your assets."] }) })] }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g12, justifyContent: "center" }), children: [(0, jsx_runtime_1.jsx)(CopyTextComponent_1.default, { value: qrCodeValue, 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: {
|
|
151
157
|
fontSize: theme.typography.fontSize12,
|
|
152
158
|
fontWeight: theme.typography.fontWeight400,
|
|
153
159
|
leading: "typography.leading150",
|
|
@@ -3,8 +3,8 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
|
3
3
|
var jsx_runtime_1 = require("react/jsx-runtime");
|
|
4
4
|
var qrcode_react_1 = require("qrcode.react");
|
|
5
5
|
function QRCode(props) {
|
|
6
|
-
var value = props.value, _a = props.size, size = _a === void 0 ? 156 : _a, logo = props.logo, title = props.title;
|
|
7
|
-
return ((0, jsx_runtime_1.jsx)(qrcode_react_1.QRCodeCanvas, { value: value, title: title, size: size, bgColor:
|
|
6
|
+
var value = props.value, _a = props.size, size = _a === void 0 ? 156 : _a, logo = props.logo, title = props.title, _b = props.bgColor, bgColor = _b === void 0 ? "#ffffff" : _b;
|
|
7
|
+
return ((0, jsx_runtime_1.jsx)(qrcode_react_1.QRCodeCanvas, { value: value, title: title, size: size, bgColor: bgColor, fgColor: "#000000", level: "H", minVersion: 8, marginSize: 4, imageSettings: {
|
|
8
8
|
src: logo || "",
|
|
9
9
|
x: undefined,
|
|
10
10
|
y: undefined,
|
|
@@ -74,7 +74,7 @@ function RequireConnect(_a) {
|
|
|
74
74
|
(_a = authViewRef.current) === null || _a === void 0 ? void 0 : _a.close();
|
|
75
75
|
};
|
|
76
76
|
if (!isAuthenticated) {
|
|
77
|
-
return ((0, jsx_runtime_1.jsx)(DrawerComponent_1.default, { ref: authViewRef, direction: DrawerComponent_1.DRAWER_DIRECTION.RIGHT, trigger: (0, jsx_runtime_1.jsxs)(material_1.Box, __assign({}, rest, { sx: { position: "relative" }, children: [children, (0, jsx_runtime_1.jsx)(material_1.Box, { sx: { position: "absolute", inset: 0, zIndex: 10 } })] })), children: (0, jsx_runtime_1.jsx)(AuthView_1.default, { onBack: backAuthView }) }));
|
|
77
|
+
return ((0, jsx_runtime_1.jsx)(DrawerComponent_1.default, { ref: authViewRef, direction: DrawerComponent_1.DRAWER_DIRECTION.RIGHT, trigger: (0, jsx_runtime_1.jsxs)(material_1.Box, __assign({}, rest, { sx: { position: "relative" }, children: [(0, jsx_runtime_1.jsx)(material_1.Box, { sx: { pointerEvents: "none" }, children: children }), (0, jsx_runtime_1.jsx)(material_1.Box, { sx: { position: "absolute", inset: 0, zIndex: 10 } })] })), children: (0, jsx_runtime_1.jsx)(AuthView_1.default, { onBack: backAuthView }) }));
|
|
78
78
|
}
|
|
79
79
|
return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: children });
|
|
80
80
|
}
|
|
@@ -47,6 +47,8 @@ var TokenSelection = function (props) {
|
|
|
47
47
|
}, [balance, tokenData]);
|
|
48
48
|
return ((0, jsx_runtime_1.jsxs)(material_1.Box, __assign({ onClick: function () { return onClick === null || onClick === void 0 ? void 0 : onClick(tokenData); }, sx: __assign({ backgroundColor: props.active
|
|
49
49
|
? "background.secondary16"
|
|
50
|
-
: "background.white16", border: "1px solid", borderColor: props.active ? "border.secondary" : "transparent", borderRadius: theme.mixins.theBorderRadius.r16, padding: theme.mixins.customPadding.p12, display: "flex", alignItems: "center", cursor: "pointer" }, sx) }, rest, { children: [(0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g12 }), children: [(0, jsx_runtime_1.jsx)(Icon_1.default, { width: 20, src: tokenData === null || tokenData === void 0 ? void 0 : tokenData.icon
|
|
50
|
+
: "background.white16", border: "1px solid", borderColor: props.active ? "border.secondary" : "transparent", borderRadius: theme.mixins.theBorderRadius.r16, padding: theme.mixins.customPadding.p12, display: "flex", alignItems: "center", cursor: "pointer" }, sx) }, rest, { children: [(0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g12 }), children: [(0, jsx_runtime_1.jsx)(Icon_1.default, { width: 20, src: tokenData === null || tokenData === void 0 ? void 0 : tokenData.icon, sx: {
|
|
51
|
+
borderRadius: theme.mixins.theBorderRadius.full,
|
|
52
|
+
} }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign({}, theme.mixins.column), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: theme.mixins.value, children: tokenData === null || tokenData === void 0 ? void 0 : tokenData.name }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: theme.mixins.valueDescription, children: tokenData === null || tokenData === void 0 ? void 0 : tokenData.full_name })] })] }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { marginLeft: "auto", alignItems: "end" }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: theme.mixins.value, children: (0, jsx_runtime_1.jsx)(Formatter_1.default, { value: balance }) }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: theme.mixins.valueDescription, children: (0, jsx_runtime_1.jsx)(Formatter_1.default, { value: balanceInUSD, start: "~ $" }) })] })] })));
|
|
51
53
|
};
|
|
52
54
|
exports.default = TokenSelection;
|
package/dist/theme/mui/theme.js
CHANGED
|
@@ -93,6 +93,19 @@ var customPadding = {
|
|
|
93
93
|
p40: "2.5rem",
|
|
94
94
|
p48: "3rem",
|
|
95
95
|
};
|
|
96
|
+
var customMargin = {
|
|
97
|
+
p4: "0.25rem",
|
|
98
|
+
p6: "0.375rem",
|
|
99
|
+
p8: "0.5rem",
|
|
100
|
+
p10: "0.625rem",
|
|
101
|
+
p12: "0.75rem",
|
|
102
|
+
p16: "1rem",
|
|
103
|
+
p20: "1.25rem",
|
|
104
|
+
p24: "1.5rem",
|
|
105
|
+
p32: "2rem",
|
|
106
|
+
p40: "2.5rem",
|
|
107
|
+
p48: "3rem",
|
|
108
|
+
};
|
|
96
109
|
var theBorderRadius = {
|
|
97
110
|
full: "999px",
|
|
98
111
|
r12: "0.75rem",
|
|
@@ -117,6 +130,7 @@ var theme = (0, styles_1.createTheme)({
|
|
|
117
130
|
mixins: {
|
|
118
131
|
pagePadding: pagePadding,
|
|
119
132
|
customPadding: customPadding,
|
|
133
|
+
customMargin: customMargin,
|
|
120
134
|
theBorderRadius: theBorderRadius,
|
|
121
135
|
gaps: gaps,
|
|
122
136
|
row: {
|