@odx/auth 1.0.3 → 3.0.0

package/fesm2020/odx-auth.mjs

@@ -1,20 +1,22 @@
 import * as i0 from '@angular/core';
-import { inject, Injectable, EventEmitter, Directive, Output, HostListener, Component, ChangeDetectionStrategy, ViewEncapsulation, Input, NgModule, EnvironmentInjector, makeEnvironmentProviders, ENVIRONMENT_INITIALIZER, APP_INITIALIZER } from '@angular/core';
+import { InjectionToken, inject, Injectable, Directive, EventEmitter, Output, HostListener, Component, ChangeDetectionStrategy, ViewEncapsulation, Input, NgModule, EnvironmentInjector, makeEnvironmentProviders, ENVIRONMENT_INITIALIZER, APP_INITIALIZER } from '@angular/core';
 import { WindowRef, CoreModule } from '@odx/angular';
 import * as i3 from '@odx/angular/components/area-header';
 import { AreaHeaderModule } from '@odx/angular/components/area-header';
 import * as i8 from '@odx/angular/components/dropdown';
 import { DropdownModule } from '@odx/angular/components/dropdown';
-import * as i9 from '@odx/angular/components/header';
 import { HeaderModule } from '@odx/angular/components/header';
+import * as i1 from '@odx/angular/components/loading-spinner';
+import { LoadingSpinnerDirective, LoadingSpinnerModule } from '@odx/angular/components/loading-spinner';
 import { LogoDirective } from '@odx/angular/components/logo';
-import { createConfigTokens, Position, untilDestroyed, isString, buildUrl } from '@odx/angular/utils';
+import { isString, createConfigTokens, untilDestroyed, Position, buildUrl } from '@odx/angular/utils';
 import { HttpErrorResponse } from '@angular/common/http';
 import { Router } from '@angular/router';
+import { fromEvents } from '@odx/angular/rxjs';
 import { OAuthService, OAuthErrorEvent, provideOAuthClient, OAuthModuleConfig, OAuthStorage } from 'angular-oauth2-oidc';
-import { BehaviorSubject, fromEvent, filter, startWith, share, combineLatest, switchMap, map, shareReplay, tap, take } from 'rxjs';
-import * as i1 from '@odx/angular/components/loading-spinner';
-import { LoadingSpinnerDirective } from '@odx/angular/components/loading-spinner';
+import { deepmerge } from 'deepmerge-ts';
+import jwtDecode from 'jwt-decode';
+import { BehaviorSubject, filter, map, distinctUntilChanged, share, of, switchMap, combineLatest, tap, take, fromEvent, startWith, shareReplay, merge } from 'rxjs';
 import * as i1$1 from '@angular/common';
 import { NgIf } from '@angular/common';
 import * as i2 from '@ngrx/component';
@@ -23,12 +25,62 @@ import * as i5 from '@odx/angular/components/action-group';
 import * as i6 from '@odx/angular/components/button';
 import * as i7 from '@odx/angular/components/icon';
 
+function createInitials(value) {
+    if (!value)
+        return '';
+    const parts = value.trim().split(' ');
+    return parts.reduce((initials, curr, index) => {
+        if (index === 0 || index === parts.length - 1) {
+            initials += curr[0].toUpperCase();
+        }
+        return initials;
+    }, '');
+}
+
+function resolveEmail(claims) {
+    if (isString(claims['email'])) {
+        return claims['email'];
+    }
+    if (isString(claims['email_address'])) {
+        return claims['email_address'];
+    }
+    if (Array.isArray(claims['emails']) && isString(claims['emails'][0])) {
+        return claims['emails'][0];
+    }
+    return '';
+}
+
+function resolveUsername(claims) {
+    if (isString(claims['firstname']) && isString(claims['lastname'])) {
+        return `${claims['firstname']} ${claims['lastname']}`;
+    }
+    if (isString(claims['displayname'])) {
+        return claims['displayname'];
+    }
+    if (isString(claims['name'])) {
+        return claims['name'];
+    }
+    return '';
+}
+
 const DEFAULT_AUTH_SCOPES = ['openid', 'profile', 'email', 'offline_access'];
 const DEFAULT_ISSUERS = {
     dev: 'https://dev.login.draeger.com/oauth2/default',
     stage: 'https://test.login.draeger.com/oauth2/default',
     prod: 'https://login.draeger.com/oauth2/default',
 };
