@keycloakify/angular 0.0.1-rc.25 → 0.0.1-rc.27

package/src/login/containers/template/template.component.ts

@@ -59,7 +59,7 @@ export class DynamicPageInjectorComponent {
 
 @Component({
     selector: 'kc-root',
-    templateUrl: './template.component.html',
+    templateUrl: 'template.component.html',
     standalone: true,
     imports: [AsyncPipe, KcSanitizePipe, NgTemplateOutlet, KcClassDirective, DynamicPageInjectorComponent],
     changeDetection: ChangeDetectionStrategy.OnPush,
@@ -70,7 +70,7 @@ export class DynamicPageInjectorComponent {
         }
     ]
 })
-export class TemplateComponent extends ComponentReference implements OnInit {
+export class TemplateComponent extends ComponentReference {
     i18n = inject<I18n>(LOGIN_I18N);
     renderer = inject(Renderer2);
     #cdr = inject(ChangeDetectorRef);
@@ -98,14 +98,9 @@ export class TemplateComponent extends ComponentReference implements OnInit {
     constructor() {
         super();
 
-        this.title.setTitle(this.documentTitle ?? this.i18n.msgStr('loginTitle', this.kcContext.realm.displayName));
         this.isReadyToRender$ = this.loginResourceInjectorService.injectResource(this.doUseDefaultCss);
     }
 
-    ngOnInit() {
-        this.applyKcIndexClasses();
-    }
-
     private applyKcIndexClasses() {
         const kcClsx = getKcClsx({
             doUseDefaultCss: this.doUseDefaultCss,
@@ -128,14 +123,14 @@ export class TemplateComponent extends ComponentReference implements OnInit {
     }
 
     onComponentCreated(compRef: object) {
-        if ('displayInfo' in compRef && compRef.displayInfo) {
-            this.displayInfo = compRef.displayInfo as boolean;
+        if ('displayInfo' in compRef) {
+            this.displayInfo = !!compRef.displayInfo as boolean;
         }
-        if ('displayMessage' in compRef && compRef.displayMessage) {
-            this.displayMessage = compRef.displayMessage as boolean;
+        if ('displayMessage' in compRef) {
+            this.displayMessage = !!compRef.displayMessage as boolean;
         }
-        if ('displayRequiredFields' in compRef && compRef.displayRequiredFields) {
-            this.displayRequiredFields = compRef.displayRequiredFields as boolean;
+        if ('displayRequiredFields' in compRef) {
+            this.displayRequiredFields = !!compRef.displayRequiredFields as boolean;
         }
         if ('documentTitle' in compRef && compRef.documentTitle) {
             this.documentTitle = compRef.documentTitle as string;
@@ -161,6 +156,8 @@ export class TemplateComponent extends ComponentReference implements OnInit {
                 return socialProvidersNode;
             });
         }
+        this.title.setTitle(this.documentTitle ?? this.i18n.msgStr('loginTitle', this.kcContext.realm.displayName));
+        this.applyKcIndexClasses();
         this.#cdr.markForCheck();
     }
 }

package/src/login/pages/code/code.component.ts

@@ -36,7 +36,7 @@ export class CodeComponent extends ComponentReference {
     displayInfo = false;
     displayMessage = false;
 
-    headerNode? = viewChild<TemplateRef<HTMLElement>>('headerNode');
-    infoNode? = viewChild<TemplateRef<HTMLElement>>('infoNode');
-    socialProvidersNode? = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
+    headerNode = viewChild<TemplateRef<HTMLElement>>('headerNode');
+    infoNode = viewChild<TemplateRef<HTMLElement>>('infoNode');
+    socialProvidersNode = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
 }

package/src/login/pages/delete-account-confirm/delete-account-confirm.component.ts

@@ -1,7 +1,6 @@
 import { ChangeDetectionStrategy, Component, forwardRef, inject, type TemplateRef, viewChild } from '@angular/core';
 import { USE_DEFAULT_CSS } from '@keycloakify/angular/lib/tokens/use-default-css';
 import { ComponentReference } from '@keycloakify/angular/login/classes/component-reference';
-import { TemplateComponent } from '@keycloakify/angular/login/containers/template';
 import { KcClassDirective } from '@keycloakify/angular/login/directives/kc-class';
 import type { I18n } from '@keycloakify/angular/login/i18n';
 import type { KcContext } from '@keycloakify/angular/login/KcContext';
@@ -12,7 +11,7 @@ import type { ClassKey } from 'keycloakify/login/lib/kcClsx';
 
 @Component({
     standalone: true,
-    imports: [TemplateComponent, KcClassDirective],
+    imports: [KcClassDirective],
     selector: 'kc-delete-account-confirm',
     templateUrl: 'delete-account-confirm.component.html',
     changeDetection: ChangeDetectionStrategy.OnPush,
@@ -37,7 +36,7 @@ export class DeleteAccountConfirmComponent extends ComponentReference {
     displayInfo = false;
     displayMessage = false;
 
-    headerNode? = viewChild<TemplateRef<HTMLElement>>('headerNode');
-    infoNode? = viewChild<TemplateRef<HTMLElement>>('infoNode');
-    socialProvidersNode? = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
+    headerNode = viewChild<TemplateRef<HTMLElement>>('headerNode');
+    infoNode = viewChild<TemplateRef<HTMLElement>>('infoNode');
+    socialProvidersNode = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
 }

package/src/login/pages/delete-credential/delete-credential.component.ts

@@ -36,7 +36,7 @@ export class DeleteCredentialComponent extends ComponentReference {
     displayInfo = false;
     displayMessage = false;
 
-    headerNode? = viewChild<TemplateRef<HTMLElement>>('headerNode');
-    infoNode? = viewChild<TemplateRef<HTMLElement>>('infoNode');
-    socialProvidersNode? = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
+    headerNode = viewChild<TemplateRef<HTMLElement>>('headerNode');
+    infoNode = viewChild<TemplateRef<HTMLElement>>('infoNode');
+    socialProvidersNode = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
 }

package/src/login/pages/error/error.component.ts

@@ -36,7 +36,7 @@ export class ErrorComponent extends ComponentReference {
     displayInfo = false;
     displayMessage = false;
 
-    headerNode? = viewChild<TemplateRef<HTMLElement>>('headerNode');
-    infoNode? = viewChild<TemplateRef<HTMLElement>>('infoNode');
-    socialProvidersNode? = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
+    headerNode = viewChild<TemplateRef<HTMLElement>>('headerNode');
+    infoNode = viewChild<TemplateRef<HTMLElement>>('infoNode');
+    socialProvidersNode = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
 }

package/src/login/pages/frontchannel-logout/frontchannel-logout.component.html

@@ -10,7 +10,7 @@
             {{ client.name }}
             <iframe
                 style="display: none"
-                [src]="'client.frontChannelLogoutUrl' | kcSanitize: 'resourceUrl'"
+                [src]="client.frontChannelLogoutUrl | kcSanitize: 'resourceUrl'"
             ></iframe>
         </li>
     }

package/src/login/pages/frontchannel-logout/frontchannel-logout.component.ts

@@ -29,16 +29,16 @@ export class FrontchannelLogoutComponent extends ComponentReference implements O
     override doUseDefaultCss = inject<boolean>(USE_DEFAULT_CSS);
     override classes = inject<Partial<Record<ClassKey, string>>>(LOGIN_CLASSES);
 
-    documentTitle: string | undefined;
+    documentTitle: string | undefined = this.i18n.msgStr('frontchannel-logout.title');
     bodyClassName: string | undefined;
 
-    displayRequiredFields = this.i18n.msgStr('frontchannel-logout.title');
+    displayRequiredFields = false;
     displayInfo = false;
     displayMessage = false;
 
-    headerNode? = viewChild<TemplateRef<HTMLElement>>('headerNode');
-    infoNode? = viewChild<TemplateRef<HTMLElement>>('infoNode');
-    socialProvidersNode? = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
+    headerNode = viewChild<TemplateRef<HTMLElement>>('headerNode');
+    infoNode = viewChild<TemplateRef<HTMLElement>>('infoNode');
+    socialProvidersNode = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
 
     ngOnInit(): void {
         if (this.kcContext.logout.logoutRedirectUri) {

package/src/login/pages/idp-review-user-profile/idp-review-user-profile.component.ts

@@ -41,9 +41,9 @@ export class IdpReviewUserProfileComponent extends ComponentReference {
     displayInfo = false;
     displayMessage = !this.kcContext?.messagesPerField?.existsError('global');
 
-    headerNode? = viewChild<TemplateRef<HTMLElement>>('headerNode');
-    infoNode? = viewChild<TemplateRef<HTMLElement>>('infoNode');
-    socialProvidersNode? = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
+    headerNode = viewChild<TemplateRef<HTMLElement>>('headerNode');
+    infoNode = viewChild<TemplateRef<HTMLElement>>('infoNode');
+    socialProvidersNode = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
 
     userProfileFormFields = input<Type<UserProfileFormFieldsComponent>>();
     isFormSubmittable = signal(false);

package/src/login/pages/info/info.component.ts

@@ -36,9 +36,9 @@ export class InfoComponent extends ComponentReference {
     displayInfo = false;
     displayMessage = false;
 
-    headerNode? = viewChild<TemplateRef<HTMLElement>>('headerNode');
-    infoNode? = viewChild<TemplateRef<HTMLElement>>('infoNode');
-    socialProvidersNode? = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
+    headerNode = viewChild<TemplateRef<HTMLElement>>('headerNode');
+    infoNode = viewChild<TemplateRef<HTMLElement>>('infoNode');
+    socialProvidersNode = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
 
     get infoMessage() {
         let html = this.kcContext.message.summary;

package/src/login/pages/login/login.component.ts

@@ -14,7 +14,7 @@ import type { ClassKey } from 'keycloakify/login/lib/kcClsx';
 
 @Component({
     selector: 'kc-login',
-    templateUrl: './login.component.html',
+    templateUrl: 'login.component.html',
     standalone: true,
     changeDetection: ChangeDetectionStrategy.OnPush,
     imports: [KcClassDirective, AsyncPipe, KcSanitizePipe, PasswordWrapperComponent, NgClass, CommonModule],
@@ -39,9 +39,9 @@ export class LoginComponent extends ComponentReference {
     displayInfo = !!this.kcContext?.realm?.password && !!this.kcContext?.realm?.registrationAllowed && !this.kcContext?.registrationDisabled;
     displayMessage = !this.kcContext?.messagesPerField?.existsError('username', 'password');
 
-    headerNode? = viewChild<TemplateRef<HTMLElement>>('headerNode');
-    infoNode? = viewChild<TemplateRef<HTMLElement>>('infoNode');
-    socialProvidersNode? = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
+    headerNode = viewChild<TemplateRef<HTMLElement>>('headerNode');
+    infoNode = viewChild<TemplateRef<HTMLElement>>('infoNode');
+    socialProvidersNode = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
 
     isLoginButtonDisabled = signal(false);
 }

package/src/login/pages/login-config-totp/login-config-totp.component.ts

@@ -37,7 +37,7 @@ export class LoginConfigTotpComponent extends ComponentReference {
     displayInfo = false;
     displayMessage = !this.kcContext.messagesPerField.existsError('totp', 'userLabel');
 
-    headerNode? = viewChild<TemplateRef<HTMLElement>>('headerNode');
-    infoNode? = viewChild<TemplateRef<HTMLElement>>('infoNode');
-    socialProvidersNode? = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
+    headerNode = viewChild<TemplateRef<HTMLElement>>('headerNode');
+    infoNode = viewChild<TemplateRef<HTMLElement>>('infoNode');
+    socialProvidersNode = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
 }

package/src/login/pages/login-idp-link-confirm/login-idp-link-confirm.component.ts

@@ -30,7 +30,7 @@ export class LoginIdpLinkConfirmComponent extends ComponentReference {
     displayInfo = false;
     displayMessage = !this.kcContext.messagesPerField.existsError('totp', 'userLabel');
 
-    headerNode? = viewChild<TemplateRef<HTMLElement>>('headerNode');
-    infoNode? = viewChild<TemplateRef<HTMLElement>>('infoNode');
-    socialProvidersNode? = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
+    headerNode = viewChild<TemplateRef<HTMLElement>>('headerNode');
+    infoNode = viewChild<TemplateRef<HTMLElement>>('infoNode');
+    socialProvidersNode = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
 }

package/src/login/pages/login-idp-link-confirm-override/login-idp-link-confirm-override.component.ts

@@ -30,7 +30,7 @@ export class LoginIdpLinkConfirmOverrideComponent extends ComponentReference {
     displayInfo = false;
     displayMessage = !this.kcContext.messagesPerField.existsError('totp', 'userLabel');
 
-    headerNode? = viewChild<TemplateRef<HTMLElement>>('headerNode');
-    infoNode? = viewChild<TemplateRef<HTMLElement>>('infoNode');
-    socialProvidersNode? = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
+    headerNode = viewChild<TemplateRef<HTMLElement>>('headerNode');
+    infoNode = viewChild<TemplateRef<HTMLElement>>('infoNode');
+    socialProvidersNode = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
 }

package/src/login/pages/login-idp-link-email/login-idp-link-email.component.ts

@@ -30,7 +30,7 @@ export class LoginIdpLinkEmailComponent extends ComponentReference {
     displayInfo = false;
     displayMessage = false;
 
-    headerNode? = viewChild<TemplateRef<HTMLElement>>('headerNode');
-    infoNode? = viewChild<TemplateRef<HTMLElement>>('infoNode');
-    socialProvidersNode? = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
+    headerNode = viewChild<TemplateRef<HTMLElement>>('headerNode');
+    infoNode = viewChild<TemplateRef<HTMLElement>>('infoNode');
+    socialProvidersNode = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
 }

package/src/login/pages/login-oauth-grant/login-oauth-grant.component.ts

@@ -30,7 +30,7 @@ export class LoginOauthGrantComponent extends ComponentReference {
     displayInfo = false;
     displayMessage = false;
 
-    headerNode? = viewChild<TemplateRef<HTMLElement>>('headerNode');
-    infoNode? = viewChild<TemplateRef<HTMLElement>>('infoNode');
-    socialProvidersNode? = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
+    headerNode = viewChild<TemplateRef<HTMLElement>>('headerNode');
+    infoNode = viewChild<TemplateRef<HTMLElement>>('infoNode');
+    socialProvidersNode = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
 }

package/src/login/pages/login-oauth2-device-verify-user-code/login-oauth2-device-verify-user-code.component.ts

@@ -35,7 +35,7 @@ export class LoginOauth2DeviceVerifyUserCodeComponent extends ComponentReference
     displayInfo = false;
     displayMessage = false;
 
-    headerNode? = viewChild<TemplateRef<HTMLElement>>('headerNode');
-    infoNode? = viewChild<TemplateRef<HTMLElement>>('infoNode');
-    socialProvidersNode? = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
+    headerNode = viewChild<TemplateRef<HTMLElement>>('headerNode');
+    infoNode = viewChild<TemplateRef<HTMLElement>>('infoNode');
+    socialProvidersNode = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
 }

package/src/login/pages/login-otp/login-otp.component.ts

@@ -37,7 +37,7 @@ export class LoginOtpComponent extends ComponentReference {
     displayInfo = false;
     displayMessage: boolean = this.kcContext.messagesPerField.existsError('totp');
 
-    headerNode? = viewChild<TemplateRef<HTMLElement>>('headerNode');
-    infoNode? = viewChild<TemplateRef<HTMLElement>>('infoNode');
-    socialProvidersNode? = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
+    headerNode = viewChild<TemplateRef<HTMLElement>>('headerNode');
+    infoNode = viewChild<TemplateRef<HTMLElement>>('infoNode');
+    socialProvidersNode = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
 }

package/src/login/pages/login-page-expired/login-page-expired.component.ts

@@ -34,7 +34,7 @@ export class LoginPageExpiredComponent extends ComponentReference {
     displayInfo = false;
     displayMessage = false;
 
-    headerNode? = viewChild<TemplateRef<HTMLElement>>('headerNode');
-    infoNode? = viewChild<TemplateRef<HTMLElement>>('infoNode');
-    socialProvidersNode? = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
+    headerNode = viewChild<TemplateRef<HTMLElement>>('headerNode');
+    infoNode = viewChild<TemplateRef<HTMLElement>>('infoNode');
+    socialProvidersNode = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
 }

package/src/login/pages/login-passkeys-conditional-authenticate/login-passkeys-conditional-authenticate.component.ts

@@ -39,9 +39,9 @@ export class LoginPasskeysConditionalAuthenticateComponent extends ComponentRefe
     displayInfo = true;
     displayMessage = false;
 
-    headerNode? = viewChild<TemplateRef<HTMLElement>>('headerNode');
-    infoNode? = viewChild<TemplateRef<HTMLElement>>('infoNode');
-    socialProvidersNode? = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
+    headerNode = viewChild<TemplateRef<HTMLElement>>('headerNode');
+    infoNode = viewChild<TemplateRef<HTMLElement>>('infoNode');
+    socialProvidersNode = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
     authButtonId = 'authenticateWebAuthnButton';
 
     constructor() {

package/src/login/pages/login-password/login-password.component.ts

@@ -38,9 +38,9 @@ export class LoginPasswordComponent extends ComponentReference {
     displayInfo = true;
     displayMessage = this.kcContext.messagesPerField.existsError('password');
 
-    headerNode? = viewChild<TemplateRef<HTMLElement>>('headerNode');
-    infoNode? = viewChild<TemplateRef<HTMLElement>>('infoNode');
-    socialProvidersNode? = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
+    headerNode = viewChild<TemplateRef<HTMLElement>>('headerNode');
+    infoNode = viewChild<TemplateRef<HTMLElement>>('infoNode');
+    socialProvidersNode = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
     authButtonId = 'authenticateWebAuthnButton';
 
     isLoginButtonDisabled = signal(false);

package/src/login/pages/login-recovery-authn-code-config/login-recovery-authn-code-config.component.ts

@@ -37,9 +37,9 @@ export class LoginRecoveryAuthnCodeConfigComponent extends ComponentReference {
     displayInfo = true;
     displayMessage = this.kcContext.messagesPerField.existsError('password');
 
-    headerNode? = viewChild<TemplateRef<HTMLElement>>('headerNode');
-    infoNode? = viewChild<TemplateRef<HTMLElement>>('infoNode');
-    socialProvidersNode? = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
+    headerNode = viewChild<TemplateRef<HTMLElement>>('headerNode');
+    infoNode = viewChild<TemplateRef<HTMLElement>>('infoNode');
+    socialProvidersNode = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
 
     toggleRecoveryCodesConfirmation = signal(false);
 

package/src/login/pages/login-recovery-authn-code-input/login-recovery-authn-code-input.component.ts

@@ -37,7 +37,7 @@ export class LoginRecoveryAuthnCodeInputComponent extends ComponentReference {
     displayInfo = true;
     displayMessage: boolean = this.kcContext.messagesPerField.existsError('recoveryCodeInput');
 
-    headerNode? = viewChild<TemplateRef<HTMLElement>>('headerNode');
-    infoNode? = viewChild<TemplateRef<HTMLElement>>('infoNode');
-    socialProvidersNode? = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
+    headerNode = viewChild<TemplateRef<HTMLElement>>('headerNode');
+    infoNode = viewChild<TemplateRef<HTMLElement>>('infoNode');
+    socialProvidersNode = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
 }

package/src/login/pages/login-reset-otp/login-reset-otp.component.ts

@@ -36,7 +36,7 @@ export class LoginResetOtpComponent extends ComponentReference {
     displayInfo = true;
     displayMessage: boolean = this.kcContext.messagesPerField.existsError('totp');
 
-    headerNode? = viewChild<TemplateRef<HTMLElement>>('headerNode');
-    infoNode? = viewChild<TemplateRef<HTMLElement>>('infoNode');
-    socialProvidersNode? = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
+    headerNode = viewChild<TemplateRef<HTMLElement>>('headerNode');
+    infoNode = viewChild<TemplateRef<HTMLElement>>('infoNode');
+    socialProvidersNode = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
 }

package/src/login/pages/login-reset-password/login-reset-password.component.ts

@@ -37,7 +37,7 @@ export class LoginResetPasswordComponent extends ComponentReference {
     displayInfo = false;
     displayMessage: boolean = this.kcContext.messagesPerField.existsError('username');
 
-    headerNode? = viewChild<TemplateRef<HTMLElement>>('headerNode');
-    infoNode? = viewChild<TemplateRef<HTMLElement>>('infoNode');
-    socialProvidersNode? = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
+    headerNode = viewChild<TemplateRef<HTMLElement>>('headerNode');
+    infoNode = viewChild<TemplateRef<HTMLElement>>('infoNode');
+    socialProvidersNode = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
 }

package/src/login/pages/login-update-password/login-update-password.component.ts

@@ -39,7 +39,7 @@ export class LoginUpdatePasswordComponent extends ComponentReference {
     displayInfo = false;
     displayMessage = !this.kcContext.messagesPerField.existsError('password', 'password-confirm');
 
-    headerNode? = viewChild<TemplateRef<HTMLElement>>('headerNode');
-    infoNode? = viewChild<TemplateRef<HTMLElement>>('infoNode');
-    socialProvidersNode? = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
+    headerNode = viewChild<TemplateRef<HTMLElement>>('headerNode');
+    infoNode = viewChild<TemplateRef<HTMLElement>>('infoNode');
+    socialProvidersNode = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
 }

package/src/login/pages/login-update-profile/login-update-profile.component.ts

@@ -41,9 +41,9 @@ export class LoginUpdateProfileComponent extends ComponentReference {
     displayInfo = false;
     displayMessage: boolean = this.kcContext.messagesPerField.exists('global');
 
-    headerNode? = viewChild<TemplateRef<HTMLElement>>('headerNode');
-    infoNode? = viewChild<TemplateRef<HTMLElement>>('infoNode');
-    socialProvidersNode? = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
+    headerNode = viewChild<TemplateRef<HTMLElement>>('headerNode');
+    infoNode = viewChild<TemplateRef<HTMLElement>>('infoNode');
+    socialProvidersNode = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
 
     isFormSubmittable = signal(false);
     userProfileFormFields = input<Type<UserProfileFormFieldsComponent>>();

package/src/login/pages/login-username/login-username.component.ts

@@ -13,7 +13,7 @@ import type { ClassKey } from 'keycloakify/login/lib/kcClsx';
 
 @Component({
     selector: 'kc-login-username',
-    templateUrl: './login-username.component.html',
+    templateUrl: 'login-username.component.html',
     standalone: true,
     changeDetection: ChangeDetectionStrategy.OnPush,
     imports: [KcClassDirective, AsyncPipe, KcSanitizePipe, NgClass],
@@ -37,9 +37,9 @@ export class LoginUsernameComponent extends ComponentReference {
     displayInfo: boolean = !!this.kcContext?.realm?.password && !!this.kcContext?.realm?.registrationAllowed && !this.kcContext?.registrationDisabled;
     displayMessage: boolean = !this.kcContext?.messagesPerField?.existsError('username');
 
-    headerNode? = viewChild<TemplateRef<HTMLElement>>('headerNode');
-    infoNode? = viewChild<TemplateRef<HTMLElement>>('infoNode');
-    socialProvidersNode? = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
+    headerNode = viewChild<TemplateRef<HTMLElement>>('headerNode');
+    infoNode = viewChild<TemplateRef<HTMLElement>>('infoNode');
+    socialProvidersNode = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
 
     isLoginButtonDisabled = signal(false);
 }

package/src/login/pages/login-verify-email/login-verify-email.component.ts

@@ -35,7 +35,7 @@ export class LoginVerifyEmailComponent extends ComponentReference {
     displayInfo = true;
     displayMessage = true;
 
-    headerNode? = viewChild<TemplateRef<HTMLElement>>('headerNode');
-    infoNode? = viewChild<TemplateRef<HTMLElement>>('infoNode');
-    socialProvidersNode? = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
+    headerNode = viewChild<TemplateRef<HTMLElement>>('headerNode');
+    infoNode = viewChild<TemplateRef<HTMLElement>>('infoNode');
+    socialProvidersNode = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
 }

package/src/login/pages/login-x509-info/login-x509-info.component.ts

@@ -35,7 +35,7 @@ export class LoginX509InfoComponent extends ComponentReference {
     displayInfo = false;
     displayMessage = false;
 
-    headerNode? = viewChild<TemplateRef<HTMLElement>>('headerNode');
-    infoNode? = viewChild<TemplateRef<HTMLElement>>('infoNode');
-    socialProvidersNode? = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
+    headerNode = viewChild<TemplateRef<HTMLElement>>('headerNode');
+    infoNode = viewChild<TemplateRef<HTMLElement>>('infoNode');
+    socialProvidersNode = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
 }

package/src/login/pages/logout-confirm/logout-confirm.component.ts

@@ -30,7 +30,7 @@ export class LogoutConfirmComponent extends ComponentReference {
     displayInfo = false;
     displayMessage = true;
 
-    headerNode? = viewChild<TemplateRef<HTMLElement>>('headerNode');
-    infoNode? = viewChild<TemplateRef<HTMLElement>>('infoNode');
-    socialProvidersNode? = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
+    headerNode = viewChild<TemplateRef<HTMLElement>>('headerNode');
+    infoNode = viewChild<TemplateRef<HTMLElement>>('infoNode');
+    socialProvidersNode = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
 }

package/src/login/pages/register/register.component.ts

@@ -16,7 +16,7 @@ import type { ClassKey } from 'keycloakify/login/lib/kcClsx';
 
 @Component({
     selector: 'kc-register',
-    templateUrl: './register.component.html',
+    templateUrl: 'register.component.html',
     standalone: true,
     changeDetection: ChangeDetectionStrategy.OnPush,
     imports: [KcClassDirective, AsyncPipe, KcSanitizePipe, NgClass, NgComponentOutlet],
@@ -42,9 +42,9 @@ export class RegisterComponent extends ComponentReference {
     displayInfo = false;
     displayMessage: boolean = !this.kcContext?.messagesPerField?.existsError('global');
 
-    headerNode? = viewChild<TemplateRef<HTMLElement>>('headerNode');
-    infoNode? = viewChild<TemplateRef<HTMLElement>>('infoNode');
-    socialProvidersNode? = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
+    headerNode = viewChild<TemplateRef<HTMLElement>>('headerNode');
+    infoNode = viewChild<TemplateRef<HTMLElement>>('infoNode');
+    socialProvidersNode = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
 
     isFormSubmittable = signal(false);
     areTermsAccepted = signal(false);

package/src/login/pages/saml-post-form/saml-post-form.component.ts

@@ -35,9 +35,9 @@ export class SamlPostFormComponent extends ComponentReference implements AfterVi
     displayInfo = false;
     displayMessage = true;
 
-    headerNode? = viewChild<TemplateRef<HTMLElement>>('headerNode');
-    infoNode? = viewChild<TemplateRef<HTMLElement>>('infoNode');
-    socialProvidersNode? = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
+    headerNode = viewChild<TemplateRef<HTMLElement>>('headerNode');
+    infoNode = viewChild<TemplateRef<HTMLElement>>('infoNode');
+    socialProvidersNode = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
     htmlFormElement = viewChild<HTMLFormElement>('setHtmlFormElement');
 
     ngAfterViewInit(): void {

package/src/login/pages/select-authenticator/select-authenticator.component.ts

@@ -37,7 +37,7 @@ export class SelectAuthenticatorComponent extends ComponentReference {
     displayInfo = false;
     displayMessage = true;
 
-    headerNode? = viewChild<TemplateRef<HTMLElement>>('headerNode');
-    infoNode? = viewChild<TemplateRef<HTMLElement>>('infoNode');
-    socialProvidersNode? = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
+    headerNode = viewChild<TemplateRef<HTMLElement>>('headerNode');
+    infoNode = viewChild<TemplateRef<HTMLElement>>('infoNode');
+    socialProvidersNode = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
 }

package/src/login/pages/terms/terms.component.ts

@@ -36,7 +36,7 @@ export class TermsComponent extends ComponentReference {
     displayInfo = false;
     displayMessage = false;
 
-    headerNode? = viewChild<TemplateRef<HTMLElement>>('headerNode');
-    infoNode? = viewChild<TemplateRef<HTMLElement>>('infoNode');
-    socialProvidersNode? = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
+    headerNode = viewChild<TemplateRef<HTMLElement>>('headerNode');
+    infoNode = viewChild<TemplateRef<HTMLElement>>('infoNode');
+    socialProvidersNode = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
 }

package/src/login/pages/update-email/update-email.component.ts

@@ -36,9 +36,9 @@ export class UpdateEmailComponent extends ComponentReference {
     displayInfo = false;
     displayMessage = this.kcContext.messagesPerField.exists('global');
 
-    headerNode? = viewChild<TemplateRef<HTMLElement>>('headerNode');
-    infoNode? = viewChild<TemplateRef<HTMLElement>>('infoNode');
-    socialProvidersNode? = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
+    headerNode = viewChild<TemplateRef<HTMLElement>>('headerNode');
+    infoNode = viewChild<TemplateRef<HTMLElement>>('infoNode');
+    socialProvidersNode = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
 
     userProfileFormFields = input<Type<UserProfileFormFieldsComponent>>();
     isFormSubmittable = signal(false);

package/src/login/pages/webauthn-authenticate/webauthn-authenticate.component.ts

@@ -40,9 +40,9 @@ export class WebauthnAuthenticateComponent extends ComponentReference {
     displayInfo = false;
     displayMessage = true;
 
-    headerNode? = viewChild<TemplateRef<HTMLElement>>('headerNode');
-    infoNode? = viewChild<TemplateRef<HTMLElement>>('infoNode');
-    socialProvidersNode? = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
+    headerNode = viewChild<TemplateRef<HTMLElement>>('headerNode');
+    infoNode = viewChild<TemplateRef<HTMLElement>>('infoNode');
+    socialProvidersNode = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
 
     authButtonId = 'authenticateWebAuthnButton';
 

package/src/login/pages/webauthn-error/webauthn-error.component.ts

@@ -37,9 +37,9 @@ export class WebauthnErrorComponent extends ComponentReference {
     displayInfo = false;
     displayMessage = true;
 
-    headerNode? = viewChild<TemplateRef<HTMLElement>>('headerNode');
-    infoNode? = viewChild<TemplateRef<HTMLElement>>('infoNode');
-    socialProvidersNode? = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
+    headerNode = viewChild<TemplateRef<HTMLElement>>('headerNode');
+    infoNode = viewChild<TemplateRef<HTMLElement>>('infoNode');
+    socialProvidersNode = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
 
     onClick() {
         // @ts-expect-error: Trusted Keycloak's code

package/src/login/pages/webauthn-register/webauthn-register.component.ts

@@ -40,9 +40,9 @@ export class WebauthnRegisterComponent extends ComponentReference {
     displayInfo = false;
     displayMessage = true;
 
-    headerNode? = viewChild<TemplateRef<HTMLElement>>('headerNode');
-    infoNode? = viewChild<TemplateRef<HTMLElement>>('infoNode');
-    socialProvidersNode? = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
+    headerNode = viewChild<TemplateRef<HTMLElement>>('headerNode');
+    infoNode = viewChild<TemplateRef<HTMLElement>>('infoNode');
+    socialProvidersNode = viewChild<TemplateRef<HTMLElement>>('socialProvidersNode');
 
     authButtonId = 'authenticateWebAuthnButton';