agtic/keycloak_theme
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Better autoComplete typings

Browse Source
This commit is contained in:
garronej
2021-11-01 22:28:53 +01:00
parent cbfc271da5
commit 2ee00ed919
3 changed files with 58 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
src/lib/components/RegisterUserProfile.tsx
View File

@ -149,15 +149,6 @@ const UserProfileFormFields = memo(({ kcContext, onIsFormSubmittableValueChange,
</div>
<div className={cx(props.kcInputWrapperClass)}>
<input
autoComplete={(() => {
switch (attribute.name) {
case "password-confirm":
case "password":
return "new-password";
default:
return undefined;
}
})()}
type={(() => {
switch (attribute.name) {
case "password-confirm":
@ -174,11 +165,7 @@ const UserProfileFormFields = memo(({ kcContext, onIsFormSubmittableValueChange,
className={cx(props.kcInputClass)}
aria-invalid={displayableErrors.length !== 0}
disabled={attribute.readOnly}
{...(attribute.autocomplete === undefined
? {}
: {
"autoComplete": attribute.autocomplete,
})}
autoComplete={attribute.autocomplete}
onBlur={onBlurFactory(attribute.name)}
/>
{displayableErrors.length !== 0 && (

56
src/lib/getKcContext/KcContextBase.ts
View File

@ -217,10 +217,64 @@ export type Attribute = {
groupDisplayHeader?: string;
groupDisplayDescription?: string;
readOnly: boolean;
autocomplete?: string;
validators: Validators;
annotations: Record<string, string>;
groupAnnotations: Record<string, string>;
autocomplete?:
| "on"
| "off"
| "name"
| "honorific-prefix"
| "given-name"
| "additional-name"
| "family-name"
| "honorific-suffix"
| "nickname"
| "email"
| "username"
| "new-password"
| "current-password"
| "one-time-code"
| "organization-title"
| "organization"
| "street-address"
| "address-line1"
| "address-line2"
| "address-line3"
| "address-level4"
| "address-level3"
| "address-level2"
| "address-level1"
| "country"
| "country-name"
| "postal-code"
| "cc-name"
| "cc-given-name"
| "cc-additional-name"
| "cc-family-name"
| "cc-number"
| "cc-exp"
| "cc-exp-month"
| "cc-exp-year"
| "cc-csc"
| "cc-type"
| "transaction-currency"
| "transaction-amount"
| "language"
| "bday"
| "bday-day"
| "bday-month"
| "bday-year"
| "sex"
| "tel"
| "tel-country-code"
| "tel-national"
| "tel-area-code"
| "tel-local"
| "tel-extension"
| "impp"
| "url"
| "photo";
};
export type Validators = Partial<{

2
src/lib/useFormValidationSlice.tsx
View File

@ -312,6 +312,7 @@ export function useFormValidationSlice(params: {
"validators": passwordValidators,
"annotations": {},
"groupAnnotations": {},
"autocomplete": "new-password",
}),
id<Attribute>({
"name": "password-confirm",
@ -328,6 +329,7 @@ export function useFormValidationSlice(params: {
},
"annotations": {},
"groupAnnotations": {},
"autocomplete": "new-password",
}),
]),
],