wini-web-components 2.0.6 → 2.0.8
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/form/login/view.d.ts +5 -2
- package/dist/form/login/view.js +13 -13
- package/dist/index.js +1 -1
- package/package.json +1 -1
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import React from 'react';
|
|
1
|
+
import React, { CSSProperties } from 'react';
|
|
2
2
|
import { FieldValues, SubmitHandler } from 'react-hook-form';
|
|
3
3
|
interface Props {
|
|
4
4
|
logo: React.ReactNode | string;
|
|
@@ -23,12 +23,15 @@ interface Props {
|
|
|
23
23
|
orText?: string;
|
|
24
24
|
buttonLoginLabel?: string;
|
|
25
25
|
loginWithGoogle?: React.MouseEventHandler<HTMLButtonElement>;
|
|
26
|
-
loginWithFacebook
|
|
26
|
+
loginWithFacebook?: React.MouseEventHandler<HTMLButtonElement>;
|
|
27
27
|
onRegister?: React.MouseEventHandler<HTMLDivElement>;
|
|
28
28
|
registerPrefixText?: string;
|
|
29
29
|
registerText?: string;
|
|
30
30
|
forgotPasswordText?: string;
|
|
31
31
|
onForgotPassword?: React.MouseEventHandler<HTMLDivElement>;
|
|
32
|
+
style?: CSSProperties;
|
|
33
|
+
className?: string;
|
|
34
|
+
id?: string;
|
|
32
35
|
}
|
|
33
36
|
export declare function WLoginView(props: Props): React.JSX.Element;
|
|
34
37
|
export {};
|
package/dist/form/login/view.js
CHANGED
|
@@ -10,22 +10,22 @@ var view_module_css_1 = __importDefault(require("./view.module.css"));
|
|
|
10
10
|
var react_hook_form_1 = require("react-hook-form");
|
|
11
11
|
var react_2 = require("react");
|
|
12
12
|
function WLoginView(props) {
|
|
13
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
|
|
13
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
|
|
14
14
|
var methods = (0, react_hook_form_1.useForm)({ shouldFocusError: false });
|
|
15
|
-
var
|
|
16
|
-
return react_1.default.createElement("div", { className: "col login-view-container ".concat(view_module_css_1.default['login-view-container']) },
|
|
15
|
+
var _p = (0, react_2.useState)(false), isShowPass = _p[0], setShowPass = _p[1];
|
|
16
|
+
return react_1.default.createElement("div", { id: props.id, className: "col login-view-container ".concat(view_module_css_1.default['login-view-container'], " ").concat((_a = props.className) !== null && _a !== void 0 ? _a : ''), style: props.style },
|
|
17
17
|
typeof props.logo === "string" ? react_1.default.createElement("img", { alt: 'logo', src: props.logo, height: "36rem" }) : props.logo,
|
|
18
18
|
react_1.default.createElement("div", { className: "col login-view-form-container ".concat(view_module_css_1.default['login-view-form-container']) },
|
|
19
|
-
react_1.default.createElement(index_1.Text, { className: 'heading-4' }, (
|
|
19
|
+
react_1.default.createElement(index_1.Text, { className: 'heading-4' }, (_b = props.title) !== null && _b !== void 0 ? _b : "Log in to Wini"),
|
|
20
20
|
react_1.default.createElement("div", { className: 'col' },
|
|
21
21
|
react_1.default.createElement("div", { className: 'col', style: { gap: "0.8rem" } },
|
|
22
|
-
react_1.default.createElement(index_1.Text, { className: 'label-3' },
|
|
22
|
+
react_1.default.createElement(index_1.Text, { className: 'label-3' }, props.formData.username.label),
|
|
23
23
|
react_1.default.createElement(index_1.TextField, { className: "placeholder-2", placeholder: props.formData.username.label, style: { height: "4.8rem" }, prefix: props.formData.username.prefix, name: props.formData.username.name, register: methods.register(props.formData.username.name, {
|
|
24
24
|
onChange: function (ev) { ev.target.value = ev.target.value.trim(); },
|
|
25
25
|
onBlur: props.formData.username.onValidate
|
|
26
|
-
}), onComplete: function (ev) { ev.target.blur(); }, helperText: (
|
|
26
|
+
}), onComplete: function (ev) { ev.target.blur(); }, helperText: (_d = (_c = methods.formState.errors) === null || _c === void 0 ? void 0 : _c[props.formData.username.name]) === null || _d === void 0 ? void 0 : _d.message })),
|
|
27
27
|
react_1.default.createElement("div", { className: 'col', style: { gap: "0.8rem" } },
|
|
28
|
-
react_1.default.createElement(index_1.Text, { className: 'label-3' },
|
|
28
|
+
react_1.default.createElement(index_1.Text, { className: 'label-3' }, props.formData.password.label),
|
|
29
29
|
react_1.default.createElement(index_1.TextField, { className: "placeholder-2", placeholder: props.formData.password.label, style: { height: "4.8rem" }, prefix: props.formData.password.prefix, suffix: react_1.default.createElement("button", { type: 'button', onClick: function () { setShowPass(!isShowPass); } },
|
|
30
30
|
react_1.default.createElement(index_1.Winicon, { src: "outline/user interface/".concat(isShowPass ? "view" : "hide"), size: "1.6rem" })), name: props.formData.password.name, type: isShowPass ? "text" : "password", register: methods.register(props.formData.password.name, {
|
|
31
31
|
onChange: function (ev) { ev.target.value = ev.target.value.trim(); },
|
|
@@ -39,16 +39,16 @@ function WLoginView(props) {
|
|
|
39
39
|
}
|
|
40
40
|
else
|
|
41
41
|
ev.target.blur();
|
|
42
|
-
}, helperText: (
|
|
43
|
-
react_1.default.createElement(index_1.Text, { className: "button-text-3 ".concat(view_module_css_1.default['forgot-password-btn']), onClick: props.onForgotPassword }, (
|
|
42
|
+
}, helperText: (_f = (_e = methods.formState.errors) === null || _e === void 0 ? void 0 : _e[props.formData.password.name]) === null || _f === void 0 ? void 0 : _f.message })),
|
|
43
|
+
react_1.default.createElement(index_1.Text, { className: "button-text-3 ".concat(view_module_css_1.default['forgot-password-btn']), onClick: props.onForgotPassword }, (_g = props.forgotPasswordText) !== null && _g !== void 0 ? _g : "Forgot your password?"),
|
|
44
44
|
react_1.default.createElement("div", { className: 'col', style: { gap: "1.6rem" } },
|
|
45
|
-
react_1.default.createElement(index_1.Button, { disabled: ((
|
|
45
|
+
react_1.default.createElement(index_1.Button, { disabled: ((_h = methods.watch(props.formData.username.name)) === null || _h === void 0 ? void 0 : _h.length) && ((_j = methods.watch(props.formData.password.name)) === null || _j === void 0 ? void 0 : _j.length) ? false : true, className: "button-text-1 ".concat(view_module_css_1.default['login-btn']), onClick: props.onSubmit && methods.handleSubmit(props.onSubmit), label: (_k = props.buttonLoginLabel) !== null && _k !== void 0 ? _k : "Log In" }),
|
|
46
46
|
react_1.default.createElement("div", { className: 'row', style: { justifyContent: "center", gap: "0.4rem" } },
|
|
47
|
-
react_1.default.createElement(index_1.Text, { className: 'label-4' }, (
|
|
48
|
-
react_1.default.createElement(index_1.Text, { className: "button-text-3 ".concat(view_module_css_1.default['register-btn']), onClick: props.onRegister }, (
|
|
47
|
+
react_1.default.createElement(index_1.Text, { className: 'label-4' }, (_l = props.registerPrefixText) !== null && _l !== void 0 ? _l : "Don't have an account?"),
|
|
48
|
+
react_1.default.createElement(index_1.Text, { className: "button-text-3 ".concat(view_module_css_1.default['register-btn']), onClick: props.onRegister }, (_m = props.registerText) !== null && _m !== void 0 ? _m : "Sign up for Wini"))),
|
|
49
49
|
react_1.default.createElement("div", { className: "row ".concat(view_module_css_1.default['or-spacing']) },
|
|
50
50
|
react_1.default.createElement("div", null),
|
|
51
|
-
react_1.default.createElement(index_1.Text, { className: "label-4" }, (
|
|
51
|
+
react_1.default.createElement(index_1.Text, { className: "label-4" }, (_o = props.orText) !== null && _o !== void 0 ? _o : "Or"),
|
|
52
52
|
react_1.default.createElement("div", null)),
|
|
53
53
|
react_1.default.createElement("div", { className: "row ".concat(view_module_css_1.default['login-social-media']) },
|
|
54
54
|
react_1.default.createElement(index_1.Button, { className: "label-1", onClick: props.loginWithGoogle, prefix: react_1.default.createElement(index_1.Winicon, { src: 'color/social media/google', size: "2rem" }), label: "Google" }),
|