@pinnacle0/web-ui 0.5.0-beta.10 → 0.5.0-beta.12
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/core/AuthenticationCodeInputV2.d.ts +25 -0
- package/core/AuthenticationCodeInputV2.js +165 -0
- package/core/AuthenticationCodeInputV2.js.map +1 -0
- package/core/WithExplanation/index.js +3 -2
- package/core/WithExplanation/index.js.map +1 -1
- package/core/WithExplanation/index.less +20 -6
- package/package.json +1 -1
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import type { Props as InputProps } from "./Input";
|
|
3
|
+
import type { PickOptional } from "../internal/type";
|
|
4
|
+
export interface Props extends Omit<InputProps, "suffix"> {
|
|
5
|
+
onSend: () => Promise<boolean>;
|
|
6
|
+
nextSendInterval?: number;
|
|
7
|
+
autoSendOnMount?: boolean;
|
|
8
|
+
sendText?: string;
|
|
9
|
+
}
|
|
10
|
+
interface State {
|
|
11
|
+
isSending: boolean;
|
|
12
|
+
nextSendRemainingSecond: number | null;
|
|
13
|
+
}
|
|
14
|
+
export declare class AuthenticationCodeInputV2 extends React.PureComponent<Props, State> {
|
|
15
|
+
static displayName: string;
|
|
16
|
+
static defaultProps: PickOptional<Props>;
|
|
17
|
+
private timer;
|
|
18
|
+
constructor(props: Props);
|
|
19
|
+
componentDidMount(): void;
|
|
20
|
+
componentWillUnmount(): void;
|
|
21
|
+
updateNextSendRemainingSecond: () => void;
|
|
22
|
+
onSend: () => Promise<void>;
|
|
23
|
+
render(): JSX.Element;
|
|
24
|
+
}
|
|
25
|
+
export {};
|
|
@@ -0,0 +1,165 @@
|
|
|
1
|
+
var __extends = (this && this.__extends) || (function () {
|
|
2
|
+
var extendStatics = function (d, b) {
|
|
3
|
+
extendStatics = Object.setPrototypeOf ||
|
|
4
|
+
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
|
|
5
|
+
function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
|
|
6
|
+
return extendStatics(d, b);
|
|
7
|
+
};
|
|
8
|
+
return function (d, b) {
|
|
9
|
+
if (typeof b !== "function" && b !== null)
|
|
10
|
+
throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
|
|
11
|
+
extendStatics(d, b);
|
|
12
|
+
function __() { this.constructor = d; }
|
|
13
|
+
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
|
|
14
|
+
};
|
|
15
|
+
})();
|
|
16
|
+
var __assign = (this && this.__assign) || function () {
|
|
17
|
+
__assign = Object.assign || function(t) {
|
|
18
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
19
|
+
s = arguments[i];
|
|
20
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
21
|
+
t[p] = s[p];
|
|
22
|
+
}
|
|
23
|
+
return t;
|
|
24
|
+
};
|
|
25
|
+
return __assign.apply(this, arguments);
|
|
26
|
+
};
|
|
27
|
+
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
|
|
28
|
+
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
|
|
29
|
+
return new (P || (P = Promise))(function (resolve, reject) {
|
|
30
|
+
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
|
|
31
|
+
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
|
|
32
|
+
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
|
|
33
|
+
step((generator = generator.apply(thisArg, _arguments || [])).next());
|
|
34
|
+
});
|
|
35
|
+
};
|
|
36
|
+
var __generator = (this && this.__generator) || function (thisArg, body) {
|
|
37
|
+
var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
|
|
38
|
+
return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
|
|
39
|
+
function verb(n) { return function (v) { return step([n, v]); }; }
|
|
40
|
+
function step(op) {
|
|
41
|
+
if (f) throw new TypeError("Generator is already executing.");
|
|
42
|
+
while (g && (g = 0, op[0] && (_ = 0)), _) try {
|
|
43
|
+
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;
|
|
44
|
+
if (y = 0, t) op = [op[0] & 2, t.value];
|
|
45
|
+
switch (op[0]) {
|
|
46
|
+
case 0: case 1: t = op; break;
|
|
47
|
+
case 4: _.label++; return { value: op[1], done: false };
|
|
48
|
+
case 5: _.label++; y = op[1]; op = [0]; continue;
|
|
49
|
+
case 7: op = _.ops.pop(); _.trys.pop(); continue;
|
|
50
|
+
default:
|
|
51
|
+
if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
|
|
52
|
+
if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
|
|
53
|
+
if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
|
|
54
|
+
if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
|
|
55
|
+
if (t[2]) _.ops.pop();
|
|
56
|
+
_.trys.pop(); continue;
|
|
57
|
+
}
|
|
58
|
+
op = body.call(thisArg, _);
|
|
59
|
+
} catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
|
|
60
|
+
if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
|
|
61
|
+
}
|
|
62
|
+
};
|
|
63
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
|
64
|
+
var t = {};
|
|
65
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
66
|
+
t[p] = s[p];
|
|
67
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
68
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
69
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
70
|
+
t[p[i]] = s[p[i]];
|
|
71
|
+
}
|
|
72
|
+
return t;
|
|
73
|
+
};
|
|
74
|
+
import React from "react";
|
|
75
|
+
import { classNames } from "../util/ClassNames";
|
|
76
|
+
import { i18n } from "../internal/i18n/core";
|
|
77
|
+
import { TextUtil } from "../internal/TextUtil";
|
|
78
|
+
import { Input } from "./Input";
|
|
79
|
+
export var AuthenticationCodeInputV2 = /** @class */ (function (_super) {
|
|
80
|
+
__extends(AuthenticationCodeInputV2, _super);
|
|
81
|
+
function AuthenticationCodeInputV2(props) {
|
|
82
|
+
var _this = _super.call(this, props) || this;
|
|
83
|
+
_this.updateNextSendRemainingSecond = function () {
|
|
84
|
+
var nextSendRemainingSecond = _this.state.nextSendRemainingSecond - 1;
|
|
85
|
+
if (nextSendRemainingSecond <= 0) {
|
|
86
|
+
clearInterval(_this.timer);
|
|
87
|
+
_this.setState({ nextSendRemainingSecond: null });
|
|
88
|
+
}
|
|
89
|
+
else {
|
|
90
|
+
_this.setState({ nextSendRemainingSecond: nextSendRemainingSecond });
|
|
91
|
+
}
|
|
92
|
+
};
|
|
93
|
+
_this.onSend = function () { return __awaiter(_this, void 0, void 0, function () {
|
|
94
|
+
var nextSendInterval, onSend, sendSuccess;
|
|
95
|
+
var _a;
|
|
96
|
+
var _this = this;
|
|
97
|
+
return __generator(this, function (_b) {
|
|
98
|
+
switch (_b.label) {
|
|
99
|
+
case 0:
|
|
100
|
+
nextSendInterval = (_a = this.props, _a.nextSendInterval), onSend = _a.onSend;
|
|
101
|
+
_b.label = 1;
|
|
102
|
+
case 1:
|
|
103
|
+
_b.trys.push([1, , 3, 4]);
|
|
104
|
+
this.setState({ isSending: true });
|
|
105
|
+
return [4 /*yield*/, onSend()];
|
|
106
|
+
case 2:
|
|
107
|
+
sendSuccess = _b.sent();
|
|
108
|
+
if (sendSuccess) {
|
|
109
|
+
this.setState({ nextSendRemainingSecond: nextSendInterval }, function () {
|
|
110
|
+
_this.timer = window.setInterval(_this.updateNextSendRemainingSecond, 1000);
|
|
111
|
+
});
|
|
112
|
+
}
|
|
113
|
+
return [3 /*break*/, 4];
|
|
114
|
+
case 3:
|
|
115
|
+
this.setState({ isSending: false });
|
|
116
|
+
return [7 /*endfinally*/];
|
|
117
|
+
case 4: return [2 /*return*/];
|
|
118
|
+
}
|
|
119
|
+
});
|
|
120
|
+
}); };
|
|
121
|
+
_this.state = {
|
|
122
|
+
isSending: false,
|
|
123
|
+
nextSendRemainingSecond: null,
|
|
124
|
+
};
|
|
125
|
+
return _this;
|
|
126
|
+
}
|
|
127
|
+
AuthenticationCodeInputV2.prototype.componentDidMount = function () {
|
|
128
|
+
if (this.props.autoSendOnMount) {
|
|
129
|
+
this.onSend();
|
|
130
|
+
}
|
|
131
|
+
};
|
|
132
|
+
AuthenticationCodeInputV2.prototype.componentWillUnmount = function () {
|
|
133
|
+
clearInterval(this.timer);
|
|
134
|
+
};
|
|
135
|
+
AuthenticationCodeInputV2.prototype.render = function () {
|
|
136
|
+
var _a;
|
|
137
|
+
var _b = this.props, sendText = _b.sendText,
|
|
138
|
+
// eslint-disable-next-line @typescript-eslint/no-unused-vars -- not included in inputProps
|
|
139
|
+
onSend = _b.onSend,
|
|
140
|
+
// eslint-disable-next-line @typescript-eslint/no-unused-vars -- not included in inputProps
|
|
141
|
+
autoSendOnMount = _b.autoSendOnMount,
|
|
142
|
+
// eslint-disable-next-line @typescript-eslint/no-unused-vars -- not included in inputProps
|
|
143
|
+
nextSendInterval = _b.nextSendInterval, className = _b.className, inputProps = __rest(_b, ["sendText", "onSend", "autoSendOnMount", "nextSendInterval", "className"]);
|
|
144
|
+
var isSending = (_a = this.state, _a.isSending), nextSendRemainingSecond = _a.nextSendRemainingSecond;
|
|
145
|
+
var t = i18n();
|
|
146
|
+
var disabled = inputProps.disabled || nextSendRemainingSecond !== null || isSending;
|
|
147
|
+
var groupStyle = { display: "flex", alignItems: "center" };
|
|
148
|
+
var sendTextStyle = {
|
|
149
|
+
color: disabled ? "#b2c2cf" : "#3d9cf1",
|
|
150
|
+
textDecoration: "underline",
|
|
151
|
+
whiteSpace: "nowrap",
|
|
152
|
+
fontSize: 12,
|
|
153
|
+
cursor: disabled ? "not-allowed" : "pointer",
|
|
154
|
+
};
|
|
155
|
+
return (React.createElement("div", { className: "g-auth-code-input-group", style: groupStyle },
|
|
156
|
+
React.createElement(Input, __assign({}, inputProps, { className: classNames(className, "g-auth-code-input") })),
|
|
157
|
+
React.createElement("div", { className: "g-auth-code-input-send-text", style: sendTextStyle, onClick: !disabled ? this.onSend : undefined }, nextSendRemainingSecond ? TextUtil.interpolate(t.waitResendAuthCode, nextSendRemainingSecond.toString()) : sendText || t.sendAuthCode)));
|
|
158
|
+
};
|
|
159
|
+
AuthenticationCodeInputV2.displayName = "AuthenticationCodeInputV2";
|
|
160
|
+
AuthenticationCodeInputV2.defaultProps = {
|
|
161
|
+
nextSendInterval: 60,
|
|
162
|
+
};
|
|
163
|
+
return AuthenticationCodeInputV2;
|
|
164
|
+
}(React.PureComponent));
|
|
165
|
+
//# sourceMappingURL=AuthenticationCodeInputV2.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"AuthenticationCodeInputV2.js","sourceRoot":"","sources":["../../src/core/AuthenticationCodeInputV2.tsx"],"names":[],"mappings":"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"}
|
|
@@ -30,8 +30,9 @@ export var WithExplanation = /** @class */ (function (_super) {
|
|
|
30
30
|
children,
|
|
31
31
|
React.createElement(Tooltip, { className: "g-with-explanation-tooltip", title: Array.isArray(explanation) ? explanation.map(function (_, index) { return React.createElement("p", { key: index }, _); }) : explanation },
|
|
32
32
|
React.createElement("div", { className: "icon-container" },
|
|
33
|
-
React.createElement("svg", { viewBox: "0 0
|
|
34
|
-
React.createElement("
|
|
33
|
+
React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 26 24" },
|
|
34
|
+
React.createElement("circle", { cx: "8", cy: "8", r: "8", "data-name": "\u692D\u5706\u5F62", style: { fill: "none", strokeMiterlimit: 10 }, transform: "translate(3.5 4)" }),
|
|
35
|
+
React.createElement("path", { d: "M2.338 9.9a.972.972 0 0 1-.294-.715.929.929 0 0 1 .294-.714.991.991 0 0 1 .728-.28 1 1 0 0 1 .742.28.929.929 0 0 1 .294.714.994.994 0 0 1-.308.728 1.049 1.049 0 0 1-.728.28 1 1 0 0 1-.728-.293zm-.014-2.466V7.2a2.794 2.794 0 0 1 .28-1.33 6.938 6.938 0 0 1 1.582-1.74l.239-.266a1.638 1.638 0 0 0 .391-1.022 1.593 1.593 0 0 0-.406-1.148 1.624 1.624 0 0 0-1.19-.419 1.549 1.549 0 0 0-1.373.6A2.345 2.345 0 0 0 1.47 3.3H0A3.247 3.247 0 0 1 .882.9 3.245 3.245 0 0 1 3.318 0 3.131 3.131 0 0 1 5.5.742a2.53 2.53 0 0 1 .841 2 2.71 2.71 0 0 1-.531 1.71 14.388 14.388 0 0 1-1.176 1.092 2.319 2.319 0 0 0-.588.728 1.871 1.871 0 0 0-.224.924v.238z", transform: "translate(8.336 6.808)" }))))));
|
|
35
36
|
}
|
|
36
37
|
else {
|
|
37
38
|
return children || "";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/core/WithExplanation/index.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAC,UAAU,EAAC,MAAM,uBAAuB,CAAC;AACjD,OAAO,EAAC,OAAO,EAAC,MAAM,YAAY,CAAC;AAGnC,OAAO,cAAc,CAAC;AAetB;IAAqC,mCAA0B;IAA/D;;
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/core/WithExplanation/index.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAC,UAAU,EAAC,MAAM,uBAAuB,CAAC;AACjD,OAAO,EAAC,OAAO,EAAC,MAAM,YAAY,CAAC;AAGnC,OAAO,cAAc,CAAC;AAetB;IAAqC,mCAA0B;IAA/D;;IA8BA,CAAC;IAvBG,gCAAM,GAAN;;QACW,IAAA,QAAQ,IAAT,KAAwC,IAAI,CAAC,KAAK,cAAzC,EAAE,WAAW,iBAAA,EAAE,YAAY,kBAAA,CAAe;QACzD,IAAI,WAAW,EAAE;YACb,OAAO,CACH,6BAAK,SAAS,EAAE,UAAU,CAAC,oBAAoB,EAAE,oBAAa,YAAY,CAAE,CAAC;gBACxE,QAAQ;gBACT,oBAAC,OAAO,IAAC,SAAS,EAAC,4BAA4B,EAAC,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,WAAW,CAAC,GAAG,CAAC,UAAC,CAAC,EAAE,KAAK,IAAK,OAAA,2BAAG,GAAG,EAAE,KAAK,IAAG,CAAC,CAAK,EAAtB,CAAsB,CAAC,CAAC,CAAC,CAAC,WAAW;oBACnJ,6BAAK,SAAS,EAAC,gBAAgB;wBAC3B,6BAAK,KAAK,EAAC,4BAA4B,EAAC,OAAO,EAAC,WAAW;4BACvD,gCAAQ,EAAE,EAAC,GAAG,EAAC,EAAE,EAAC,GAAG,EAAC,CAAC,EAAC,GAAG,eAAW,oBAAK,EAAC,KAAK,EAAE,EAAC,IAAI,EAAE,MAAM,EAAE,gBAAgB,EAAE,EAAE,EAAC,EAAE,SAAS,EAAC,kBAAkB,GAAG;4BACxH,8BACI,CAAC,EAAC,4nBAA4nB,EAC9nB,SAAS,EAAC,wBAAwB,GACpC,CACA,CACJ,CACA,CACR,CACT,CAAC;SACL;aAAM;YACH,OAAO,QAAQ,IAAI,EAAE,CAAC;SACzB;IACL,CAAC;IA5BM,2BAAW,GAAG,iBAAiB,CAAC;IAEhC,4BAAY,GAAwB;QACvC,YAAY,EAAE,OAAO;KACxB,CAAC;IAyBN,sBAAC;CAAA,AA9BD,CAAqC,KAAK,CAAC,aAAa,GA8BvD"}
|
|
@@ -1,4 +1,6 @@
|
|
|
1
1
|
.g-with-explanation {
|
|
2
|
+
@gap: 6px;
|
|
3
|
+
|
|
2
4
|
display: inline-flex;
|
|
3
5
|
justify-content: center;
|
|
4
6
|
align-items: center;
|
|
@@ -8,7 +10,7 @@
|
|
|
8
10
|
|
|
9
11
|
.icon-container {
|
|
10
12
|
margin-left: 0;
|
|
11
|
-
margin-right:
|
|
13
|
+
margin-right: @gap;
|
|
12
14
|
}
|
|
13
15
|
}
|
|
14
16
|
|
|
@@ -16,12 +18,24 @@
|
|
|
16
18
|
display: inline-flex;
|
|
17
19
|
align-items: center;
|
|
18
20
|
justify-content: center;
|
|
19
|
-
width:
|
|
20
|
-
height:
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
margin-left: 5px;
|
|
21
|
+
width: auto;
|
|
22
|
+
height: 1px;
|
|
23
|
+
margin-left: @gap;
|
|
24
|
+
color: inherit;
|
|
24
25
|
cursor: help;
|
|
26
|
+
|
|
27
|
+
svg {
|
|
28
|
+
width: auto;
|
|
29
|
+
height: 1.4em;
|
|
30
|
+
|
|
31
|
+
path {
|
|
32
|
+
fill: currentcolor;
|
|
33
|
+
}
|
|
34
|
+
|
|
35
|
+
circle {
|
|
36
|
+
stroke: currentcolor;
|
|
37
|
+
}
|
|
38
|
+
}
|
|
25
39
|
}
|
|
26
40
|
}
|
|
27
41
|
|