keycloakify 6.7.2 → 6.8.1
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/README.md +6 -0
- package/lib/components/Error.d.ts +6 -3
- package/lib/components/Error.js +4 -4
- package/lib/components/Error.js.map +1 -1
- package/lib/components/IdpReviewUserProfile.d.ts +6 -3
- package/lib/components/IdpReviewUserProfile.js +10 -10
- package/lib/components/IdpReviewUserProfile.js.map +1 -1
- package/lib/components/Info.d.ts +6 -3
- package/lib/components/Info.js +4 -4
- package/lib/components/Info.js.map +1 -1
- package/lib/components/KcApp.d.ts +7 -4
- package/lib/components/KcApp.js +25 -24
- package/lib/components/KcApp.js.map +1 -1
- package/lib/components/Login.d.ts +6 -3
- package/lib/components/Login.js +17 -17
- package/lib/components/Login.js.map +1 -1
- package/lib/components/LoginConfigTotp.d.ts +6 -3
- package/lib/components/LoginConfigTotp.js +25 -25
- package/lib/components/LoginConfigTotp.js.map +1 -1
- package/lib/components/LoginIdpLinkConfirm.d.ts +6 -3
- package/lib/components/LoginIdpLinkConfirm.js +7 -7
- package/lib/components/LoginIdpLinkConfirm.js.map +1 -1
- package/lib/components/LoginIdpLinkEmail.d.ts +6 -3
- package/lib/components/LoginIdpLinkEmail.js +4 -4
- package/lib/components/LoginIdpLinkEmail.js.map +1 -1
- package/lib/components/LoginOtp.d.ts +6 -3
- package/lib/components/LoginOtp.js +19 -19
- package/lib/components/LoginOtp.js.map +1 -1
- package/lib/components/LoginPageExpired.d.ts +6 -3
- package/lib/components/LoginPageExpired.js +4 -4
- package/lib/components/LoginPageExpired.js.map +1 -1
- package/lib/components/LoginPassword.d.ts +6 -3
- package/lib/components/LoginPassword.js +12 -12
- package/lib/components/LoginPassword.js.map +1 -1
- package/lib/components/LoginResetPassword.d.ts +6 -3
- package/lib/components/LoginResetPassword.js +14 -14
- package/lib/components/LoginResetPassword.js.map +1 -1
- package/lib/components/LoginUpdatePassword.d.ts +6 -3
- package/lib/components/LoginUpdatePassword.js +20 -20
- package/lib/components/LoginUpdatePassword.js.map +1 -1
- package/lib/components/LoginUpdateProfile.d.ts +6 -3
- package/lib/components/LoginUpdateProfile.js +31 -31
- package/lib/components/LoginUpdateProfile.js.map +1 -1
- package/lib/components/LoginUsername.d.ts +6 -3
- package/lib/components/LoginUsername.js +13 -13
- package/lib/components/LoginUsername.js.map +1 -1
- package/lib/components/LoginVerifyEmail.d.ts +6 -3
- package/lib/components/LoginVerifyEmail.js +4 -4
- package/lib/components/LoginVerifyEmail.js.map +1 -1
- package/lib/components/LogoutConfirm.d.ts +6 -3
- package/lib/components/LogoutConfirm.js +8 -8
- package/lib/components/LogoutConfirm.js.map +1 -1
- package/lib/components/Register.d.ts +6 -3
- package/lib/components/Register.js +41 -41
- package/lib/components/Register.js.map +1 -1
- package/lib/components/RegisterUserProfile.d.ts +6 -3
- package/lib/components/RegisterUserProfile.js +12 -12
- package/lib/components/RegisterUserProfile.js.map +1 -1
- package/lib/components/Terms.d.ts +6 -3
- package/lib/components/Terms.js +6 -6
- package/lib/components/Terms.js.map +1 -1
- package/lib/components/UpdateUserProfile.d.ts +6 -3
- package/lib/components/UpdateUserProfile.js +11 -11
- package/lib/components/UpdateUserProfile.js.map +1 -1
- package/lib/components/WebauthnAuthenticate.d.ts +6 -3
- package/lib/components/WebauthnAuthenticate.js +18 -18
- package/lib/components/WebauthnAuthenticate.js.map +1 -1
- package/lib/tsconfig.tsbuildinfo +1 -1
- package/package.json +3 -3
- package/src/lib/components/Error.tsx +34 -31
- package/src/lib/components/IdpReviewUserProfile.tsx +50 -47
- package/src/lib/components/Info.tsx +49 -46
- package/src/lib/components/KcApp.tsx +74 -69
- package/src/lib/components/Login.tsx +178 -175
- package/src/lib/components/LoginConfigTotp.tsx +163 -160
- package/src/lib/components/LoginIdpLinkConfirm.tsx +56 -43
- package/src/lib/components/LoginIdpLinkEmail.tsx +34 -31
- package/src/lib/components/LoginOtp.tsx +86 -83
- package/src/lib/components/LoginPageExpired.tsx +38 -35
- package/src/lib/components/LoginPassword.tsx +79 -76
- package/src/lib/components/LoginResetPassword.tsx +67 -64
- package/src/lib/components/LoginUpdatePassword.tsx +105 -102
- package/src/lib/components/LoginUpdateProfile.tsx +108 -105
- package/src/lib/components/LoginUsername.tsx +145 -142
- package/src/lib/components/LoginVerifyEmail.tsx +34 -31
- package/src/lib/components/LogoutConfirm.tsx +57 -54
- package/src/lib/components/Register.tsx +137 -134
- package/src/lib/components/RegisterUserProfile.tsx +63 -60
- package/src/lib/components/Terms.tsx +56 -52
- package/src/lib/components/UpdateUserProfile.tsx +61 -58
- package/src/lib/components/WebauthnAuthenticate.tsx +179 -178
@@ -1,5 +1,6 @@
|
|
1
1
|
import React, { useEffect, memo } from "react";
|
2
|
-
import
|
2
|
+
import DefaultTemplate from "./Template";
|
3
|
+
import type { TemplateProps } from "./Template";
|
3
4
|
import type { KcProps } from "./KcProps";
|
4
5
|
import type { KcContextBase } from "../getKcContext/KcContextBase";
|
5
6
|
import { headInsert } from "../tools/headInsert";
|
@@ -7,95 +8,97 @@ import { pathJoin } from "../../bin/tools/pathJoin";
|
|
7
8
|
import { useCssAndCx } from "../tools/useCssAndCx";
|
8
9
|
import type { I18n } from "../i18n";
|
9
10
|
|
10
|
-
|
11
|
-
|
12
|
-
|
13
|
-
|
14
|
-
|
15
|
-
|
16
|
-
|
17
|
-
|
18
|
-
|
19
|
-
|
20
|
-
|
21
|
-
|
22
|
-
|
23
|
-
|
24
|
-
|
25
|
-
|
26
|
-
|
27
|
-
|
28
|
-
|
29
|
-
|
30
|
-
|
31
|
-
|
32
|
-
|
33
|
-
|
34
|
-
|
35
|
-
|
36
|
-
|
37
|
-
|
38
|
-
|
39
|
-
|
40
|
-
|
41
|
-
|
42
|
-
|
43
|
-
|
44
|
-
|
45
|
-
|
46
|
-
|
47
|
-
|
48
|
-
|
49
|
-
|
50
|
-
|
51
|
-
|
52
|
-
|
53
|
-
|
54
|
-
|
55
|
-
|
11
|
+
export type LoginOtpProps = KcProps & {
|
12
|
+
kcContext: KcContextBase.LoginOtp;
|
13
|
+
i18n: I18n;
|
14
|
+
doFetchDefaultThemeResources?: boolean;
|
15
|
+
Template?: (props: TemplateProps) => JSX.Element | null;
|
16
|
+
};
|
17
|
+
|
18
|
+
const LoginOtp = memo((props: LoginOtpProps) => {
|
19
|
+
const { kcContext, i18n, doFetchDefaultThemeResources = true, Template = DefaultTemplate, ...kcProps } = props;
|
20
|
+
|
21
|
+
const { otpLogin, url } = kcContext;
|
22
|
+
|
23
|
+
const { cx } = useCssAndCx();
|
24
|
+
|
25
|
+
const { msg, msgStr } = i18n;
|
26
|
+
|
27
|
+
useEffect(() => {
|
28
|
+
let isCleanedUp = false;
|
29
|
+
|
30
|
+
headInsert({
|
31
|
+
"type": "javascript",
|
32
|
+
"src": pathJoin(kcContext.url.resourcesCommonPath, "node_modules/jquery/dist/jquery.min.js")
|
33
|
+
}).then(() => {
|
34
|
+
if (isCleanedUp) return;
|
35
|
+
|
36
|
+
evaluateInlineScript();
|
37
|
+
});
|
38
|
+
|
39
|
+
return () => {
|
40
|
+
isCleanedUp = true;
|
41
|
+
};
|
42
|
+
}, []);
|
43
|
+
|
44
|
+
return (
|
45
|
+
<Template
|
46
|
+
{...{ kcContext, i18n, doFetchDefaultThemeResources, ...kcProps }}
|
47
|
+
headerNode={msg("doLogIn")}
|
48
|
+
formNode={
|
49
|
+
<form id="kc-otp-login-form" className={cx(kcProps.kcFormClass)} action={url.loginAction} method="post">
|
50
|
+
{otpLogin.userOtpCredentials.length > 1 && (
|
51
|
+
<div className={cx(kcProps.kcFormGroupClass)}>
|
52
|
+
<div className={cx(kcProps.kcInputWrapperClass)}>
|
53
|
+
{otpLogin.userOtpCredentials.map(otpCredential => (
|
54
|
+
<div key={otpCredential.id} className={cx(kcProps.kcSelectOTPListClass)}>
|
55
|
+
<input type="hidden" value="${otpCredential.id}" />
|
56
|
+
<div className={cx(kcProps.kcSelectOTPListItemClass)}>
|
57
|
+
<span className={cx(kcProps.kcAuthenticatorOtpCircleClass)} />
|
58
|
+
<h2 className={cx(kcProps.kcSelectOTPItemHeadingClass)}>{otpCredential.userLabel}</h2>
|
56
59
|
</div>
|
57
|
-
|
58
|
-
|
59
|
-
</div>
|
60
|
-
)}
|
61
|
-
<div className={cx(props.kcFormGroupClass)}>
|
62
|
-
<div className={cx(props.kcLabelWrapperClass)}>
|
63
|
-
<label htmlFor="otp" className={cx(props.kcLabelClass)}>
|
64
|
-
{msg("loginOtpOneTime")}
|
65
|
-
</label>
|
60
|
+
</div>
|
61
|
+
))}
|
66
62
|
</div>
|
63
|
+
</div>
|
64
|
+
)}
|
65
|
+
<div className={cx(kcProps.kcFormGroupClass)}>
|
66
|
+
<div className={cx(kcProps.kcLabelWrapperClass)}>
|
67
|
+
<label htmlFor="otp" className={cx(kcProps.kcLabelClass)}>
|
68
|
+
{msg("loginOtpOneTime")}
|
69
|
+
</label>
|
70
|
+
</div>
|
67
71
|
|
68
|
-
|
69
|
-
|
70
|
-
</div>
|
72
|
+
<div className={cx(kcProps.kcInputWrapperClass)}>
|
73
|
+
<input id="otp" name="otp" autoComplete="off" type="text" className={cx(kcProps.kcInputClass)} autoFocus />
|
71
74
|
</div>
|
75
|
+
</div>
|
72
76
|
|
73
|
-
|
74
|
-
|
75
|
-
|
76
|
-
|
77
|
+
<div className={cx(kcProps.kcFormGroupClass)}>
|
78
|
+
<div id="kc-form-options" className={cx(kcProps.kcFormOptionsClass)}>
|
79
|
+
<div className={cx(kcProps.kcFormOptionsWrapperClass)} />
|
80
|
+
</div>
|
77
81
|
|
78
|
-
|
79
|
-
|
80
|
-
|
81
|
-
|
82
|
-
|
83
|
-
|
84
|
-
|
85
|
-
|
86
|
-
|
87
|
-
|
88
|
-
|
89
|
-
|
90
|
-
|
91
|
-
</div>
|
82
|
+
<div id="kc-form-buttons" className={cx(kcProps.kcFormButtonsClass)}>
|
83
|
+
<input
|
84
|
+
className={cx(
|
85
|
+
kcProps.kcButtonClass,
|
86
|
+
kcProps.kcButtonPrimaryClass,
|
87
|
+
kcProps.kcButtonBlockClass,
|
88
|
+
kcProps.kcButtonLargeClass
|
89
|
+
)}
|
90
|
+
name="login"
|
91
|
+
id="kc-login"
|
92
|
+
type="submit"
|
93
|
+
value={msgStr("doLogIn")}
|
94
|
+
/>
|
92
95
|
</div>
|
93
|
-
</
|
94
|
-
|
95
|
-
|
96
|
-
|
97
|
-
|
98
|
-
);
|
96
|
+
</div>
|
97
|
+
</form>
|
98
|
+
}
|
99
|
+
/>
|
100
|
+
);
|
101
|
+
});
|
99
102
|
|
100
103
|
declare const $: any;
|
101
104
|
|
@@ -1,44 +1,47 @@
|
|
1
1
|
import React, { memo } from "react";
|
2
|
-
import
|
2
|
+
import DefaultTemplate from "./Template";
|
3
|
+
import type { TemplateProps } from "./Template";
|
3
4
|
import type { KcProps } from "./KcProps";
|
4
5
|
import type { KcContextBase } from "../getKcContext/KcContextBase";
|
5
6
|
import type { I18n } from "../i18n";
|
6
7
|
|
7
|
-
|
8
|
-
|
9
|
-
|
10
|
-
|
11
|
-
|
12
|
-
|
13
|
-
}: { kcContext: KcContextBase.LoginPageExpired; i18n: I18n; doFetchDefaultThemeResources?: boolean } & KcProps) => {
|
14
|
-
const { url } = kcContext;
|
8
|
+
export type LoginPageExpired = KcProps & {
|
9
|
+
kcContext: KcContextBase.LoginPageExpired;
|
10
|
+
i18n: I18n;
|
11
|
+
doFetchDefaultThemeResources?: boolean;
|
12
|
+
Template?: (props: TemplateProps) => JSX.Element | null;
|
13
|
+
};
|
15
14
|
|
16
|
-
|
15
|
+
const LoginPageExpired = memo((props: LoginPageExpired) => {
|
16
|
+
const { kcContext, i18n, doFetchDefaultThemeResources = true, Template = DefaultTemplate, ...kcProps } = props;
|
17
17
|
|
18
|
-
|
19
|
-
|
20
|
-
|
21
|
-
|
22
|
-
|
23
|
-
|
24
|
-
|
25
|
-
|
26
|
-
|
27
|
-
|
28
|
-
|
29
|
-
|
30
|
-
|
31
|
-
|
32
|
-
|
33
|
-
|
34
|
-
|
35
|
-
|
36
|
-
|
37
|
-
|
38
|
-
|
39
|
-
|
40
|
-
|
41
|
-
|
42
|
-
|
18
|
+
const { url } = kcContext;
|
19
|
+
|
20
|
+
const { msg } = i18n;
|
21
|
+
|
22
|
+
return (
|
23
|
+
<Template
|
24
|
+
{...{ kcContext, i18n, doFetchDefaultThemeResources, ...kcProps }}
|
25
|
+
displayMessage={false}
|
26
|
+
headerNode={msg("pageExpiredTitle")}
|
27
|
+
formNode={
|
28
|
+
<>
|
29
|
+
<p id="instruction1" className="instruction">
|
30
|
+
{msg("pageExpiredMsg1")}
|
31
|
+
<a id="loginRestartLink" href={url.loginRestartFlowUrl}>
|
32
|
+
{msg("doClickHere")}
|
33
|
+
</a>{" "}
|
34
|
+
.<br />
|
35
|
+
{msg("pageExpiredMsg2")}{" "}
|
36
|
+
<a id="loginContinueLink" href={url.loginAction}>
|
37
|
+
{msg("doClickHere")}
|
38
|
+
</a>{" "}
|
39
|
+
.
|
40
|
+
</p>
|
41
|
+
</>
|
42
|
+
}
|
43
|
+
/>
|
44
|
+
);
|
45
|
+
});
|
43
46
|
|
44
47
|
export default LoginPageExpired;
|
@@ -1,5 +1,6 @@
|
|
1
1
|
import React, { useState, memo } from "react";
|
2
|
-
import
|
2
|
+
import DefaultTemplate from "./Template";
|
3
|
+
import type { TemplateProps } from "./Template";
|
3
4
|
import type { KcProps } from "./KcProps";
|
4
5
|
import type { KcContextBase } from "../getKcContext/KcContextBase";
|
5
6
|
import { useCssAndCx } from "../tools/useCssAndCx";
|
@@ -7,90 +8,92 @@ import { useConstCallback } from "powerhooks/useConstCallback";
|
|
7
8
|
import type { FormEventHandler } from "react";
|
8
9
|
import type { I18n } from "../i18n";
|
9
10
|
|
10
|
-
|
11
|
-
|
12
|
-
|
13
|
-
|
14
|
-
|
15
|
-
|
16
|
-
}: { kcContext: KcContextBase.LoginPassword; i18n: I18n; doFetchDefaultThemeResources?: boolean } & KcProps) => {
|
17
|
-
const { realm, url, login } = kcContext;
|
11
|
+
export type LoginPasswordProps = KcProps & {
|
12
|
+
kcContext: KcContextBase.LoginPassword;
|
13
|
+
i18n: I18n;
|
14
|
+
doFetchDefaultThemeResources?: boolean;
|
15
|
+
Template?: (props: TemplateProps) => JSX.Element | null;
|
16
|
+
};
|
18
17
|
|
19
|
-
|
18
|
+
const LoginPassword = memo((props: LoginPasswordProps) => {
|
19
|
+
const { kcContext, i18n, doFetchDefaultThemeResources = true, Template = DefaultTemplate, ...kcProps } = props;
|
20
20
|
|
21
|
-
|
21
|
+
const { realm, url, login } = kcContext;
|
22
22
|
|
23
|
-
|
23
|
+
const { msg, msgStr } = i18n;
|
24
24
|
|
25
|
-
|
26
|
-
e.preventDefault();
|
25
|
+
const { cx } = useCssAndCx();
|
27
26
|
|
28
|
-
|
27
|
+
const [isLoginButtonDisabled, setIsLoginButtonDisabled] = useState(false);
|
29
28
|
|
30
|
-
|
29
|
+
const onSubmit = useConstCallback<FormEventHandler<HTMLFormElement>>(e => {
|
30
|
+
e.preventDefault();
|
31
31
|
|
32
|
-
|
33
|
-
});
|
32
|
+
setIsLoginButtonDisabled(true);
|
34
33
|
|
35
|
-
|
36
|
-
|
37
|
-
|
38
|
-
|
39
|
-
|
40
|
-
|
41
|
-
|
42
|
-
|
43
|
-
|
44
|
-
|
45
|
-
|
46
|
-
|
47
|
-
|
48
|
-
|
49
|
-
|
50
|
-
|
51
|
-
|
52
|
-
|
53
|
-
|
54
|
-
|
55
|
-
|
56
|
-
|
57
|
-
|
58
|
-
|
59
|
-
|
60
|
-
|
61
|
-
|
62
|
-
|
63
|
-
|
64
|
-
|
65
|
-
|
66
|
-
|
67
|
-
|
68
|
-
|
69
|
-
|
70
|
-
|
71
|
-
|
72
|
-
|
73
|
-
|
74
|
-
className={cx(
|
75
|
-
props.kcButtonClass,
|
76
|
-
props.kcButtonPrimaryClass,
|
77
|
-
props.kcButtonBlockClass,
|
78
|
-
props.kcButtonLargeClass
|
79
|
-
)}
|
80
|
-
name="login"
|
81
|
-
id="kc-login"
|
82
|
-
type="submit"
|
83
|
-
value={msgStr("doLogIn")}
|
84
|
-
disabled={isLoginButtonDisabled}
|
85
|
-
/>
|
34
|
+
const formElement = e.target as HTMLFormElement;
|
35
|
+
|
36
|
+
formElement.submit();
|
37
|
+
});
|
38
|
+
|
39
|
+
return (
|
40
|
+
<Template
|
41
|
+
{...{ kcContext, i18n, doFetchDefaultThemeResources, ...kcProps }}
|
42
|
+
headerNode={msg("doLogIn")}
|
43
|
+
formNode={
|
44
|
+
<div id="kc-form">
|
45
|
+
<div id="kc-form-wrapper">
|
46
|
+
<form id="kc-form-login" onSubmit={onSubmit} action={url.loginAction} method="post">
|
47
|
+
<div className={cx(kcProps.kcFormGroupClass)}>
|
48
|
+
<hr />
|
49
|
+
<label htmlFor="password" className={cx(kcProps.kcLabelClass)}>
|
50
|
+
{msg("password")}
|
51
|
+
</label>
|
52
|
+
<input
|
53
|
+
tabIndex={2}
|
54
|
+
id="password"
|
55
|
+
className={cx(kcProps.kcInputClass)}
|
56
|
+
name="password"
|
57
|
+
type="password"
|
58
|
+
autoFocus={true}
|
59
|
+
autoComplete="on"
|
60
|
+
defaultValue={login.password ?? ""}
|
61
|
+
/>
|
62
|
+
</div>
|
63
|
+
<div className={cx(kcProps.kcFormGroupClass, kcProps.kcFormSettingClass)}>
|
64
|
+
<div id="kc-form-options" />
|
65
|
+
<div className={cx(kcProps.kcFormOptionsWrapperClass)}>
|
66
|
+
{realm.resetPasswordAllowed && (
|
67
|
+
<span>
|
68
|
+
<a tabIndex={5} href={url.loginResetCredentialsUrl}>
|
69
|
+
{msg("doForgotPassword")}
|
70
|
+
</a>
|
71
|
+
</span>
|
72
|
+
)}
|
86
73
|
</div>
|
87
|
-
</
|
88
|
-
|
74
|
+
</div>
|
75
|
+
<div id="kc-form-buttons" className={cx(kcProps.kcFormGroupClass)}>
|
76
|
+
<input
|
77
|
+
tabIndex={4}
|
78
|
+
className={cx(
|
79
|
+
kcProps.kcButtonClass,
|
80
|
+
kcProps.kcButtonPrimaryClass,
|
81
|
+
kcProps.kcButtonBlockClass,
|
82
|
+
kcProps.kcButtonLargeClass
|
83
|
+
)}
|
84
|
+
name="login"
|
85
|
+
id="kc-login"
|
86
|
+
type="submit"
|
87
|
+
value={msgStr("doLogIn")}
|
88
|
+
disabled={isLoginButtonDisabled}
|
89
|
+
/>
|
90
|
+
</div>
|
91
|
+
</form>
|
89
92
|
</div>
|
90
|
-
|
91
|
-
|
92
|
-
|
93
|
-
|
94
|
-
);
|
93
|
+
</div>
|
94
|
+
}
|
95
|
+
/>
|
96
|
+
);
|
97
|
+
});
|
95
98
|
|
96
99
|
export default LoginPassword;
|
@@ -1,79 +1,82 @@
|
|
1
1
|
import React, { memo } from "react";
|
2
|
-
import
|
2
|
+
import DefaultTemplate from "./Template";
|
3
|
+
import type { TemplateProps } from "./Template";
|
3
4
|
import type { KcProps } from "./KcProps";
|
4
5
|
import type { KcContextBase } from "../getKcContext/KcContextBase";
|
5
6
|
import { useCssAndCx } from "../tools/useCssAndCx";
|
6
7
|
import type { I18n } from "../i18n";
|
7
8
|
|
8
|
-
|
9
|
-
|
10
|
-
|
11
|
-
|
12
|
-
|
13
|
-
|
14
|
-
}: { kcContext: KcContextBase.LoginResetPassword; i18n: I18n; doFetchDefaultThemeResources?: boolean } & KcProps) => {
|
15
|
-
const { url, realm, auth } = kcContext;
|
9
|
+
export type LoginResetPasswordProps = KcProps & {
|
10
|
+
kcContext: KcContextBase.LoginResetPassword;
|
11
|
+
i18n: I18n;
|
12
|
+
doFetchDefaultThemeResources?: boolean;
|
13
|
+
Template?: (props: TemplateProps) => JSX.Element | null;
|
14
|
+
};
|
16
15
|
|
17
|
-
|
16
|
+
const LoginResetPassword = memo((props: LoginResetPasswordProps) => {
|
17
|
+
const { kcContext, i18n, doFetchDefaultThemeResources = true, Template = DefaultTemplate, ...kcProps } = props;
|
18
18
|
|
19
|
-
|
19
|
+
const { url, realm, auth } = kcContext;
|
20
20
|
|
21
|
-
|
22
|
-
|
23
|
-
|
24
|
-
|
25
|
-
|
26
|
-
|
27
|
-
|
28
|
-
|
29
|
-
|
30
|
-
|
31
|
-
|
32
|
-
|
33
|
-
|
34
|
-
|
35
|
-
|
36
|
-
|
37
|
-
|
38
|
-
|
39
|
-
|
40
|
-
|
41
|
-
id="username"
|
42
|
-
name="username"
|
43
|
-
className={cx(props.kcInputClass)}
|
44
|
-
autoFocus
|
45
|
-
defaultValue={auth !== undefined && auth.showUsername ? auth.attemptedUsername : undefined}
|
46
|
-
/>
|
47
|
-
</div>
|
21
|
+
const { msg, msgStr } = i18n;
|
22
|
+
|
23
|
+
const { cx } = useCssAndCx();
|
24
|
+
|
25
|
+
return (
|
26
|
+
<Template
|
27
|
+
{...{ kcContext, i18n, doFetchDefaultThemeResources, ...kcProps }}
|
28
|
+
displayMessage={false}
|
29
|
+
headerNode={msg("emailForgotTitle")}
|
30
|
+
formNode={
|
31
|
+
<form id="kc-reset-password-form" className={cx(kcProps.kcFormClass)} action={url.loginAction} method="post">
|
32
|
+
<div className={cx(kcProps.kcFormGroupClass)}>
|
33
|
+
<div className={cx(kcProps.kcLabelWrapperClass)}>
|
34
|
+
<label htmlFor="username" className={cx(kcProps.kcLabelClass)}>
|
35
|
+
{!realm.loginWithEmailAllowed
|
36
|
+
? msg("username")
|
37
|
+
: !realm.registrationEmailAsUsername
|
38
|
+
? msg("usernameOrEmail")
|
39
|
+
: msg("email")}
|
40
|
+
</label>
|
48
41
|
</div>
|
49
|
-
<div className={cx(
|
50
|
-
<
|
51
|
-
|
52
|
-
|
53
|
-
|
54
|
-
|
55
|
-
|
42
|
+
<div className={cx(kcProps.kcInputWrapperClass)}>
|
43
|
+
<input
|
44
|
+
type="text"
|
45
|
+
id="username"
|
46
|
+
name="username"
|
47
|
+
className={cx(kcProps.kcInputClass)}
|
48
|
+
autoFocus
|
49
|
+
defaultValue={auth !== undefined && auth.showUsername ? auth.attemptedUsername : undefined}
|
50
|
+
/>
|
51
|
+
</div>
|
52
|
+
</div>
|
53
|
+
<div className={cx(kcProps.kcFormGroupClass, kcProps.kcFormSettingClass)}>
|
54
|
+
<div id="kc-form-options" className={cx(kcProps.kcFormOptionsClass)}>
|
55
|
+
<div className={cx(kcProps.kcFormOptionsWrapperClass)}>
|
56
|
+
<span>
|
57
|
+
<a href={url.loginUrl}>{msg("backToLogin")}</a>
|
58
|
+
</span>
|
56
59
|
</div>
|
60
|
+
</div>
|
57
61
|
|
58
|
-
|
59
|
-
|
60
|
-
|
61
|
-
|
62
|
-
|
63
|
-
|
64
|
-
|
65
|
-
|
66
|
-
|
67
|
-
|
68
|
-
|
69
|
-
</div>
|
62
|
+
<div id="kc-form-buttons" className={cx(kcProps.kcFormButtonsClass)}>
|
63
|
+
<input
|
64
|
+
className={cx(
|
65
|
+
kcProps.kcButtonClass,
|
66
|
+
kcProps.kcButtonPrimaryClass,
|
67
|
+
kcProps.kcButtonBlockClass,
|
68
|
+
kcProps.kcButtonLargeClass
|
69
|
+
)}
|
70
|
+
type="submit"
|
71
|
+
value={msgStr("doSubmit")}
|
72
|
+
/>
|
70
73
|
</div>
|
71
|
-
</
|
72
|
-
|
73
|
-
|
74
|
-
|
75
|
-
|
76
|
-
|
77
|
-
);
|
74
|
+
</div>
|
75
|
+
</form>
|
76
|
+
}
|
77
|
+
infoNode={msg("emailInstruction")}
|
78
|
+
/>
|
79
|
+
);
|
80
|
+
});
|
78
81
|
|
79
82
|
export default LoginResetPassword;
|