tek-wallet 0.0.93 → 0.0.95
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.
|
@@ -7,5 +7,8 @@ interface CustomOtpInputProps extends Omit<OTPInputProps, "renderInput"> {
|
|
|
7
7
|
otpInputType?: OtpInputType;
|
|
8
8
|
renderInput?: (inputProps: InputProps, index: number) => React.ReactNode;
|
|
9
9
|
}
|
|
10
|
-
|
|
10
|
+
export type CustomOtpInputRef = {
|
|
11
|
+
blur: () => void;
|
|
12
|
+
};
|
|
13
|
+
declare const CustomOtpInput: import("react").ForwardRefExoticComponent<CustomOtpInputProps & import("react").RefAttributes<CustomOtpInputRef>>;
|
|
11
14
|
export default CustomOtpInput;
|
|
@@ -27,17 +27,23 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
27
27
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
28
28
|
exports.OtpInputType = void 0;
|
|
29
29
|
var jsx_runtime_1 = require("react/jsx-runtime");
|
|
30
|
+
var react_1 = require("react");
|
|
30
31
|
var react_otp_input_1 = __importDefault(require("react-otp-input"));
|
|
31
32
|
var OtpInputType;
|
|
32
33
|
(function (OtpInputType) {
|
|
33
34
|
OtpInputType["TEXT"] = "text";
|
|
34
35
|
OtpInputType["PASSWORD"] = "password";
|
|
35
36
|
})(OtpInputType || (exports.OtpInputType = OtpInputType = {}));
|
|
36
|
-
var CustomOtpInput = function (props) {
|
|
37
|
+
var CustomOtpInput = (0, react_1.forwardRef)(function (props, ref) {
|
|
37
38
|
var otpInputType = props.otpInputType, rest = __rest(props, ["otpInputType"]);
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
39
|
+
var blurButtonRef = (0, react_1.useRef)(null);
|
|
40
|
+
(0, react_1.useImperativeHandle)(ref, function () { return ({
|
|
41
|
+
blur: function () {
|
|
42
|
+
var _a;
|
|
43
|
+
(_a = blurButtonRef.current) === null || _a === void 0 ? void 0 : _a.click();
|
|
44
|
+
},
|
|
45
|
+
}); });
|
|
46
|
+
return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("button", { ref: blurButtonRef, style: { display: "none" } }), otpInputType === OtpInputType.PASSWORD && ((0, jsx_runtime_1.jsx)(react_otp_input_1.default, __assign({}, rest, { inputType: "password", inputStyle: {
|
|
41
47
|
border: "1px solid #ffffff58",
|
|
42
48
|
borderRadius: "0.75rem",
|
|
43
49
|
width: "2.8rem",
|
|
@@ -46,9 +52,7 @@ var CustomOtpInput = function (props) {
|
|
|
46
52
|
outline: "none",
|
|
47
53
|
color: "#ffffff",
|
|
48
54
|
backgroundColor: "#ffffff29",
|
|
49
|
-
}, renderInput: function (props) { return (0, jsx_runtime_1.jsx)("input", __assign({}, props, { inputMode: "decimal" })); } })));
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
}
|
|
53
|
-
};
|
|
55
|
+
}, renderInput: function (props) { return (0, jsx_runtime_1.jsx)("input", __assign({}, props, { inputMode: "decimal" })); } }))), otpInputType !== OtpInputType.TEXT && ((0, jsx_runtime_1.jsx)(react_otp_input_1.default, __assign({}, rest, { renderInput: function (props) { return (0, jsx_runtime_1.jsx)("input", __assign({}, props, { inputMode: "text" })); } })))] }));
|
|
56
|
+
});
|
|
57
|
+
CustomOtpInput.displayName = "CustomOtpInput";
|
|
54
58
|
exports.default = CustomOtpInput;
|
|
@@ -72,6 +72,7 @@ var CreateWalletView = function (props) {
|
|
|
72
72
|
var swiperControlledRef = (0, react_2.useRef)(null);
|
|
73
73
|
var childPageLayoutRef = (0, react_2.useRef)(null);
|
|
74
74
|
var _c = (0, react_2.useState)(CreateWalletViewStep.CREATE_PASSCODE), currentStep = _c[0], setCurrentStep = _c[1];
|
|
75
|
+
var otpInputRef = (0, react_2.useRef)(null);
|
|
75
76
|
var createWallet = (0, useWalletData_1.default)().createWallet;
|
|
76
77
|
var gotoStep = function (step) {
|
|
77
78
|
var _a;
|
|
@@ -121,14 +122,20 @@ var CreateWalletView = function (props) {
|
|
|
121
122
|
/**
|
|
122
123
|
* validate otp here
|
|
123
124
|
*/
|
|
124
|
-
if (value.length === passcodeLength
|
|
125
|
+
if (value.length === passcodeLength) {
|
|
126
|
+
setTimeout(function () {
|
|
127
|
+
var _a;
|
|
128
|
+
(_a = otpInputRef.current) === null || _a === void 0 ? void 0 : _a.blur();
|
|
129
|
+
}, 100);
|
|
125
130
|
createWallet({
|
|
126
131
|
passcode: value,
|
|
127
132
|
appSlug: process.env.NEXT_PUBLIC_TEK_WALLET_APP_SLUG || "",
|
|
128
133
|
}, function () {
|
|
129
|
-
|
|
134
|
+
var _a;
|
|
135
|
+
(_a = childPageLayoutRef.current) === null || _a === void 0 ? void 0 : _a.showLoading();
|
|
130
136
|
}, function () {
|
|
131
|
-
|
|
137
|
+
var _a;
|
|
138
|
+
(_a = childPageLayoutRef.current) === null || _a === void 0 ? void 0 : _a.showSuccess();
|
|
132
139
|
}, handleCreateWalletError);
|
|
133
140
|
}
|
|
134
141
|
};
|