@odx/auth 16.0.1 → 16.1.0
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/CHANGELOG.md +6 -0
- package/esm2022/lib/auth.component.mjs +4 -16
- package/esm2022/lib/auth.service.mjs +1 -2
- package/esm2022/lib/components/auth-actions/auth-actions.component.mjs +4 -3
- package/esm2022/lib/directives/sign-out.directive.mjs +3 -5
- package/fesm2022/odx-auth.mjs +128 -142
- package/fesm2022/odx-auth.mjs.map +1 -1
- package/lib/directives/sign-out.directive.d.ts +1 -2
- package/package.json +1 -1
package/fesm2022/odx-auth.mjs
CHANGED
|
@@ -1,17 +1,16 @@
|
|
|
1
|
-
import * as i1 from '@angular/common';
|
|
1
|
+
import * as i1$1 from '@angular/common';
|
|
2
2
|
import { CommonModule, AsyncPipe, NgIf } from '@angular/common';
|
|
3
3
|
import * as i0 from '@angular/core';
|
|
4
|
-
import { inject, EnvironmentInjector, runInInjectionContext, Component, ChangeDetectionStrategy, ViewEncapsulation, Input, DestroyRef, InjectionToken, ENVIRONMENT_INITIALIZER, makeEnvironmentProviders, APP_INITIALIZER, Injectable,
|
|
4
|
+
import { inject, EnvironmentInjector, runInInjectionContext, Directive, EventEmitter, Output, HostListener, Component, ChangeDetectionStrategy, ViewEncapsulation, Input, DestroyRef, InjectionToken, ENVIRONMENT_INITIALIZER, makeEnvironmentProviders, APP_INITIALIZER, Injectable, input, NgModule } from '@angular/core';
|
|
5
5
|
import * as i2$1 from '@odx/angular/components/area-header';
|
|
6
6
|
import { AreaHeaderModule } from '@odx/angular/components/area-header';
|
|
7
7
|
import * as i7 from '@odx/angular/components/dropdown';
|
|
8
8
|
import { DropdownModule } from '@odx/angular/components/dropdown';
|
|
9
9
|
import { HeaderModule } from '@odx/angular/components/header';
|
|
10
|
-
import * as i1
|
|
10
|
+
import * as i1 from '@odx/angular/components/loading-spinner';
|
|
11
11
|
import { LoadingSpinnerDirective, LoadingSpinnerModule } from '@odx/angular/components/loading-spinner';
|
|
12
|
-
import { LogoDirective } from '@odx/angular/components/logo';
|
|
13
12
|
import { TranslatePipe, provideTranslations } from '@odx/angular/internal/translate';
|
|
14
|
-
import { buildUrl, isString, matchUrl, injectElement, isNumber, isNonEmptyString, createConfigTokens,
|
|
13
|
+
import { buildUrl, isString, matchUrl, untilDestroyed, injectElement, isNumber, isNonEmptyString, createConfigTokens, Position } from '@odx/angular/utils';
|
|
15
14
|
import { filter, switchMap, mergeMap, map, of, tap, BehaviorSubject, distinctUntilChanged, share, combineLatest, take, timeout, catchError, fromEvent, startWith, shareReplay, merge, EMPTY } from 'rxjs';
|
|
16
15
|
import { OAuthErrorEvent, provideOAuthClient, OAuthStorage, OAuthService } from 'angular-oauth2-oidc';
|
|
17
16
|
import { HttpRequest, HttpContextToken, provideHttpClient, withInterceptors, HttpErrorResponse } from '@angular/common/http';
|
|
@@ -28,6 +27,7 @@ import { IconComponent } from '@odx/angular/components/icon';
|
|
|
28
27
|
import { trigger, transition, useAnimation } from '@angular/animations';
|
|
29
28
|
import { fadeOut } from '@odx/angular/animations';
|
|
30
29
|
import { CircularProgressComponent } from '@odx/angular/components/circular-progress';
|
|
30
|
+
import { LogoDirective } from '@odx/angular/components/logo';
|
|
31
31
|
import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
|
|
32
32
|
import * as i3$1 from '@odx/angular/components/avatar';
|
|
33
33
|
import * as i4 from '@odx/angular/components/action-group';
|
|
@@ -233,6 +233,123 @@ const authInterceptor = (req, next) => {
|
|
|
233
233
|
|
|
234
234
|
var logger = new Logger('@odx/auth');
|
|
235
235
|
|
|
236
|
+
/**
|
|
237
|
+
* An abstract directive that integrates with the `LoadingSpinnerDirective` and `AuthService` to manage loading states based on authentication redirection.
|
|
238
|
+
*
|
|
239
|
+
* This directive automatically sets the `autoColor` property of the `LoadingSpinnerDirective` to `true` and subscribes to the `isRedirecting$` observable from the `AuthService`.
|
|
240
|
+
* When `isRedirecting$` emits a value, it updates the `isLoading` property of the `LoadingSpinnerDirective`.
|
|
241
|
+
*/
|
|
242
|
+
class AuthActionDirective {
|
|
243
|
+
constructor() {
|
|
244
|
+
this.takeUntilDestroyed = untilDestroyed();
|
|
245
|
+
this.loadingSpinnerDirective = inject(LoadingSpinnerDirective, { self: true });
|
|
246
|
+
this.authService = inject(AuthService);
|
|
247
|
+
}
|
|
248
|
+
ngAfterViewInit() {
|
|
249
|
+
this.loadingSpinnerDirective.autoColor = true;
|
|
250
|
+
this.authService.isRedirecting$.pipe(this.takeUntilDestroyed()).subscribe((isRedirecting) => {
|
|
251
|
+
this.loadingSpinnerDirective.isLoading = isRedirecting;
|
|
252
|
+
});
|
|
253
|
+
}
|
|
254
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AuthActionDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
255
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: AuthActionDirective, ngImport: i0 }); }
|
|
256
|
+
}
|
|
257
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AuthActionDirective, decorators: [{
|
|
258
|
+
type: Directive
|
|
259
|
+
}] });
|
|
260
|
+
|
|
261
|
+
/**
|
|
262
|
+
* A directive that handles the sign-in action for a button element.
|
|
263
|
+
*
|
|
264
|
+
* This directive extends the `AuthActionDirective` and uses the `LoadingSpinnerDirective`
|
|
265
|
+
* to show a loading spinner during the sign-in process.
|
|
266
|
+
*
|
|
267
|
+
* @see {AuthActionDirective}
|
|
268
|
+
* @see {LoadingSpinnerDirective}
|
|
269
|
+
*
|
|
270
|
+
* @example
|
|
271
|
+
* ```html
|
|
272
|
+
* <button odxButton odxAuthSignIn (odxAuthSignIn)="onSignIn()">Sign In</button>
|
|
273
|
+
* ```
|
|
274
|
+
*/
|
|
275
|
+
class SignInDirective extends AuthActionDirective {
|
|
276
|
+
constructor() {
|
|
277
|
+
super(...arguments);
|
|
278
|
+
/**
|
|
279
|
+
* Emits an event after the sign-in action is completed.
|
|
280
|
+
*
|
|
281
|
+
* @type {EventEmitter<void>}
|
|
282
|
+
*/
|
|
283
|
+
// eslint-disable-next-line @angular-eslint/no-output-rename
|
|
284
|
+
this.afterSignIn = new EventEmitter();
|
|
285
|
+
}
|
|
286
|
+
handleClick() {
|
|
287
|
+
this.authService.signIn();
|
|
288
|
+
this.afterSignIn.next();
|
|
289
|
+
}
|
|
290
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SignInDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
|
|
291
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: SignInDirective, isStandalone: true, selector: "[odxButton][odxAuthSignIn]", outputs: { afterSignIn: "odxAuthSignIn" }, host: { listeners: { "click": "handleClick()" } }, usesInheritance: true, hostDirectives: [{ directive: i1.LoadingSpinnerDirective }], ngImport: i0 }); }
|
|
292
|
+
}
|
|
293
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SignInDirective, decorators: [{
|
|
294
|
+
type: Directive,
|
|
295
|
+
args: [{
|
|
296
|
+
standalone: true,
|
|
297
|
+
selector: '[odxButton][odxAuthSignIn]',
|
|
298
|
+
hostDirectives: [LoadingSpinnerDirective],
|
|
299
|
+
}]
|
|
300
|
+
}], propDecorators: { afterSignIn: [{
|
|
301
|
+
type: Output,
|
|
302
|
+
args: ['odxAuthSignIn']
|
|
303
|
+
}], handleClick: [{
|
|
304
|
+
type: HostListener,
|
|
305
|
+
args: ['click']
|
|
306
|
+
}] } });
|
|
307
|
+
|
|
308
|
+
/**
|
|
309
|
+
* A directive that handles the sign-out action for a button element.
|
|
310
|
+
*
|
|
311
|
+
* This directive extends the `AuthActionDirective` and uses the `LoadingSpinnerDirective`
|
|
312
|
+
* to show a loading spinner during the sign-out process.
|
|
313
|
+
*
|
|
314
|
+
* @see {AuthActionDirective}
|
|
315
|
+
* @see {LoadingSpinnerDirective}
|
|
316
|
+
*
|
|
317
|
+
* @example
|
|
318
|
+
* ```html
|
|
319
|
+
* <button odxButton odxAuthSignOut (odxAuthSignOut)="onSignOut()">Sign Out</button>
|
|
320
|
+
* ```
|
|
321
|
+
*/
|
|
322
|
+
class SignOutDirective extends AuthActionDirective {
|
|
323
|
+
constructor() {
|
|
324
|
+
super(...arguments);
|
|
325
|
+
/**
|
|
326
|
+
* Emits an event after the sign-out action is completed.
|
|
327
|
+
*
|
|
328
|
+
*/
|
|
329
|
+
this.afterSignOut = new EventEmitter();
|
|
330
|
+
}
|
|
331
|
+
handleClick() {
|
|
332
|
+
this.authService.signOut();
|
|
333
|
+
this.afterSignOut.next();
|
|
334
|
+
}
|
|
335
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SignOutDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
|
|
336
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: SignOutDirective, isStandalone: true, selector: "[odxAuthSignOut]", outputs: { afterSignOut: "odxAuthSignOut" }, host: { listeners: { "click": "handleClick()" } }, usesInheritance: true, hostDirectives: [{ directive: i1.LoadingSpinnerDirective }], ngImport: i0 }); }
|
|
337
|
+
}
|
|
338
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SignOutDirective, decorators: [{
|
|
339
|
+
type: Directive,
|
|
340
|
+
args: [{
|
|
341
|
+
standalone: true,
|
|
342
|
+
selector: '[odxAuthSignOut]',
|
|
343
|
+
hostDirectives: [LoadingSpinnerDirective],
|
|
344
|
+
}]
|
|
345
|
+
}], propDecorators: { afterSignOut: [{
|
|
346
|
+
type: Output,
|
|
347
|
+
args: ['odxAuthSignOut']
|
|
348
|
+
}], handleClick: [{
|
|
349
|
+
type: HostListener,
|
|
350
|
+
args: ['click']
|
|
351
|
+
}] } });
|
|
352
|
+
|
|
236
353
|
/**
|
|
237
354
|
* Displays authentication actions.
|
|
238
355
|
*/
|
|
@@ -248,14 +365,14 @@ let AuthActionsComponent = class AuthActionsComponent {
|
|
|
248
365
|
this.claims = null;
|
|
249
366
|
}
|
|
250
367
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AuthActionsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
251
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: AuthActionsComponent, isStandalone: true, selector: "odx-auth-actions", inputs: { claims: "claims" }, ngImport: i0, template: "<odx-list>\n @if (claims?.userProfileUrl; as url) {\n <a data-testid=\"odx-auth-user-profile-link\"
|
|
368
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: AuthActionsComponent, isStandalone: true, selector: "odx-auth-actions", inputs: { claims: "claims" }, ngImport: i0, template: "<odx-list>\n @if (claims?.userProfileUrl; as url) {\n <a odxListItem data-testid=\"odx-auth-user-profile-link\" [href]=\"url\" rel=\"noopener\" target=\"_blank\">\n <odx-icon name=\"user-administration\" iconSet=\"core\" odxListItemPrefix />\n {{ 'userProfileLink' | odxTranslate | async }}\n </a>\n }\n <button odxListItem odxAuthSignOut data-testid=\"odx-auth-sign-out-button\" style=\"width: 100%\">\n <odx-icon name=\"logout\" iconSet=\"core\" odxListItemPrefix />\n {{ 'signOutButtonText' | odxTranslate | async }}\n </button>\n</odx-list>\n", dependencies: [{ kind: "ngmodule", type: CoreModule }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }, { kind: "ngmodule", type: ListModule }, { kind: "component", type: i2.ListComponent, selector: "odx-list" }, { kind: "component", type: i2.ListItemComponent, selector: "odx-list-item, [odxListItem]", inputs: ["danger", "variant", "muted", "selected"] }, { kind: "component", type: i3.IconComponent, selector: "odx-icon", inputs: ["inline", "size", "name", "iconSet", "identifier"] }, { kind: "pipe", type: TranslatePipe, name: "odxTranslate" }, { kind: "directive", type: SignOutDirective, selector: "[odxAuthSignOut]", outputs: ["odxAuthSignOut"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
252
369
|
};
|
|
253
370
|
AuthActionsComponent = __decorate([
|
|
254
371
|
CSSComponent('auth-actions')
|
|
255
372
|
], AuthActionsComponent);
|
|
256
373
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AuthActionsComponent, decorators: [{
|
|
257
374
|
type: Component,
|
|
258
|
-
args: [{ standalone: true, selector: 'odx-auth-actions', imports: [CoreModule, ListModule, TranslatePipe], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<odx-list>\n @if (claims?.userProfileUrl; as url) {\n <a data-testid=\"odx-auth-user-profile-link\"
|
|
375
|
+
args: [{ standalone: true, selector: 'odx-auth-actions', imports: [CoreModule, ListModule, TranslatePipe, SignOutDirective], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<odx-list>\n @if (claims?.userProfileUrl; as url) {\n <a odxListItem data-testid=\"odx-auth-user-profile-link\" [href]=\"url\" rel=\"noopener\" target=\"_blank\">\n <odx-icon name=\"user-administration\" iconSet=\"core\" odxListItemPrefix />\n {{ 'userProfileLink' | odxTranslate | async }}\n </a>\n }\n <button odxListItem odxAuthSignOut data-testid=\"odx-auth-sign-out-button\" style=\"width: 100%\">\n <odx-icon name=\"logout\" iconSet=\"core\" odxListItemPrefix />\n {{ 'signOutButtonText' | odxTranslate | async }}\n </button>\n</odx-list>\n" }]
|
|
259
376
|
}], propDecorators: { claims: [{
|
|
260
377
|
type: Input
|
|
261
378
|
}] } });
|
|
@@ -291,7 +408,7 @@ class AuthLoadingScreenComponent {
|
|
|
291
408
|
});
|
|
292
409
|
}
|
|
293
410
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AuthLoadingScreenComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
294
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: AuthLoadingScreenComponent, isStandalone: true, selector: "div.odx-auth-loading-screen", host: { properties: { "@hostAnimation": "true" } }, ngImport: i0, template: "<div class=\"odx-auth-loading-screen__content\" odxLayout=\"grid 12 horizontal-center vertical-center gap-small\">\n <odx-logo size=\"large\" />\n <odx-circular-progress class=\"odx-auth-loading-screen__spinner\" value=\"-1\" size=\"medium\" stroke=\"3\">\n <odx-icon [name]=\"icon$ | async\" iconSet=\"core\" />\n </odx-circular-progress>\n @if (authConfig.loadingScreenMessage; as content) {\n <p class=\"odx-auth-loading-screen__message\">\n <ng-template [odxDynamicView]=\"content\" />\n </p>\n }\n</div>\n", styles: ["@keyframes odx-auth-loading-screen-animation{0%{opacity:0;transform:translate(-50%,-50%) scale(.9)}to{opacity:1;transform:translate(-50%,-50%)}}.odx-auth-loading-screen{--odx-c-highlight: var(--odx-c-primary);background-color:var(--odx-c-background-content);inset:0;position:fixed;z-index:var(--odx-v-layer-6)}.odx-auth-loading-screen__content{animation:odx-auth-loading-screen-animation .75s ease;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%)}.odx-auth-loading-screen__message{text-align:center}.odx-auth-loading-screen__spinner{position:relative}.odx-auth-loading-screen__spinner .odx-icon{left:50%;position:absolute;top:50%;transform:translate(-50%,-50%)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "component", type: IconComponent, selector: "odx-icon", inputs: ["inline", "size", "name", "iconSet", "identifier"] }, { kind: "directive", type: LogoDirective, selector: "odx-logo", inputs: ["size", "variant"] }, { kind: "component", type: CircularProgressComponent, selector: "odx-circular-progress", inputs: ["stroke", "size", "value"] }, { kind: "directive", type: DynamicViewDirective, selector: "ng-template[odxDynamicView]", inputs: ["odxDynamicView", "odxDynamicViewInjector", "odxDynamicViewContext"] }], animations: [trigger('hostAnimation', [transition(':leave', useAnimation(fadeOut()))])], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
411
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: AuthLoadingScreenComponent, isStandalone: true, selector: "div.odx-auth-loading-screen", host: { properties: { "@hostAnimation": "true" } }, ngImport: i0, template: "<div class=\"odx-auth-loading-screen__content\" odxLayout=\"grid 12 horizontal-center vertical-center gap-small\">\n <odx-logo size=\"large\" />\n <odx-circular-progress class=\"odx-auth-loading-screen__spinner\" value=\"-1\" size=\"medium\" stroke=\"3\">\n <odx-icon [name]=\"icon$ | async\" iconSet=\"core\" />\n </odx-circular-progress>\n @if (authConfig.loadingScreenMessage; as content) {\n <p class=\"odx-auth-loading-screen__message\">\n <ng-template [odxDynamicView]=\"content\" />\n </p>\n }\n</div>\n", styles: ["@keyframes odx-auth-loading-screen-animation{0%{opacity:0;transform:translate(-50%,-50%) scale(.9)}to{opacity:1;transform:translate(-50%,-50%)}}.odx-auth-loading-screen{--odx-c-highlight: var(--odx-c-primary);background-color:var(--odx-c-background-content);inset:0;position:fixed;z-index:var(--odx-v-layer-6)}.odx-auth-loading-screen__content{animation:odx-auth-loading-screen-animation .75s ease;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%)}.odx-auth-loading-screen__message{text-align:center}.odx-auth-loading-screen__spinner{position:relative}.odx-auth-loading-screen__spinner .odx-icon{left:50%;position:absolute;top:50%;transform:translate(-50%,-50%)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }, { kind: "component", type: IconComponent, selector: "odx-icon", inputs: ["inline", "size", "name", "iconSet", "identifier"] }, { kind: "directive", type: LogoDirective, selector: "odx-logo", inputs: ["size", "variant"] }, { kind: "component", type: CircularProgressComponent, selector: "odx-circular-progress", inputs: ["stroke", "size", "value"] }, { kind: "directive", type: DynamicViewDirective, selector: "ng-template[odxDynamicView]", inputs: ["odxDynamicView", "odxDynamicViewInjector", "odxDynamicViewContext"] }], animations: [trigger('hostAnimation', [transition(':leave', useAnimation(fadeOut()))])], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
295
412
|
}
|
|
296
413
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AuthLoadingScreenComponent, decorators: [{
|
|
297
414
|
type: Component,
|
|
@@ -668,7 +785,6 @@ class AuthService {
|
|
|
668
785
|
* @returns {URL} The issuer URL.
|
|
669
786
|
*/
|
|
670
787
|
getIssuer() {
|
|
671
|
-
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
|
|
672
788
|
return new URL(this.oauthService.issuer);
|
|
673
789
|
}
|
|
674
790
|
/**
|
|
@@ -931,125 +1047,6 @@ var translations = {
|
|
|
931
1047
|
},
|
|
932
1048
|
};
|
|
933
1049
|
|
|
934
|
-
/**
|
|
935
|
-
* An abstract directive that integrates with the `LoadingSpinnerDirective` and `AuthService` to manage loading states based on authentication redirection.
|
|
936
|
-
*
|
|
937
|
-
* This directive automatically sets the `autoColor` property of the `LoadingSpinnerDirective` to `true` and subscribes to the `isRedirecting$` observable from the `AuthService`.
|
|
938
|
-
* When `isRedirecting$` emits a value, it updates the `isLoading` property of the `LoadingSpinnerDirective`.
|
|
939
|
-
*/
|
|
940
|
-
class AuthActionDirective {
|
|
941
|
-
constructor() {
|
|
942
|
-
this.takeUntilDestroyed = untilDestroyed();
|
|
943
|
-
this.loadingSpinnerDirective = inject(LoadingSpinnerDirective, { self: true });
|
|
944
|
-
this.authService = inject(AuthService);
|
|
945
|
-
}
|
|
946
|
-
ngAfterViewInit() {
|
|
947
|
-
this.loadingSpinnerDirective.autoColor = true;
|
|
948
|
-
this.authService.isRedirecting$.pipe(this.takeUntilDestroyed()).subscribe((isRedirecting) => {
|
|
949
|
-
this.loadingSpinnerDirective.isLoading = isRedirecting;
|
|
950
|
-
});
|
|
951
|
-
}
|
|
952
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AuthActionDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
953
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: AuthActionDirective, ngImport: i0 }); }
|
|
954
|
-
}
|
|
955
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AuthActionDirective, decorators: [{
|
|
956
|
-
type: Directive
|
|
957
|
-
}] });
|
|
958
|
-
|
|
959
|
-
/**
|
|
960
|
-
* A directive that handles the sign-in action for a button element.
|
|
961
|
-
*
|
|
962
|
-
* This directive extends the `AuthActionDirective` and uses the `LoadingSpinnerDirective`
|
|
963
|
-
* to show a loading spinner during the sign-in process.
|
|
964
|
-
*
|
|
965
|
-
* @see {AuthActionDirective}
|
|
966
|
-
* @see {LoadingSpinnerDirective}
|
|
967
|
-
*
|
|
968
|
-
* @example
|
|
969
|
-
* ```html
|
|
970
|
-
* <button odxButton odxAuthSignIn (odxAuthSignIn)="onSignIn()">Sign In</button>
|
|
971
|
-
* ```
|
|
972
|
-
*/
|
|
973
|
-
class SignInDirective extends AuthActionDirective {
|
|
974
|
-
constructor() {
|
|
975
|
-
super(...arguments);
|
|
976
|
-
/**
|
|
977
|
-
* Emits an event after the sign-in action is completed.
|
|
978
|
-
*
|
|
979
|
-
* @type {EventEmitter<void>}
|
|
980
|
-
*/
|
|
981
|
-
// eslint-disable-next-line @angular-eslint/no-output-rename
|
|
982
|
-
this.afterSignIn = new EventEmitter();
|
|
983
|
-
}
|
|
984
|
-
handleClick() {
|
|
985
|
-
this.authService.signIn();
|
|
986
|
-
this.afterSignIn.next();
|
|
987
|
-
}
|
|
988
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SignInDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
|
|
989
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: SignInDirective, isStandalone: true, selector: "[odxButton][odxAuthSignIn]", outputs: { afterSignIn: "odxAuthSignIn" }, host: { listeners: { "click": "handleClick()" } }, usesInheritance: true, hostDirectives: [{ directive: i1$1.LoadingSpinnerDirective }], ngImport: i0 }); }
|
|
990
|
-
}
|
|
991
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SignInDirective, decorators: [{
|
|
992
|
-
type: Directive,
|
|
993
|
-
args: [{
|
|
994
|
-
standalone: true,
|
|
995
|
-
selector: '[odxButton][odxAuthSignIn]',
|
|
996
|
-
hostDirectives: [LoadingSpinnerDirective],
|
|
997
|
-
}]
|
|
998
|
-
}], propDecorators: { afterSignIn: [{
|
|
999
|
-
type: Output,
|
|
1000
|
-
args: ['odxAuthSignIn']
|
|
1001
|
-
}], handleClick: [{
|
|
1002
|
-
type: HostListener,
|
|
1003
|
-
args: ['click']
|
|
1004
|
-
}] } });
|
|
1005
|
-
|
|
1006
|
-
/**
|
|
1007
|
-
* A directive that handles the sign-out action for a button element.
|
|
1008
|
-
*
|
|
1009
|
-
* This directive extends the `AuthActionDirective` and uses the `LoadingSpinnerDirective`
|
|
1010
|
-
* to show a loading spinner during the sign-out process.
|
|
1011
|
-
*
|
|
1012
|
-
* @see {AuthActionDirective}
|
|
1013
|
-
* @see {LoadingSpinnerDirective}
|
|
1014
|
-
*
|
|
1015
|
-
* @example
|
|
1016
|
-
* ```html
|
|
1017
|
-
* <button odxButton odxAuthSignOut (odxAuthSignOut)="onSignOut()">Sign Out</button>
|
|
1018
|
-
* ```
|
|
1019
|
-
*/
|
|
1020
|
-
class SignOutDirective extends AuthActionDirective {
|
|
1021
|
-
constructor() {
|
|
1022
|
-
super(...arguments);
|
|
1023
|
-
/**
|
|
1024
|
-
* Emits an event after the sign-out action is completed.
|
|
1025
|
-
*
|
|
1026
|
-
* @type {EventEmitter<void>}
|
|
1027
|
-
*/
|
|
1028
|
-
// eslint-disable-next-line @angular-eslint/no-output-rename
|
|
1029
|
-
this.afterSignOut = new EventEmitter();
|
|
1030
|
-
}
|
|
1031
|
-
handleClick() {
|
|
1032
|
-
this.authService.signOut();
|
|
1033
|
-
this.afterSignOut.next();
|
|
1034
|
-
}
|
|
1035
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SignOutDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
|
|
1036
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: SignOutDirective, isStandalone: true, selector: "[odxButton][odxAuthSignOut]", outputs: { afterSignOut: "odxAuthSignOut" }, host: { listeners: { "click": "handleClick()" } }, usesInheritance: true, hostDirectives: [{ directive: i1$1.LoadingSpinnerDirective }], ngImport: i0 }); }
|
|
1037
|
-
}
|
|
1038
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SignOutDirective, decorators: [{
|
|
1039
|
-
type: Directive,
|
|
1040
|
-
args: [{
|
|
1041
|
-
standalone: true,
|
|
1042
|
-
selector: '[odxButton][odxAuthSignOut]',
|
|
1043
|
-
hostDirectives: [LoadingSpinnerDirective],
|
|
1044
|
-
}]
|
|
1045
|
-
}], propDecorators: { afterSignOut: [{
|
|
1046
|
-
type: Output,
|
|
1047
|
-
args: ['odxAuthSignOut']
|
|
1048
|
-
}], handleClick: [{
|
|
1049
|
-
type: HostListener,
|
|
1050
|
-
args: ['click']
|
|
1051
|
-
}] } });
|
|
1052
|
-
|
|
1053
1050
|
class AuthComponent {
|
|
1054
1051
|
constructor() {
|
|
1055
1052
|
this.authConfig = injectAuthConfig();
|
|
@@ -1071,22 +1068,11 @@ class AuthComponent {
|
|
|
1071
1068
|
this.hideInstitution = input(false);
|
|
1072
1069
|
}
|
|
1073
1070
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AuthComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1074
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: AuthComponent, isStandalone: true, selector: "odx-auth", inputs: { hideInstitution: { classPropertyName: "hideInstitution", publicName: "hideInstitution", isSignal: true, isRequired: false, transformFunction: null } }, providers: [provideTranslations(translations)], ngImport: i0, template: "<odx-action-group>\n @if (vm$ | async; as vm) {\n <ng-container ngProjectAs=\"[odxButton]\">\n @if (vm.isAuthenticated) {\n <button odxButton [odxDropdown]=\"userProfileMenu\" [odxDropdownOptions]=\"dropdownOptions\" data-testid=\"odx-auth-user-profile-button\">\n <ng-template [ngTemplateOutlet]=\"userAvatar\" />\n </button>\n } @else {\n <button class=\"odx-auth-sign-in\" odxButton odxAuthSignIn variant=\"secondary\" data-testid=\"odx-auth-sign-in-button\">\n <odx-icon name=\"user\" alignLeft />\n {{ 'signInButtonText' | odxTranslate | async }}\n </button>\n }\n <ng-template #userProfileMenu>\n @if (!hideInstitution() && vm.idClaims?.institutionName; as institutionName) {\n <
|
|
1071
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: AuthComponent, isStandalone: true, selector: "odx-auth", inputs: { hideInstitution: { classPropertyName: "hideInstitution", publicName: "hideInstitution", isSignal: true, isRequired: false, transformFunction: null } }, providers: [provideTranslations(translations)], ngImport: i0, template: "<odx-action-group>\n @if (vm$ | async; as vm) {\n <ng-container ngProjectAs=\"[odxButton]\">\n @if (vm.isAuthenticated) {\n <button odxButton [odxDropdown]=\"userProfileMenu\" [odxDropdownOptions]=\"dropdownOptions\" data-testid=\"odx-auth-user-profile-button\">\n <ng-template [ngTemplateOutlet]=\"userAvatar\" />\n </button>\n } @else {\n <button class=\"odx-auth-sign-in\" odxButton odxAuthSignIn variant=\"secondary\" data-testid=\"odx-auth-sign-in-button\">\n <odx-icon name=\"user\" alignLeft />\n {{ 'signInButtonText' | odxTranslate | async }}\n </button>\n }\n <ng-template #userProfileMenu>\n @if ((!hideInstitution() && vm.idClaims?.institutionName) || 'Dr\u00E4gerwerk AG & Co. KGaA'; as institutionName) {\n <p class=\"odx-padding-x-8\" data-testid=\"odx-auth-institution-name\">{{ institutionName }}</p>\n }\n <odx-area-header class=\"odx-padding-x-8 odx-margin-y-12\" size=\"small\">\n <ng-template [ngTemplateOutlet]=\"userAvatar\" ngProjectAs=\"odx-avatar\" />\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 />\n <odx-auth-actions [claims]=\"vm.idClaims\" />\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-container>\n }\n</odx-action-group>\n", styles: [".odx-auth-user-profile .odx-dropdown__inner{border-block-width:calc(var(--odx-vertical-rythm-base-size) * .75);max-width:max(400px,25vw);min-width:320px}\n"], dependencies: [{ kind: "ngmodule", type: AreaHeaderModule }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }, { kind: "component", type: i2$1.AreaHeaderComponent, selector: "odx-area-header", inputs: ["size"] }, { kind: "directive", type: i2$1.AreaHeaderSubtitleDirective, selector: "odx-area-header-subtitle" }, { kind: "component", type: i3$1.AvatarComponent, selector: "odx-avatar", inputs: ["size", "variant"] }, { kind: "component", type: i4.ActionGroupComponent, selector: "odx-action-group", inputs: ["reverse"] }, { kind: "component", type: i5.ButtonComponent, selector: "button[odxButton], a[odxButton]", inputs: ["variant", "size"] }, { kind: "component", type: i3.IconComponent, selector: "odx-icon", inputs: ["inline", "size", "name", "iconSet", "identifier"] }, { kind: "ngmodule", type: DropdownModule }, { kind: "directive", type: i7.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: SignInDirective, selector: "[odxButton][odxAuthSignIn]", outputs: ["odxAuthSignIn"] }, { kind: "ngmodule", type: LoadingSpinnerModule }, { kind: "component", type: AuthActionsComponent, selector: "odx-auth-actions", inputs: ["claims"] }, { kind: "pipe", type: TranslatePipe, name: "odxTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
1075
1072
|
}
|
|
1076
1073
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AuthComponent, decorators: [{
|
|
1077
1074
|
type: Component,
|
|
1078
|
-
args: [{ standalone: true, selector: 'odx-auth', imports: [
|
|
1079
|
-
AreaHeaderModule,
|
|
1080
|
-
DropdownModule,
|
|
1081
|
-
HeaderModule,
|
|
1082
|
-
LogoDirective,
|
|
1083
|
-
SignInDirective,
|
|
1084
|
-
SignOutDirective,
|
|
1085
|
-
LoadingSpinnerModule,
|
|
1086
|
-
AuthActionsComponent,
|
|
1087
|
-
TranslatePipe,
|
|
1088
|
-
AsyncPipe,
|
|
1089
|
-
], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, providers: [provideTranslations(translations)], template: "<odx-action-group>\n @if (vm$ | async; as vm) {\n <ng-container ngProjectAs=\"[odxButton]\">\n @if (vm.isAuthenticated) {\n <button odxButton [odxDropdown]=\"userProfileMenu\" [odxDropdownOptions]=\"dropdownOptions\" data-testid=\"odx-auth-user-profile-button\">\n <ng-template [ngTemplateOutlet]=\"userAvatar\" />\n </button>\n } @else {\n <button class=\"odx-auth-sign-in\" odxButton odxAuthSignIn variant=\"secondary\" data-testid=\"odx-auth-sign-in-button\">\n <odx-icon name=\"user\" alignLeft />\n {{ 'signInButtonText' | odxTranslate | async }}\n </button>\n }\n <ng-template #userProfileMenu>\n @if (!hideInstitution() && vm.idClaims?.institutionName; as institutionName) {\n <odx-area-header class=\"odx-padding-x-12 odx-padding-bottom-8\" size=\"small\">\n <odx-area-header-subtitle class=\"odx-auth-institution-name\">{{ institutionName }}</odx-area-header-subtitle>\n </odx-area-header>\n }\n <odx-area-header class=\"odx-padding-x-12\" size=\"small\">\n <ng-template [ngTemplateOutlet]=\"userAvatar\" ngProjectAs=\"odx-avatar\" />\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 />\n <odx-auth-actions [claims]=\"vm.idClaims\"></odx-auth-actions>\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' | odxTranslate | async }}\n <odx-icon name=\"logout\" alignRight />\n </button>\n </div>\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-container>\n }\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-actions{display:block;margin-top:calc(var(--odx-vertical-rythm-base-size) * .5);margin-bottom:calc(var(--odx-vertical-rythm-base-size) * .5);margin-right:calc(var(--odx-vertical-rythm-base-size) * .25);margin-left:calc(var(--odx-vertical-rythm-base-size) * .25)}\n"] }]
|
|
1075
|
+
args: [{ standalone: true, selector: 'odx-auth', imports: [AreaHeaderModule, DropdownModule, HeaderModule, SignInDirective, LoadingSpinnerModule, AuthActionsComponent, TranslatePipe, AsyncPipe], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, providers: [provideTranslations(translations)], template: "<odx-action-group>\n @if (vm$ | async; as vm) {\n <ng-container ngProjectAs=\"[odxButton]\">\n @if (vm.isAuthenticated) {\n <button odxButton [odxDropdown]=\"userProfileMenu\" [odxDropdownOptions]=\"dropdownOptions\" data-testid=\"odx-auth-user-profile-button\">\n <ng-template [ngTemplateOutlet]=\"userAvatar\" />\n </button>\n } @else {\n <button class=\"odx-auth-sign-in\" odxButton odxAuthSignIn variant=\"secondary\" data-testid=\"odx-auth-sign-in-button\">\n <odx-icon name=\"user\" alignLeft />\n {{ 'signInButtonText' | odxTranslate | async }}\n </button>\n }\n <ng-template #userProfileMenu>\n @if ((!hideInstitution() && vm.idClaims?.institutionName) || 'Dr\u00E4gerwerk AG & Co. KGaA'; as institutionName) {\n <p class=\"odx-padding-x-8\" data-testid=\"odx-auth-institution-name\">{{ institutionName }}</p>\n }\n <odx-area-header class=\"odx-padding-x-8 odx-margin-y-12\" size=\"small\">\n <ng-template [ngTemplateOutlet]=\"userAvatar\" ngProjectAs=\"odx-avatar\" />\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 />\n <odx-auth-actions [claims]=\"vm.idClaims\" />\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-container>\n }\n</odx-action-group>\n", styles: [".odx-auth-user-profile .odx-dropdown__inner{border-block-width:calc(var(--odx-vertical-rythm-base-size) * .75);max-width:max(400px,25vw);min-width:320px}\n"] }]
|
|
1090
1076
|
}] });
|
|
1091
1077
|
|
|
1092
1078
|
class AuthDirective {
|
|
@@ -1117,7 +1103,7 @@ class AuthDirective {
|
|
|
1117
1103
|
});
|
|
1118
1104
|
}
|
|
1119
1105
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AuthDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
1120
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: AuthDirective, isStandalone: true, selector: "ng-template[odxAuth]", inputs: { authorizationHandler: ["odxAuth", "authorizationHandler"], elseTemplate: ["odxAuthElse", "elseTemplate"] }, hostDirectives: [{ directive: i1.NgIf }], ngImport: i0 }); }
|
|
1106
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: AuthDirective, isStandalone: true, selector: "ng-template[odxAuth]", inputs: { authorizationHandler: ["odxAuth", "authorizationHandler"], elseTemplate: ["odxAuthElse", "elseTemplate"] }, hostDirectives: [{ directive: i1$1.NgIf }], ngImport: i0 }); }
|
|
1121
1107
|
}
|
|
1122
1108
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AuthDirective, decorators: [{
|
|
1123
1109
|
type: Directive,
|