keycloakify 7.0.0-rc.6 → 7.0.0-rc.7

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.
Files changed (76) hide show
  1. package/bin/eject-keycloak-page.js +1 -1
  2. package/bin/eject-keycloak-page.js.map +1 -1
  3. package/bin/initialize-email-theme.js +6 -2
  4. package/bin/initialize-email-theme.js.map +1 -1
  5. package/login/Template.js +2 -2
  6. package/login/Template.js.map +1 -1
  7. package/login/TemplateProps.d.ts +1 -1
  8. package/login/TemplateProps.js.map +1 -1
  9. package/login/pages/Error.js +1 -1
  10. package/login/pages/Error.js.map +1 -1
  11. package/login/pages/IdpReviewUserProfile.js +1 -1
  12. package/login/pages/IdpReviewUserProfile.js.map +1 -1
  13. package/login/pages/Info.js +2 -2
  14. package/login/pages/Info.js.map +1 -1
  15. package/login/pages/Login.js +4 -4
  16. package/login/pages/Login.js.map +1 -1
  17. package/login/pages/LoginConfigTotp.js +1 -1
  18. package/login/pages/LoginConfigTotp.js.map +1 -1
  19. package/login/pages/LoginIdpLinkConfirm.js +1 -1
  20. package/login/pages/LoginIdpLinkConfirm.js.map +1 -1
  21. package/login/pages/LoginIdpLinkEmail.js +2 -2
  22. package/login/pages/LoginIdpLinkEmail.js.map +1 -1
  23. package/login/pages/LoginOtp.js +1 -1
  24. package/login/pages/LoginOtp.js.map +1 -1
  25. package/login/pages/LoginPageExpired.js +2 -2
  26. package/login/pages/LoginPageExpired.js.map +1 -1
  27. package/login/pages/LoginPassword.js +1 -1
  28. package/login/pages/LoginPassword.js.map +1 -1
  29. package/login/pages/LoginResetPassword.js +2 -2
  30. package/login/pages/LoginResetPassword.js.map +1 -1
  31. package/login/pages/LoginUpdatePassword.js +1 -1
  32. package/login/pages/LoginUpdatePassword.js.map +1 -1
  33. package/login/pages/LoginUpdateProfile.js +1 -1
  34. package/login/pages/LoginUpdateProfile.js.map +1 -1
  35. package/login/pages/LoginUsername.js +4 -4
  36. package/login/pages/LoginUsername.js.map +1 -1
  37. package/login/pages/LoginVerifyEmail.js +2 -2
  38. package/login/pages/LoginVerifyEmail.js.map +1 -1
  39. package/login/pages/LogoutConfirm.js +2 -2
  40. package/login/pages/LogoutConfirm.js.map +1 -1
  41. package/login/pages/Register.js +1 -1
  42. package/login/pages/Register.js.map +1 -1
  43. package/login/pages/RegisterUserProfile.js +1 -1
  44. package/login/pages/RegisterUserProfile.js.map +1 -1
  45. package/login/pages/Terms.js +2 -2
  46. package/login/pages/Terms.js.map +1 -1
  47. package/login/pages/UpdateUserProfile.js +1 -1
  48. package/login/pages/UpdateUserProfile.js.map +1 -1
  49. package/login/pages/WebauthnAuthenticate.js +1 -1
  50. package/login/pages/WebauthnAuthenticate.js.map +1 -1
  51. package/package.json +1 -1
  52. package/src/bin/eject-keycloak-page.ts +1 -1
  53. package/src/bin/initialize-email-theme.ts +9 -1
  54. package/src/login/Template.tsx +3 -3
  55. package/src/login/TemplateProps.ts +2 -1
  56. package/src/login/pages/Error.tsx +12 -17
  57. package/src/login/pages/IdpReviewUserProfile.tsx +27 -31
  58. package/src/login/pages/Info.tsx +22 -23
  59. package/src/login/pages/Login.tsx +143 -144
  60. package/src/login/pages/LoginConfigTotp.tsx +135 -143
  61. package/src/login/pages/LoginIdpLinkConfirm.tsx +34 -38
  62. package/src/login/pages/LoginIdpLinkEmail.tsx +11 -17
  63. package/src/login/pages/LoginOtp.tsx +44 -48
  64. package/src/login/pages/LoginPageExpired.tsx +14 -21
  65. package/src/login/pages/LoginPassword.tsx +50 -54
  66. package/src/login/pages/LoginResetPassword.tsx +44 -45
  67. package/src/login/pages/LoginUpdatePassword.tsx +96 -100
  68. package/src/login/pages/LoginUpdateProfile.tsx +100 -107
  69. package/src/login/pages/LoginUsername.tsx +108 -109
  70. package/src/login/pages/LoginVerifyEmail.tsx +10 -17
  71. package/src/login/pages/LogoutConfirm.tsx +33 -40
  72. package/src/login/pages/Register.tsx +120 -127
  73. package/src/login/pages/RegisterUserProfile.tsx +36 -37
  74. package/src/login/pages/Terms.tsx +26 -33
  75. package/src/login/pages/UpdateUserProfile.tsx +46 -50
  76. package/src/login/pages/WebauthnAuthenticate.tsx +87 -96