+const ODX_AUTH_CORE_PLUGINS = new InjectionToken('@odx/auth::CorePlugins', {
+    providedIn: 'root',
+    factory: () => [],
+});
+const ODX_AUTH_PLUGINS = new InjectionToken('@odx/auth::Plugins', {
+    providedIn: 'root',
+    factory: () => {
+        const { plugins } = injectAuthConfig();
+        const corePlugins = inject(ODX_AUTH_CORE_PLUGINS);
+        return [...corePlugins, ...plugins].map((pluginFactory) => pluginFactory());
+    },
+});
 const { AuthDefaultConfig, AuthConfig, injectAuthConfig, provideAuthConfig } = createConfigTokens('Auth', '@odx/auth', {
     environment: 'prod',
     redirectPath: 'login/callback',
@@ -39,60 +91,93 @@ const { AuthDefaultConfig, AuthConfig, injectAuthConfig, provideAuthConfig } = c
     errorHandler: (error) => {
         throw error;
     },
-    resolveUsername: (claims) => {
-        return claims?.displayname || claims?.name || '';
-    },
+    createInitials,
+    resolveEmail,
+    resolveUsername,
+    showRedirectOverlay: false,
+    plugins: [],
 });
 
-function createInititals(value) {
-    if (!value)
-        return '';
-    const parts = value.trim().split(' ');
-    return parts.reduce((initials, curr, index) => {
-        if (index === 0 || index === parts.length - 1) {
-            initials = `${initials}${curr.charAt(0).toUpperCase()}`;
+const ODX_AUTH_HTTP_CACHE_STORAGE = new InjectionToken('@odx/auth::AuthHttpCacheStorage', {
+    providedIn: 'root',
+    factory: () => inject(WindowRef).nativeWindow.caches,
+});
+class AuthHttpCache {
+    constructor() {
+        this.cacheStorage = inject(ODX_AUTH_HTTP_CACHE_STORAGE);
+    }
+    async delete(request) {
+        const cache = await this.cacheStorage.open(AuthHttpCache.CACHE_KEY);
+        return cache.delete(request);
+    }
+    async request(request) {
+        const cache = await this.cacheStorage.open(AuthHttpCache.CACHE_KEY);
+        try {
+            await cache.add(request);
         }
-        return initials;
-    }, '');
+        catch {
+            // ignore request errors
+        }
+        return cache.match(request, { ignoreVary: true, ignoreSearch: true }).then((res) => res?.json() ?? null);
+    }
 }
+AuthHttpCache.CACHE_KEY = '@odx/auth/http-cache';
+AuthHttpCache.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: AuthHttpCache, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+AuthHttpCache.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: AuthHttpCache, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: AuthHttpCache, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: 'root' }]
+        }] });
 
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-function parseIdentityClaims(identityClaims, resolveUsername) {
-    const parsedIdentityClaims = {
-        ...identityClaims,
-        email: identityClaims?.email ?? identityClaims.email_address ?? identityClaims.emails?.[0],
-    };
-    return {
-        ...parsedIdentityClaims,
-        initials: createInititals(resolveUsername(parsedIdentityClaims)),
-    };
+class AuthPluginManager {
+    constructor() {
+        this.plugins = inject(ODX_AUTH_PLUGINS);
+        this.result$$ = new BehaviorSubject(null);
+        this.pluginsReady$ = this.result$$.pipe(filter(Boolean), map(Boolean), distinctUntilChanged(), share());
+        this.pluginsLoading$ = this.result$$.pipe(map((result) => !result), distinctUntilChanged(), share());
+    }
+    runPlugins(authService) {
+        if (this.plugins.length < 1) {
+            return of({});
+        }
+        return authService.isInitialized$.pipe(switchMap(() => combineLatest(this.plugins.map((plugin) => plugin(authService)))), map((results) => deepmerge(...results)), tap((result) => this.result$$.next(result)), take(1));
+    }
+    getResult() {
+        return this.result$$.getValue() ?? {};
+    }
 }
+AuthPluginManager.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: AuthPluginManager, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+AuthPluginManager.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: AuthPluginManager, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: AuthPluginManager, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: 'root' }]
+        }] });
 
 class AuthService {
     constructor() {
         this.authConfig = injectAuthConfig();
+        this.authPluginManager = inject(AuthPluginManager);
         this.oauthService = inject(OAuthService);
         this.router = inject(Router);
         this.windowRef = inject(WindowRef);
         this.isInitialized$$ = new BehaviorSubject(false);
         this.onAccessTokenUpdate$ = fromEvent(this.windowRef.nativeWindow, 'storage').pipe(filter(({ key }) => key === 'access_token' || key === null), startWith(null), share());
         this.onAuthStateChange$ = combineLatest([this.oauthService.events.pipe(startWith(null)), this.windowRef.isOnline$, this.onAccessTokenUpdate$]);
-        this.isAuthenticated$ = this.isInitialized$$.pipe(filter(Boolean), switchMap(() => this.onAuthStateChange$), map(() => this.isAuthenticated()), shareReplay({ refCount: true }));
+        this.isInitialized$ = this.isInitialized$$.pipe(filter(Boolean), distinctUntilChanged());
+        this.isAuthenticated$ = this.isInitialized$.pipe(switchMap(() => this.authPluginManager.pluginsReady$), switchMap(() => this.onAuthStateChange$), map(() => this.isAuthenticated()), shareReplay({ refCount: true }));
         this.identityClaims$ = this.isAuthenticated$.pipe(map(() => this.getIdentityClaims()), shareReplay({ refCount: true }));
         this.errors$ = this.oauthService.events.pipe(filter((event) => event instanceof OAuthErrorEvent), share());
-        this.subscription = this.windowRef.isOnline$
-            .pipe(tap((isOnline) => {
+        this.isRedirecting$ = fromEvents(this.windowRef.nativeWindow, 'beforeunload').pipe(map(Boolean), distinctUntilChanged(), share());
+        this.isLoading$ = merge(this.isRedirecting$, this.authPluginManager.pluginsLoading$).pipe(distinctUntilChanged());
+        this.windowRef.isOnline$.subscribe((isOnline) => {
             if (isOnline) {
                 this.oauthService.setupAutomaticSilentRefresh();
             }
             else {
                 this.oauthService.stopAutomaticRefresh();
             }
-        }))
-            .subscribe();
-    }
-    ngOnDestroy() {
-        this.subscription.unsubscribe();
+        });
+        this.authPluginManager.runPlugins(this).subscribe();
     }
     async initialize(config) {
         this.oauthService.configure(config);
@@ -144,6 +229,10 @@ class AuthService {
     getAccessToken() {
         return this.oauthService.getAccessToken() ?? null;
     }
+    getAccessTokenPayload() {
+        const token = this.getAccessToken();
+        return token ? jwtDecode(token) : null;
+    }
     getRefreshToken() {
         return this.oauthService.getRefreshToken() ?? null;
     }
@@ -151,7 +240,14 @@ class AuthService {
         return this.oauthService.getIdToken() ?? null;
     }
     getIdentityClaims() {
-        return this.getIdToken() ? parseIdentityClaims(this.oauthService.getIdentityClaims(), this.authConfig.resolveUsername) : null;
+        if (!this.getIdToken())
+            return null;
+        return deepmerge(this.oauthService.getIdentityClaims(), this.authPluginManager.getResult());
+    }
+    getRawIdentityClaims() {
+        if (!this.getIdToken())
+            return null;
+        return this.oauthService.getIdentityClaims();
     }
     isAuthenticated() {
         if (this.windowRef.isOnline()) {
@@ -163,9 +259,9 @@ class AuthService {
         return this.isAuthenticated() && (authorizedHandler?.(this.getIdentityClaims(), this) ?? true);
     }
     async routeToRequestedUrl() {
-        if (this.oauthService.state) {
-            await this.router.navigateByUrl(decodeURIComponent(this.oauthService.state));
-        }
+        if (!this.oauthService.state)
+            return;
+        await this.router.navigateByUrl(decodeURIComponent(this.oauthService.state));
     }
     hasValidOfflineToken() {
         const issuedAt = this.getIdentityClaims()?.iat ?? 0;
@@ -179,24 +275,38 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
             args: [{ providedIn: 'root' }]
         }], ctorParameters: function () { return []; } });
 
-class SignInDirective {
+class AuthActionDirective {
     constructor() {
-        this.authService = inject(AuthService);
+        this.takeUntilDestroyed = untilDestroyed();
         this.loadingSpinnerDirective = inject(LoadingSpinnerDirective, { self: true });
-        // eslint-disable-next-line @angular-eslint/no-output-rename
-        this.afterSignIn = new EventEmitter();
+        this.authService = inject(AuthService);
     }
     ngAfterViewInit() {
         this.loadingSpinnerDirective.autoColor = true;
+        this.authService.isRedirecting$.pipe(this.takeUntilDestroyed()).subscribe(() => {
+            this.loadingSpinnerDirective.isLoading = true;
+        });
     }
-    async signIn() {
-        this.loadingSpinnerDirective.isLoading = true;
+}
+AuthActionDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: AuthActionDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+AuthActionDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.9", type: AuthActionDirective, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: AuthActionDirective, decorators: [{
+            type: Directive
+        }] });
+
+class SignInDirective extends AuthActionDirective {
+    constructor() {
+        super(...arguments);
+        // eslint-disable-next-line @angular-eslint/no-output-rename
+        this.afterSignIn = new EventEmitter();
+    }
+    handleClick() {
         this.authService.signIn();
-        this.afterSignIn.emit();
+        this.afterSignIn.next();
     }
 }
-SignInDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SignInDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-SignInDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.9", type: SignInDirective, isStandalone: true, selector: "[odxButton][odxAuthSignIn]", outputs: { afterSignIn: "odxAuthSignIn" }, host: { listeners: { "click": "signIn()" } }, hostDirectives: [{ directive: i1.LoadingSpinnerDirective }], ngImport: i0 });
+SignInDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SignInDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive });
+SignInDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.9", type: SignInDirective, isStandalone: true, selector: "[odxButton][odxAuthSignIn]", outputs: { afterSignIn: "odxAuthSignIn" }, host: { listeners: { "click": "handleClick()" } }, usesInheritance: true, hostDirectives: [{ directive: i1.LoadingSpinnerDirective }], ngImport: i0 });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SignInDirective, decorators: [{
             type: Directive,
             args: [{
@@ -207,29 +317,24 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
         }], propDecorators: { afterSignIn: [{
                 type: Output,
                 args: ['odxAuthSignIn']
-            }], signIn: [{
+            }], handleClick: [{
                 type: HostListener,
                 args: ['click']
             }] } });
 
-class SignOutDirective {
+class SignOutDirective extends AuthActionDirective {
     constructor() {
-        this.authService = inject(AuthService);
-        this.loadingSpinnerDirective = inject(LoadingSpinnerDirective, { self: true });
+        super(...arguments);
         // eslint-disable-next-line @angular-eslint/no-output-rename
         this.afterSignOut = new EventEmitter();
     }
-    ngAfterViewInit() {
-        this.loadingSpinnerDirective.autoColor = true;
-    }
-    async signIn() {
-        this.loadingSpinnerDirective.isLoading = true;
+    handleClick() {
         this.authService.signOut();
-        this.afterSignOut.emit();
+        this.afterSignOut.next();
     }
 }
-SignOutDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SignOutDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-SignOutDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.9", type: SignOutDirective, isStandalone: true, selector: "[odxButton][odxAuthSignOut]", outputs: { afterSignOut: "odxAuthSignOut" }, host: { listeners: { "click": "signIn()" } }, hostDirectives: [{ directive: i1.LoadingSpinnerDirective }], ngImport: i0 });
+SignOutDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SignOutDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive });
+SignOutDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.9", type: SignOutDirective, isStandalone: true, selector: "[odxButton][odxAuthSignOut]", outputs: { afterSignOut: "odxAuthSignOut" }, host: { listeners: { "click": "handleClick()" } }, usesInheritance: true, hostDirectives: [{ directive: i1.LoadingSpinnerDirective }], ngImport: i0 });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SignOutDirective, decorators: [{
             type: Directive,
             args: [{
@@ -240,15 +345,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
         }], propDecorators: { afterSignOut: [{
                 type: Output,
                 args: ['odxAuthSignOut']
-            }], signIn: [{
+            }], handleClick: [{
                 type: HostListener,
                 args: ['click']
             }] } });
 
 class AuthComponent {
     constructor() {
-        this.authService = inject(AuthService);
         this.authConfig = injectAuthConfig();
+        this.authService = inject(AuthService);
         this.dropdownOptions = {
             position: Position.BOTTOM_END,
             enableFallback: false,
@@ -259,10 +364,10 @@ class AuthComponent {
     }
 }
 AuthComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: AuthComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-AuthComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: AuthComponent, isStandalone: true, selector: "odx-auth", inputs: { signInButtonText: "signInButtonText", signOutButtonText: "signOutButtonText" }, ngImport: i0, template: "<odx-action-group *ngrxLet=\"{ idClaims: authService.identityClaims$, isAuthenticated: authService.isAuthenticated$ } as vm\">\n  <ng-template [ngIf]=\"vm.isAuthenticated\" [ngIfElse]=\"notAuthenticated\">\n    <button odxButton odxHeaderAvatar [odxDropdown]=\"userProfileMenu\" [odxDropdownOptions]=\"dropdownOptions\" data-testid=\"odx-auth-user-profile-button\">\n      <ng-template [ngTemplateOutlet]=\"userAvatar\"></ng-template>\n    </button>\n    <ng-template #userProfileMenu>\n      <odx-area-header class=\"odx-padding-x-12\" size=\"small\">\n        <ng-template [ngTemplateOutlet]=\"userAvatar\" ngProjectAs=\"odx-avatar\"></ng-template>\n        {{ authConfig.resolveUsername(vm.idClaims) }}\n        <odx-area-header-subtitle>\n          {{ vm.idClaims?.email }}\n        </odx-area-header-subtitle>\n      </odx-area-header>\n      <ng-content></ng-content>\n      <div class=\"odx-margin-top-12\" odxLayout=\"flex vertical-center\">\n        <odx-logo odxLayout=\"auto\" class=\"odx-margin-left-12 odx-margin-right-auto\"></odx-logo>\n        <button odxButton odxAuthSignOut variant=\"ghost\" data-testid=\"odx-auth-sign-out-button\">\n          {{ signOutButtonText }}\n          <odx-icon name=\"arrow-right\" alignRight></odx-icon>\n        </button>\n      </div>\n    </ng-template>\n  </ng-template>\n  <ng-template #notAuthenticated>\n    <button class=\"odx-auth-sign-in\" odxButton odxAuthSignIn variant=\"secondary\" data-testid=\"odx-auth-sign-in-button\">\n      <odx-icon name=\"user\" alignLeft></odx-icon>\n      {{ signInButtonText }}\n    </button>\n  </ng-template>\n  <ng-template #userAvatar>\n    <odx-avatar class=\"odx-auth-user-avatar\">\n      {{ vm.idClaims?.initials ?? '' }}\n    </odx-avatar>\n  </ng-template>\n</odx-action-group>\n", styles: [".odx-auth-user-profile .odx-dropdown__inner>.odx-area-header{max-width:max(360px,25vw);min-width:296px}\n"], dependencies: [{ kind: "ngmodule", type: CoreModule }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.LetDirective, selector: "[ngrxLet]", inputs: ["ngrxLet", "ngrxLetSuspenseTpl"] }, { kind: "ngmodule", type: AreaHeaderModule }, { kind: "component", type: i3.AreaHeaderComponent, selector: "odx-area-header", inputs: ["size"] }, { kind: "directive", type: i3.AreaHeaderSubtitleDirective, selector: "odx-area-header-subtitle" }, { kind: "component", type: i4.AvatarComponent, selector: "odx-avatar", inputs: ["size", "variant"] }, { kind: "component", type: i5.ActionGroupComponent, selector: "odx-action-group", inputs: ["reverse"] }, { kind: "component", type: i6.ButtonComponent, selector: "button[odxButton], a[odxButton]", inputs: ["variant", "size"] }, { kind: "component", type: i7.IconComponent, selector: "odx-icon", inputs: ["inline", "size", "name", "iconSet"] }, { kind: "ngmodule", type: DropdownModule }, { kind: "directive", type: i8.DropdownDirective, selector: "[odxDropdown]", inputs: ["odxDropdown", "odxDropdownDisabled", "odxDropdownShowLoader", "odxDropdownOptions", "odxDropdownReferenceElement", "odxDropdownTriggerElement", "odxDropdownHost", "odxDropdownOpenTrigger", "odxDropdownCloseTrigger"], outputs: ["odxDropdownBeforeOpen", "odxDropdownAfterOpen", "odxDropdownBeforeClose", "odxDropdownAfterClose"], exportAs: ["odxDropdown"] }, { kind: "ngmodule", type: HeaderModule }, { kind: "directive", type: i9.HeaderAvatarDirective, selector: "button[odxButton][odxHeaderAvatar]" }, { kind: "directive", type: LogoDirective, selector: "odx-logo", inputs: ["size", "variant"] }, { kind: "directive", type: SignInDirective, selector: "[odxButton][odxAuthSignIn]", outputs: ["odxAuthSignIn"] }, { kind: "directive", type: SignOutDirective, selector: "[odxButton][odxAuthSignOut]", outputs: ["odxAuthSignOut"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+AuthComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: AuthComponent, isStandalone: true, selector: "odx-auth", inputs: { signInButtonText: "signInButtonText", signOutButtonText: "signOutButtonText" }, ngImport: i0, template: "<odx-action-group>\n  <ng-template [ngrxLet]=\"{ idClaims: authService.identityClaims$, isAuthenticated: authService.isAuthenticated$ }\" let-vm>\n    <ng-template [ngIf]=\"vm.isAuthenticated\" [ngIfElse]=\"notAuthenticated\">\n      <button odxButton [odxDropdown]=\"userProfileMenu\" [odxDropdownOptions]=\"dropdownOptions\" data-testid=\"odx-auth-user-profile-button\">\n        <ng-template [ngTemplateOutlet]=\"userAvatar\"></ng-template>\n      </button>\n      <ng-template #userProfileMenu>\n        <odx-area-header class=\"odx-padding-x-12\" size=\"small\">\n          <ng-template [ngTemplateOutlet]=\"userAvatar\" ngProjectAs=\"odx-avatar\"></ng-template>\n          {{ vm.idClaims?.username }}\n          <odx-area-header-subtitle>\n            {{ vm.idClaims?.email }}\n          </odx-area-header-subtitle>\n        </odx-area-header>\n        <ng-content></ng-content>\n        <div class=\"odx-margin-top-12\" odxLayout=\"flex vertical-center\">\n          <odx-logo odxLayout=\"auto\" class=\"odx-margin-left-12 odx-margin-right-auto\"></odx-logo>\n          <button odxButton odxAuthSignOut variant=\"ghost\" data-testid=\"odx-auth-sign-out-button\">\n            {{ signOutButtonText }}\n            <odx-icon name=\"arrow-right\" alignRight></odx-icon>\n          </button>\n        </div>\n      </ng-template>\n    </ng-template>\n    <ng-template #notAuthenticated>\n      <button class=\"odx-auth-sign-in\" odxButton odxAuthSignIn variant=\"secondary\" data-testid=\"odx-auth-sign-in-button\">\n        <odx-icon name=\"user\" alignLeft></odx-icon>\n        {{ signInButtonText }}\n      </button>\n    </ng-template>\n    <ng-template #userAvatar>\n      <odx-avatar class=\"odx-auth-user-avatar\">\n        {{ vm.idClaims?.initials ?? '' }}\n      </odx-avatar>\n    </ng-template>\n  </ng-template>\n  <ng-template [ngIf]=\"authConfig.showRedirectOverlay\">\n    <div class=\"odx-auth-overlay\" [odxLoadingSpinner]=\"true\" *ngIf=\"authService.isLoading$ | async\"></div>\n  </ng-template>\n</odx-action-group>\n", styles: [".odx-auth-user-profile .odx-dropdown__inner>.odx-area-header{max-width:max(360px,25vw);min-width:296px}.odx-auth-overlay{position:fixed;z-index:var(--odx-v-layer-5);inset:0}\n"], dependencies: [{ kind: "ngmodule", type: CoreModule }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }, { kind: "directive", type: i2.LetDirective, selector: "[ngrxLet]", inputs: ["ngrxLet", "ngrxLetSuspenseTpl"] }, { kind: "ngmodule", type: AreaHeaderModule }, { kind: "component", type: i3.AreaHeaderComponent, selector: "odx-area-header", inputs: ["size"] }, { kind: "directive", type: i3.AreaHeaderSubtitleDirective, selector: "odx-area-header-subtitle" }, { kind: "component", type: i4.AvatarComponent, selector: "odx-avatar", inputs: ["size", "variant"] }, { kind: "component", type: i5.ActionGroupComponent, selector: "odx-action-group", inputs: ["reverse"] }, { kind: "component", type: i6.ButtonComponent, selector: "button[odxButton], a[odxButton]", inputs: ["variant", "size"] }, { kind: "component", type: i7.IconComponent, selector: "odx-icon", inputs: ["inline", "size", "name", "iconSet"] }, { kind: "ngmodule", type: DropdownModule }, { kind: "directive", type: i8.DropdownDirective, selector: "[odxDropdown]", inputs: ["odxDropdown", "odxDropdownDisabled", "odxDropdownShowLoader", "odxDropdownClickOutsideActive", "odxDropdownOptions", "odxDropdownReferenceElement", "odxDropdownTriggerElement", "odxDropdownHost", "odxDropdownOpenTrigger", "odxDropdownCloseTrigger"], outputs: ["odxDropdownBeforeOpen", "odxDropdownAfterOpen", "odxDropdownBeforeClose", "odxDropdownAfterClose"], exportAs: ["odxDropdown"] }, { kind: "ngmodule", type: HeaderModule }, { kind: "directive", type: LogoDirective, selector: "odx-logo", inputs: ["size", "variant"] }, { kind: "directive", type: SignInDirective, selector: "[odxButton][odxAuthSignIn]", outputs: ["odxAuthSignIn"] }, { kind: "directive", type: SignOutDirective, selector: "[odxButton][odxAuthSignOut]", outputs: ["odxAuthSignOut"] }, { kind: "ngmodule", type: LoadingSpinnerModule }, { kind: "directive", type: i1.LoadingSpinnerDirective, selector: "[odxLoadingSpinner]", inputs: ["odxLoadingSpinnerAutoColor", "odxLoadingSpinner", "odxLoadingSpinnerMinHeight"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: AuthComponent, decorators: [{
             type: Component,
-            args: [{ standalone: true, selector: 'odx-auth', imports: [CoreModule, AreaHeaderModule, DropdownModule, HeaderModule, LogoDirective, SignInDirective, SignOutDirective], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<odx-action-group *ngrxLet=\"{ idClaims: authService.identityClaims$, isAuthenticated: authService.isAuthenticated$ } as vm\">\n  <ng-template [ngIf]=\"vm.isAuthenticated\" [ngIfElse]=\"notAuthenticated\">\n    <button odxButton odxHeaderAvatar [odxDropdown]=\"userProfileMenu\" [odxDropdownOptions]=\"dropdownOptions\" data-testid=\"odx-auth-user-profile-button\">\n      <ng-template [ngTemplateOutlet]=\"userAvatar\"></ng-template>\n    </button>\n    <ng-template #userProfileMenu>\n      <odx-area-header class=\"odx-padding-x-12\" size=\"small\">\n        <ng-template [ngTemplateOutlet]=\"userAvatar\" ngProjectAs=\"odx-avatar\"></ng-template>\n        {{ authConfig.resolveUsername(vm.idClaims) }}\n        <odx-area-header-subtitle>\n          {{ vm.idClaims?.email }}\n        </odx-area-header-subtitle>\n      </odx-area-header>\n      <ng-content></ng-content>\n      <div class=\"odx-margin-top-12\" odxLayout=\"flex vertical-center\">\n        <odx-logo odxLayout=\"auto\" class=\"odx-margin-left-12 odx-margin-right-auto\"></odx-logo>\n        <button odxButton odxAuthSignOut variant=\"ghost\" data-testid=\"odx-auth-sign-out-button\">\n          {{ signOutButtonText }}\n          <odx-icon name=\"arrow-right\" alignRight></odx-icon>\n        </button>\n      </div>\n    </ng-template>\n  </ng-template>\n  <ng-template #notAuthenticated>\n    <button class=\"odx-auth-sign-in\" odxButton odxAuthSignIn variant=\"secondary\" data-testid=\"odx-auth-sign-in-button\">\n      <odx-icon name=\"user\" alignLeft></odx-icon>\n      {{ signInButtonText }}\n    </button>\n  </ng-template>\n  <ng-template #userAvatar>\n    <odx-avatar class=\"odx-auth-user-avatar\">\n      {{ vm.idClaims?.initials ?? '' }}\n    </odx-avatar>\n  </ng-template>\n</odx-action-group>\n", styles: [".odx-auth-user-profile .odx-dropdown__inner>.odx-area-header{max-width:max(360px,25vw);min-width:296px}\n"] }]
+            args: [{ standalone: true, selector: 'odx-auth', imports: [CoreModule, AreaHeaderModule, DropdownModule, HeaderModule, LogoDirective, SignInDirective, SignOutDirective, LoadingSpinnerModule], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<odx-action-group>\n  <ng-template [ngrxLet]=\"{ idClaims: authService.identityClaims$, isAuthenticated: authService.isAuthenticated$ }\" let-vm>\n    <ng-template [ngIf]=\"vm.isAuthenticated\" [ngIfElse]=\"notAuthenticated\">\n      <button odxButton [odxDropdown]=\"userProfileMenu\" [odxDropdownOptions]=\"dropdownOptions\" data-testid=\"odx-auth-user-profile-button\">\n        <ng-template [ngTemplateOutlet]=\"userAvatar\"></ng-template>\n      </button>\n      <ng-template #userProfileMenu>\n        <odx-area-header class=\"odx-padding-x-12\" size=\"small\">\n          <ng-template [ngTemplateOutlet]=\"userAvatar\" ngProjectAs=\"odx-avatar\"></ng-template>\n          {{ vm.idClaims?.username }}\n          <odx-area-header-subtitle>\n            {{ vm.idClaims?.email }}\n          </odx-area-header-subtitle>\n        </odx-area-header>\n        <ng-content></ng-content>\n        <div class=\"odx-margin-top-12\" odxLayout=\"flex vertical-center\">\n          <odx-logo odxLayout=\"auto\" class=\"odx-margin-left-12 odx-margin-right-auto\"></odx-logo>\n          <button odxButton odxAuthSignOut variant=\"ghost\" data-testid=\"odx-auth-sign-out-button\">\n            {{ signOutButtonText }}\n            <odx-icon name=\"arrow-right\" alignRight></odx-icon>\n          </button>\n        </div>\n      </ng-template>\n    </ng-template>\n    <ng-template #notAuthenticated>\n      <button class=\"odx-auth-sign-in\" odxButton odxAuthSignIn variant=\"secondary\" data-testid=\"odx-auth-sign-in-button\">\n        <odx-icon name=\"user\" alignLeft></odx-icon>\n        {{ signInButtonText }}\n      </button>\n    </ng-template>\n    <ng-template #userAvatar>\n      <odx-avatar class=\"odx-auth-user-avatar\">\n        {{ vm.idClaims?.initials ?? '' }}\n      </odx-avatar>\n    </ng-template>\n  </ng-template>\n  <ng-template [ngIf]=\"authConfig.showRedirectOverlay\">\n    <div class=\"odx-auth-overlay\" [odxLoadingSpinner]=\"true\" *ngIf=\"authService.isLoading$ | async\"></div>\n  </ng-template>\n</odx-action-group>\n", styles: [".odx-auth-user-profile .odx-dropdown__inner>.odx-area-header{max-width:max(360px,25vw);min-width:296px}.odx-auth-overlay{position:fixed;z-index:var(--odx-v-layer-5);inset:0}\n"] }]
         }], propDecorators: { signInButtonText: [{
                 type: Input
             }], signOutButtonText: [{
@@ -281,7 +386,7 @@ class AuthDirective {
         this.ngIfDirective.ngIfElse = value;
     }
     ngAfterViewInit() {
-        this.authService.isAuthenticated$.pipe(this.takeUntilDestroyed()).subscribe(() => {
+        this.authService.identityClaims$.pipe(this.takeUntilDestroyed()).subscribe(() => {
             const handler = isString(this.authorizationHandler) ? null : this.authorizationHandler;
             this.ngIfDirective.ngIf = this.authService.isAuthorized(handler);
         });
@@ -304,16 +409,26 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
                 args: ['odxAuthElse']
             }] } });
 
-function authGuard(authorizedHandler) {
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+function authGuard(authorizedHandler, redirectTo) {
     return (_, state) => {
         const authService = inject(AuthService);
-        const router = inject(Router);
-        const isAuthorized = () => authorizedHandler?.(authService.getIdentityClaims(), router, authService);
+        const router = inject(Router, { optional: true });
         return authService.isAuthenticated$.pipe(map((isAuthenticated) => {
             if (!isAuthenticated) {
                 authService.signIn(state.url);
+                return false;
+            }
+            return authorizedHandler?.(authService.getIdentityClaims(), authService, router) ?? isAuthenticated;
+        }), tap((isAuthorized) => {
+            if (isAuthorized || !router)
+                return;
+            if (isString(redirectTo)) {
+                router.navigateByUrl(redirectTo);
+            }
+            else if (Array.isArray(redirectTo)) {
+                router.navigate(redirectTo);
             }
-            return isAuthorized() ?? isAuthenticated;
         }), take(1));
     };
 }
@@ -332,6 +447,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
                 }]
         }] });
 
+const coreIdentityPlugin = () => {
+    const { resolveEmail, resolveUsername, createInitials } = injectAuthConfig();
+    return (authService) => {
+        const claims = authService.getRawIdentityClaims();
+        if (!claims)
+            return of({});
+        const username = resolveUsername(claims);
+        return of({ email: resolveEmail(claims), username, initials: createInitials(username) });
+    };
+};
+
 function configureInterceptor() {
     const { allowedUrls } = injectAuthConfig();
     return {
@@ -387,6 +513,10 @@ function provideAuth(config) {
             provide: OAuthStorage,
             useFactory: () => inject(AuthConfig).storage ?? inject(WindowRef).nativeWindow.localStorage,
         },
+        {
+            provide: ODX_AUTH_CORE_PLUGINS,
+            useValue: [coreIdentityPlugin],
+        },
     ]);
 }
 
@@ -394,5 +524,5 @@ function provideAuth(config) {
  * Generated bundle index. Do not edit.
  */
 
-export { AuthComponent, AuthConfig, AuthDefaultConfig, AuthDirective, AuthModule, AuthService, DEFAULT_AUTH_SCOPES, DEFAULT_ISSUERS, SignInDirective, SignOutDirective, authGuard, configureInterceptor, createInititals, initalizeAuthConfig, initializeAuthErrorHandler, injectAuthConfig, parseIdentityClaims, provideAuth, provideAuthConfig };
+export { AuthActionDirective, AuthComponent, AuthConfig, AuthDefaultConfig, AuthDirective, AuthHttpCache, AuthModule, AuthPluginManager, AuthService, DEFAULT_AUTH_SCOPES, DEFAULT_ISSUERS, ODX_AUTH_CORE_PLUGINS, ODX_AUTH_HTTP_CACHE_STORAGE, ODX_AUTH_PLUGINS, SignInDirective, SignOutDirective, authGuard, configureInterceptor, coreIdentityPlugin, createInitials, initalizeAuthConfig, initializeAuthErrorHandler, injectAuthConfig, provideAuth, provideAuthConfig, resolveEmail, resolveUsername };
 //# sourceMappingURL=odx-auth.mjs.map