package/src/login/pages/LoginPassword.tsx CHANGED
@@ -32,61 +32,57 @@ export default function LoginPassword(props: PageProps<Extract<KcContext, { "pag
32
32
  });
33
33
 
34
34
  return (
35
- <Template
36
- {...{ kcContext, i18n, doUseDefaultCss, classes }}
37
- headerNode={msg("doLogIn")}
38
- formNode={
39
- <div id="kc-form">
40
- <div id="kc-form-wrapper">
41
- <form id="kc-form-login" onSubmit={onSubmit} action={url.loginAction} method="post">
42
- <div className={getClassName("kcFormGroupClass")}>
43
- <hr />
44
- <label htmlFor="password" className={getClassName("kcLabelClass")}>
45
- {msg("password")}
46
- </label>
47
- <input
48
- tabIndex={2}
49
- id="password"
50
- className={getClassName("kcInputClass")}
51
- name="password"
52
- type="password"
53
- autoFocus={true}
54
- autoComplete="on"
55
- defaultValue={login.password ?? ""}
56
- />
35
+ <Template {...{ kcContext, i18n, doUseDefaultCss, classes }} headerNode={msg("doLogIn")}>
36
+ <div id="kc-form">
37
+ <div id="kc-form-wrapper">
38
+ <form id="kc-form-login" onSubmit={onSubmit} action={url.loginAction} method="post">
39
+ <div className={getClassName("kcFormGroupClass")}>
40
+ <hr />
41
+ <label htmlFor="password" className={getClassName("kcLabelClass")}>
42
+ {msg("password")}
43
+ </label>
44
+ <input
45
+ tabIndex={2}
46
+ id="password"
47
+ className={getClassName("kcInputClass")}
48
+ name="password"
49
+ type="password"
50
+ autoFocus={true}
51
+ autoComplete="on"
52
+ defaultValue={login.password ?? ""}
53
+ />
54
+ </div>
55
+ <div className={clsx(getClassName("kcFormGroupClass"), getClassName("kcFormSettingClass"))}>
56
+ <div id="kc-form-options" />
57
+ <div className={getClassName("kcFormOptionsWrapperClass")}>
58
+ {realm.resetPasswordAllowed && (
59
+ <span>
60
+ <a tabIndex={5} href={url.loginResetCredentialsUrl}>
61
+ {msg("doForgotPassword")}
62
+ </a>
63
+ </span>
64
+ )}
57
65
  </div>
58
- <div className={clsx(getClassName("kcFormGroupClass"), getClassName("kcFormSettingClass"))}>
59
- <div id="kc-form-options" />
60
- <div className={getClassName("kcFormOptionsWrapperClass")}>
61
- {realm.resetPasswordAllowed && (
62
- <span>
63
- <a tabIndex={5} href={url.loginResetCredentialsUrl}>
64
- {msg("doForgotPassword")}
65
- </a>
66
- </span>
67
- )}
68
- </div>
69
- </div>
70
- <div id="kc-form-buttons" className={getClassName("kcFormGroupClass")}>
71
- <input
72
- tabIndex={4}
73
- className={clsx(
74
- getClassName("kcButtonClass"),
75
- getClassName("kcButtonPrimaryClass"),
76
- getClassName("kcButtonBlockClass"),
77
- getClassName("kcButtonLargeClass")
78
- )}
79
- name="login"
80
- id="kc-login"
81
- type="submit"
82
- value={msgStr("doLogIn")}
83
- disabled={isLoginButtonDisabled}
84
- />
85
- </div>
86
- </form>
87
- </div>
66
+ </div>
67
+ <div id="kc-form-buttons" className={getClassName("kcFormGroupClass")}>
68
+ <input
69
+ tabIndex={4}
70
+ className={clsx(
71
+ getClassName("kcButtonClass"),
72
+ getClassName("kcButtonPrimaryClass"),
73
+ getClassName("kcButtonBlockClass"),
74
+ getClassName("kcButtonLargeClass")
75
+ )}
76
+ name="login"
77
+ id="kc-login"
78
+ type="submit"
79
+ value={msgStr("doLogIn")}
80
+ disabled={isLoginButtonDisabled}
81
+ />
82
+ </div>
83
+ </form>
88
84
  </div>
89
- }
90
- />
85
+ </div>
86
+ </Template>
91
87
  );
92
88
  }
package/src/login/pages/LoginResetPassword.tsx CHANGED
@@ -21,54 +21,53 @@ export default function LoginResetPassword(props: PageProps<Extract<KcContext, {
21
21
  {...{ kcContext, i18n, doUseDefaultCss, classes }}
22
22
  displayMessage={false}
23
23
  headerNode={msg("emailForgotTitle")}
24
- formNode={
25
- <form id="kc-reset-password-form" className={getClassName("kcFormClass")} action={url.loginAction} method="post">
26
- <div className={getClassName("kcFormGroupClass")}>
27
- <div className={getClassName("kcLabelWrapperClass")}>
28
- <label htmlFor="username" className={getClassName("kcLabelClass")}>
29
- {!realm.loginWithEmailAllowed
30
- ? msg("username")
31
- : !realm.registrationEmailAsUsername
32
- ? msg("usernameOrEmail")
33
- : msg("email")}
34
- </label>
35
- </div>
36
- <div className={getClassName("kcInputWrapperClass")}>
37
- <input
38
- type="text"
39
- id="username"
40
- name="username"
41
- className={getClassName("kcInputClass")}
42
- autoFocus
43
- defaultValue={auth !== undefined && auth.showUsername ? auth.attemptedUsername : undefined}
44
- />
45
- </div>
24
+ infoNode={msg("emailInstruction")}
25
+ >
26
+ <form id="kc-reset-password-form" className={getClassName("kcFormClass")} action={url.loginAction} method="post">
27
+ <div className={getClassName("kcFormGroupClass")}>
28
+ <div className={getClassName("kcLabelWrapperClass")}>
29
+ <label htmlFor="username" className={getClassName("kcLabelClass")}>
30
+ {!realm.loginWithEmailAllowed
31
+ ? msg("username")
32
+ : !realm.registrationEmailAsUsername
33
+ ? msg("usernameOrEmail")
34
+ : msg("email")}
35
+ </label>
36
+ </div>
37
+ <div className={getClassName("kcInputWrapperClass")}>
38
+ <input
39
+ type="text"
40
+ id="username"
41
+ name="username"
42
+ className={getClassName("kcInputClass")}
43
+ autoFocus
44
+ defaultValue={auth !== undefined && auth.showUsername ? auth.attemptedUsername : undefined}
45
+ />
46
46
  </div>
47
- <div className={clsx(getClassName("kcFormGroupClass"), getClassName("kcFormSettingClass"))}>
48
- <div id="kc-form-options" className={getClassName("kcFormOptionsClass")}>
49
- <div className={getClassName("kcFormOptionsWrapperClass")}>
50
- <span>
51
- <a href={url.loginUrl}>{msg("backToLogin")}</a>
52
- </span>
53
- </div>
47
+ </div>
48
+ <div className={clsx(getClassName("kcFormGroupClass"), getClassName("kcFormSettingClass"))}>
49
+ <div id="kc-form-options" className={getClassName("kcFormOptionsClass")}>
50
+ <div className={getClassName("kcFormOptionsWrapperClass")}>
51
+ <span>
52
+ <a href={url.loginUrl}>{msg("backToLogin")}</a>
53
+ </span>
54
54
  </div>
55
+ </div>
55
56
 
56
- <div id="kc-form-buttons" className={getClassName("kcFormButtonsClass")}>
57
- <input
58
- className={clsx(
59
- getClassName("kcButtonClass"),
60
- getClassName("kcButtonPrimaryClass"),
61
- getClassName("kcButtonBlockClass"),
62
- getClassName("kcButtonLargeClass")
63
- )}
64
- type="submit"
65
- value={msgStr("doSubmit")}
66
- />
67
- </div>
57
+ <div id="kc-form-buttons" className={getClassName("kcFormButtonsClass")}>
58
+ <input
59
+ className={clsx(
60
+ getClassName("kcButtonClass"),
61
+ getClassName("kcButtonPrimaryClass"),
62
+ getClassName("kcButtonBlockClass"),
63
+ getClassName("kcButtonLargeClass")
64
+ )}
65
+ type="submit"
66
+ value={msgStr("doSubmit")}
67
+ />
68
68
  </div>
69
- </form>
70
- }
71
- infoNode={msg("emailInstruction")}
72
- />
69
+ </div>
70
+ </form>
71
+ </Template>
73
72
  );
74
73
  }
package/src/login/pages/LoginUpdatePassword.tsx CHANGED
@@ -17,122 +17,118 @@ export default function LoginUpdatePassword(props: PageProps<Extract<KcContext,
17
17
  const { url, messagesPerField, isAppInitiatedAction, username } = kcContext;
18
18
 
19
19
  return (
20
- <Template
21
- {...{ kcContext, i18n, doUseDefaultCss, classes }}
22
- headerNode={msg("updatePasswordTitle")}
23
- formNode={
24
- <form id="kc-passwd-update-form" className={getClassName("kcFormClass")} action={url.loginAction} method="post">
25
- <input
26
- type="text"
27
- id="username"
28
- name="username"
29
- value={username}
30
- readOnly={true}
31
- autoComplete="username"
32
- style={{ display: "none" }}
33
- />
34
- <input type="password" id="password" name="password" autoComplete="current-password" style={{ display: "none" }} />
20
+ <Template {...{ kcContext, i18n, doUseDefaultCss, classes }} headerNode={msg("updatePasswordTitle")}>
21
+ <form id="kc-passwd-update-form" className={getClassName("kcFormClass")} action={url.loginAction} method="post">
22
+ <input
23
+ type="text"
24
+ id="username"
25
+ name="username"
26
+ value={username}
27
+ readOnly={true}
28
+ autoComplete="username"
29
+ style={{ display: "none" }}
30
+ />
31
+ <input type="password" id="password" name="password" autoComplete="current-password" style={{ display: "none" }} />
35
32
 
36
- <div
37
- className={clsx(
38
- getClassName("kcFormGroupClass"),
39
- messagesPerField.printIfExists("password", getClassName("kcFormGroupErrorClass"))
40
- )}
41
- >
42
- <div className={getClassName("kcLabelWrapperClass")}>
43
- <label htmlFor="password-new" className={getClassName("kcLabelClass")}>
44
- {msg("passwordNew")}
45
- </label>
46
- </div>
47
- <div className={getClassName("kcInputWrapperClass")}>
48
- <input
49
- type="password"
50
- id="password-new"
51
- name="password-new"
52
- autoFocus
53
- autoComplete="new-password"
54
- className={getClassName("kcInputClass")}
55
- />
56
- </div>
33
+ <div
34
+ className={clsx(
35
+ getClassName("kcFormGroupClass"),
36
+ messagesPerField.printIfExists("password", getClassName("kcFormGroupErrorClass"))
37
+ )}
38
+ >
39
+ <div className={getClassName("kcLabelWrapperClass")}>
40
+ <label htmlFor="password-new" className={getClassName("kcLabelClass")}>
41
+ {msg("passwordNew")}
42
+ </label>
43
+ </div>
44
+ <div className={getClassName("kcInputWrapperClass")}>
45
+ <input
46
+ type="password"
47
+ id="password-new"
48
+ name="password-new"
49
+ autoFocus
50
+ autoComplete="new-password"
51
+ className={getClassName("kcInputClass")}
52
+ />
57
53
  </div>
54
+ </div>
58
55
 
59
- <div
60
- className={clsx(
61
- getClassName("kcFormGroupClass"),
62
- messagesPerField.printIfExists("password-confirm", getClassName("kcFormGroupErrorClass"))
63
- )}
64
- >
65
- <div className={getClassName("kcLabelWrapperClass")}>
66
- <label htmlFor="password-confirm" className={getClassName("kcLabelClass")}>
67
- {msg("passwordConfirm")}
68
- </label>
69
- </div>
70
- <div className={getClassName("kcInputWrapperClass")}>
71
- <input
72
- type="password"
73
- id="password-confirm"
74
- name="password-confirm"
75
- autoComplete="new-password"
76
- className={getClassName("kcInputClass")}
77
- />
78
- </div>
56
+ <div
57
+ className={clsx(
58
+ getClassName("kcFormGroupClass"),
59
+ messagesPerField.printIfExists("password-confirm", getClassName("kcFormGroupErrorClass"))
60
+ )}
61
+ >
62
+ <div className={getClassName("kcLabelWrapperClass")}>
63
+ <label htmlFor="password-confirm" className={getClassName("kcLabelClass")}>
64
+ {msg("passwordConfirm")}
65
+ </label>
66
+ </div>
67
+ <div className={getClassName("kcInputWrapperClass")}>
68
+ <input
69
+ type="password"
70
+ id="password-confirm"
71
+ name="password-confirm"
72
+ autoComplete="new-password"
73
+ className={getClassName("kcInputClass")}
74
+ />
79
75
  </div>
76
+ </div>
80
77
 
81
- <div className={getClassName("kcFormGroupClass")}>
82
- <div id="kc-form-options" className={getClassName("kcFormOptionsClass")}>
83
- <div className={getClassName("kcFormOptionsWrapperClass")}>
84
- {isAppInitiatedAction && (
85
- <div className="checkbox">
86
- <label>
87
- <input type="checkbox" id="logout-sessions" name="logout-sessions" value="on" checked />
88
- {msgStr("logoutOtherSessions")}
89
- </label>
90
- </div>
91
- )}
92
- </div>
78
+ <div className={getClassName("kcFormGroupClass")}>
79
+ <div id="kc-form-options" className={getClassName("kcFormOptionsClass")}>
80
+ <div className={getClassName("kcFormOptionsWrapperClass")}>
81
+ {isAppInitiatedAction && (
82
+ <div className="checkbox">
83
+ <label>
84
+ <input type="checkbox" id="logout-sessions" name="logout-sessions" value="on" checked />
85
+ {msgStr("logoutOtherSessions")}
86
+ </label>
87
+ </div>
88
+ )}
93
89
  </div>
90
+ </div>
94
91
 
95
- <div id="kc-form-buttons" className={getClassName("kcFormButtonsClass")}>
96
- {isAppInitiatedAction ? (
97
- <>
98
- <input
99
- className={clsx(
100
- getClassName("kcButtonClass"),
101
- getClassName("kcButtonPrimaryClass"),
102
- getClassName("kcButtonLargeClass")
103
- )}
104
- type="submit"
105
- defaultValue={msgStr("doSubmit")}
106
- />
107
- <button
108
- className={clsx(
109
- getClassName("kcButtonClass"),
110
- getClassName("kcButtonDefaultClass"),
111
- getClassName("kcButtonLargeClass")
112
- )}
113
- type="submit"
114
- name="cancel-aia"
115
- value="true"
116
- >
117
- {msg("doCancel")}
118
- </button>
119
- </>
120
- ) : (
92
+ <div id="kc-form-buttons" className={getClassName("kcFormButtonsClass")}>
93
+ {isAppInitiatedAction ? (
94
+ <>
121
95
  <input
122
96
  className={clsx(
123
97
  getClassName("kcButtonClass"),
124
98
  getClassName("kcButtonPrimaryClass"),
125
- getClassName("kcButtonBlockClass"),
126
99
  getClassName("kcButtonLargeClass")
127
100
  )}
128
101
  type="submit"
129
102
  defaultValue={msgStr("doSubmit")}
130
103
  />
131
- )}
132
- </div>
104
+ <button
105
+ className={clsx(
106
+ getClassName("kcButtonClass"),
107
+ getClassName("kcButtonDefaultClass"),
108
+ getClassName("kcButtonLargeClass")
109
+ )}
110
+ type="submit"
111
+ name="cancel-aia"
112
+ value="true"
113
+ >
114
+ {msg("doCancel")}
115
+ </button>
116
+ </>
117
+ ) : (
118
+ <input
119
+ className={clsx(
120
+ getClassName("kcButtonClass"),
121
+ getClassName("kcButtonPrimaryClass"),
122
+ getClassName("kcButtonBlockClass"),
123
+ getClassName("kcButtonLargeClass")
124
+ )}
125
+ type="submit"
126
+ defaultValue={msgStr("doSubmit")}
127
+ />
128
+ )}
133
129
  </div>
134
- </form>
135
- }
136
- />
130
+ </div>
131
+ </form>
132
+ </Template>
137
133
  );
138
134
  }