@myrmidon/auth-jwt-admin 1.0.5 → 2.0.0

package/fesm2020/myrmidon-auth-jwt-admin.mjs

@@ -1,991 +0,0 @@
-import * as i0 from '@angular/core';
-import { Injectable, EventEmitter, Component, Input, Output, Optional, Inject, NgModule } from '@angular/core';
-import * as i1$1 from '@angular/forms';
-import { Validators, FormsModule, ReactiveFormsModule } from '@angular/forms';
-import { retry, catchError, take } from 'rxjs/operators';
-import * as i2$1 from '@angular/material/snack-bar';
-import { MatSnackBarModule } from '@angular/material/snack-bar';
-import * as i1 from '@angular/common/http';
-import { HttpParams, HttpClientModule } from '@angular/common/http';
-import * as i2 from '@myrmidon/ng-tools';
-import { NgToolsModule } from '@myrmidon/ng-tools';
-import * as i4 from '@angular/common';
-import { CommonModule } from '@angular/common';
-import * as i5 from '@angular/material/button';
-import { MatButtonModule } from '@angular/material/button';
-import * as i6 from '@angular/material/icon';
-import { MatIconModule } from '@angular/material/icon';
-import * as i7 from '@angular/material/input';
-import { MatInputModule } from '@angular/material/input';
-import * as i8 from '@angular/material/form-field';
-import * as i9 from '@angular/material/progress-spinner';
-import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
-import { BehaviorSubject, combineLatest, map, debounceTime, take as take$1 } from 'rxjs';
-import { select, createStore, withProps } from '@ngneat/elf';
-import { selectActiveEntity, withEntities, withActiveId, upsertEntities, deleteAllEntities, setActiveId } from '@ngneat/elf-entities';
-import { selectPaginationData, selectCurrentPageEntities, deleteAllPages, withPagination, updatePaginationData, setPage, hasPage, setCurrentPage } from '@ngneat/elf-pagination';
-import { selectRequestStatus, withRequestsCache, withRequestsStatus, updateRequestStatus } from '@ngneat/elf-requests';
-import * as i7$1 from '@angular/material/tooltip';
-import { MatTooltipModule } from '@angular/material/tooltip';
-import * as i1$2 from '@angular/material/dialog';
-import { MAT_DIALOG_DATA, MatDialogModule } from '@angular/material/dialog';
-import * as i2$2 from '@myrmidon/auth-jwt-login';
-import { AuthJwtLoginModule } from '@myrmidon/auth-jwt-login';
-import * as i6$1 from '@angular/material/expansion';
-import { MatExpansionModule } from '@angular/material/expansion';
-import * as i8$1 from '@angular/material/paginator';
-import { MatPaginatorModule } from '@angular/material/paginator';
-import * as i9$1 from '@angular/material/progress-bar';
-import { MatProgressBarModule } from '@angular/material/progress-bar';
-import * as i5$1 from '@angular/material/checkbox';
-import { MatCheckboxModule } from '@angular/material/checkbox';
-import { RouterModule } from '@angular/router';
-import { MatCardModule } from '@angular/material/card';
-
-class PasswordValidators {
-    /** "Standard" password validator for my API services. */
-    static standard() {
-        return (control) => {
-            if (!control.value) {
-                return null;
-            }
-            if (control.value.length < 8) {
-                return {
-                    passwordtooshort: true,
-                };
-            }
-            if (!/.*[A-Z].*/.test(control.value)) {
-                return {
-                    noupperinpassword: true,
-                };
-            }
-            if (!/.*[a-z].*/.test(control.value)) {
-                return {
-                    nolowerinpassword: true,
-                };
-            }
-            if (!/.*[A-Z].*/.test(control.value)) {
-                return {
-                    noupperinpassword: true,
-                };
-            }
-            if (!/.*[-`~!@#$%^&*()_+=\[\]{};:'",.<>/?|\\].*/.test(control.value)) {
-                return {
-                    nosymbolinpassword: true,
-                };
-            }
-            return null;
-        };
-    }
-    static areEqual(controlName, otherControlName) {
-        return (control) => {
-            const g = control;
-            const a = g.controls[controlName];
-            const b = g.controls[otherControlName];
-            return a.value !== b.value
-                ? {
-                    areequal: true,
-                }
-                : null;
-        };
-    }
-}
-
-class AuthJwtAccountService {
-    constructor(_http, _error, _env) {
-        this._http = _http;
-        this._error = _error;
-        this._env = _env;
-    }
-    /**
-     * Checks if the specified email address is registered on the server.
-     * @param email email address to test.
-     * @returns result.
-     */
-    isEmailRegistered(email) {
-        return this._http.get(this._env.get('apiUrl') +
-            'accounts/emailexists/' +
-            encodeURIComponent(email));
-    }
-    /**
-     * Checks if the specified user's given name is registered on the server.
-     * This name is a nickname chosen by users during registration, and is the key
-     * used for referencing users when talking to the server.
-     * @param name name to test.
-     * @returns result.
-     */
-    isNameRegistered(name) {
-        return this._http.get(this._env.get('apiUrl') +
-            'accounts/nameexists/' +
-            encodeURIComponent(name));
-    }
-    /**
-     * Register the user with the specified registration data.
-     * @param registration The registration data.
-     * @param confirmed True to automatically confirm the user's email address
-     * without sending the confirmation email message.
-     */
-    register(registration, confirmed = false) {
-        return this._http.post(this._env.get('apiUrl') +
-            'accounts/register' +
-            (confirmed ? '?confirmed=true' : ''), registration);
-    }
-    /**
-     * Resend the confirmation email to the specified address.
-     * @param email address.
-     */
-    resendConfirmEmail(email) {
-        return this._http.get(this._env.get('apiUrl') +
-            'accounts/resendconfirm/' +
-            encodeURIComponent(email)
-        // options
-        );
-    }
-    /**
-     * Request a password reset for the specified email address.
-     * @param email Email address.
-     */
-    requestPasswordReset(email) {
-        return this._http.post(this._env.get('apiUrl') + 'accounts/resetpassword/request', { email });
-    }
-    getAllUsers() {
-        return this._http
-            .get(this._env.get('apiUrl') + 'users', {
-            params: new HttpParams().set('pageNumber', '1'),
-        })
-            .pipe(retry(3), catchError(this._error.handleError));
-    }
-    getUsers(filter, pageNumber = 1, pageSize = 20) {
-        let httpParams = new HttpParams();
-        httpParams = httpParams.set('pageNumber', pageNumber.toString());
-        httpParams = httpParams.set('pageSize', pageSize.toString());
-        if (filter.name) {
-            httpParams = httpParams.set('name', filter.name);
-        }
-        return this._http
-            .get(this._env.get('apiUrl') + 'users', {
-            params: httpParams,
-        })
-            .pipe(retry(3), catchError(this._error.handleError));
-    }
-    /**
-     * Get the top N users matching the specified name filter.
-     * @param nameFilter The user name filter.
-     * @param limit The maximum number of users to get.
-     */
-    getTopUsers(nameFilter, limit = 10) {
-        let httpParams = new HttpParams();
-        httpParams = httpParams.set('pageNumber', '1');
-        httpParams = httpParams.set('pageSize', limit.toString());
-        if (nameFilter) {
-            httpParams = httpParams.set('name', nameFilter);
-        }
-        const options = httpParams.keys().length > 0
-            ? {
-                params: httpParams,
-            }
-            : {};
-        return this._http
-            .get(this._env.get('apiUrl') + 'users', options)
-            .pipe(retry(3), catchError(this._error.handleError));
-    }
-    /**
-     * Get information about all the users listed in the specified names.
-     * @param names User(s) names.
-     */
-    getUsersFromNames(names) {
-        let httpParams = new HttpParams();
-        if (names && names.length > 0) {
-            httpParams = httpParams.set('names', names.join(','));
-        }
-        const options = httpParams.keys().length > 0
-            ? {
-                params: httpParams,
-            }
-            : {};
-        return this._http
-            .get(this._env.get('apiUrl') + 'users-from-names', options)
-            .pipe(retry(3), catchError(this._error.handleError));
-    }
-    /**
-     * Get data about the specified user.
-     * @param name The user name.
-     */
-    getUser(name) {
-        return this._http
-            .get(this._env.get('apiUrl') + 'users/' + name)
-            .pipe(retry(3), catchError(this._error.handleError));
-    }
-    /**
-     * Update the editable data for the specified user.
-     * @param user The user to update.
-     */
-    updateUser(user) {
-        return this._http
-            .put(this._env.get('apiUrl') +
-            'users' +
-            (user.emailConfirmed ? '?confirmed=true' : ''), user)
-            .pipe(catchError(this._error.handleError));
-    }
-    /**
-     * Request a password reset email for the specified email address.
-     * @param email The email address to receive the reset message.
-     */
-    resetPassword(email) {
-        return this._http
-            .post(this._env.get('apiUrl') + 'accounts/resetpassword/request', {
-            email: email,
-        })
-            .pipe(catchError(this._error.handleError));
-    }
-    /**
-     * Change the password.
-     * @param change The password change data.
-     */
-    changePassword(change) {
-        return this._http
-            .post(this._env.get('apiUrl') + 'accounts/changepassword', change)
-            .pipe(catchError(this._error.handleError));
-    }
-    /**
-     * Delete the user with the specified username.
-     * @param name The user name.
-     */
-    deleteUser(name) {
-        return this._http
-            .delete(this._env.get('apiUrl') + 'accounts/' + name)
-            .pipe(catchError(this._error.handleError));
-    }
-}
-AuthJwtAccountService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: AuthJwtAccountService, deps: [{ token: i1.HttpClient }, { token: i2.ErrorService }, { token: i2.EnvService }], target: i0.ɵɵFactoryTarget.Injectable });
-AuthJwtAccountService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: AuthJwtAccountService, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: AuthJwtAccountService, decorators: [{
-            type: Injectable,
-            args: [{
-                    providedIn: 'root',
-                }]
-        }], ctorParameters: function () { return [{ type: i1.HttpClient }, { type: i2.ErrorService }, { type: i2.EnvService }]; } });
-
-class PasswordStrengthBarComponent {
-    constructor() {
-        this._colors = ['#F00', '#F90', '#FF0', '#9F0', '#0F0'];
-        this.strengthChange = new EventEmitter();
-        this.strengthChange = new EventEmitter();
-        this.bars = [];
-    }
-    measureStrength(p) {
-        let force = 0;
-        const regex = /[$-/:-?{-~!"^_`\[\]]/g; // "
-        const lowerLetters = /[a-z]+/.test(p);
-        const upperLetters = /[A-Z]+/.test(p);
-        const numbers = /[0-9]+/.test(p);
-        const symbols = regex.test(p);
-        const flags = [lowerLetters, upperLetters, numbers, symbols];
-        let passedMatches = 0;
-        for (const flag of flags) {
-            passedMatches += flag === true ? 1 : 0;
-        }
-        force += 2 * p.length + (p.length >= 10 ? 1 : 0);
-        force += passedMatches * 10;
-        // penalty (short password)
-        force = p.length <= 6 ? Math.min(force, 10) : force;
-        // penalty (poor letiety of characters)
-        force = passedMatches === 1 ? Math.min(force, 10) : force;
-        force = passedMatches === 2 ? Math.min(force, 20) : force;
-        force = passedMatches === 3 ? Math.min(force, 40) : force;
-        return force;
-    }
-    getColor(s) {
-        let idx = 0;
-        if (s <= 10) {
-            idx = 0;
-        }
-        else if (s <= 20) {
-            idx = 1;
-        }
-        else if (s <= 30) {
-            idx = 2;
-        }
-        else if (s <= 40) {
-            idx = 3;
-        }
-        else {
-            idx = 4;
-        }
-        return {
-            idx: idx + 1,
-            col: this._colors[idx],
-        };
-    }
-    ngOnChanges(changes) {
-        const password = changes['passwordToCheck'].currentValue;
-        this.setBarColors(5, '#DDD');
-        if (password) {
-            const strength = this.measureStrength(password);
-            const c = this.getColor(strength);
-            this.setBarColors(c.idx, c.col);
-            this.strengthChange.emit(strength);
-        }
-    }
-    setBarColors(count, col) {
-        for (let n = 0; n < count; n++) {
-            this.bars[n] = col;
-        }
-    }
-}
-PasswordStrengthBarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: PasswordStrengthBarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-PasswordStrengthBarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.4", type: PasswordStrengthBarComponent, selector: "auth-jwt-password-strength-bar", inputs: { passwordToCheck: "passwordToCheck" }, outputs: { strengthChange: "strengthChange" }, usesOnChanges: true, ngImport: i0, template: "<div id=\"strength\">\n  <small>strength:</small>\n  <ul id=\"strengthBar\">\n    <li class=\"point\" [style.background-color]=\"bars[0]\"></li>\n    <li class=\"point\" [style.background-color]=\"bars[1]\"></li>\n    <li class=\"point\" [style.background-color]=\"bars[2]\"></li>\n    <li class=\"point\" [style.background-color]=\"bars[3]\"></li>\n    <li class=\"point\" [style.background-color]=\"bars[4]\"></li>\n  </ul>\n</div>\n", styles: ["ul#strengthBar{display:inline;list-style:none;margin:0 0 0 15px;padding:0;vertical-align:2px}li.point:last{margin:0!important}li.point{background:#ddd;border-radius:2px;display:inline-block;height:5px;margin-right:1px;width:20px}\n"] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: PasswordStrengthBarComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'auth-jwt-password-strength-bar', template: "<div id=\"strength\">\n  <small>strength:</small>\n  <ul id=\"strengthBar\">\n    <li class=\"point\" [style.background-color]=\"bars[0]\"></li>\n    <li class=\"point\" [style.background-color]=\"bars[1]\"></li>\n    <li class=\"point\" [style.background-color]=\"bars[2]\"></li>\n    <li class=\"point\" [style.background-color]=\"bars[3]\"></li>\n    <li class=\"point\" [style.background-color]=\"bars[4]\"></li>\n  </ul>\n</div>\n", styles: ["ul#strengthBar{display:inline;list-style:none;margin:0 0 0 15px;padding:0;vertical-align:2px}li.point:last{margin:0!important}li.point{background:#ddd;border-radius:2px;display:inline-block;height:5px;margin-right:1px;width:20px}\n"] }]
-        }], ctorParameters: function () { return []; }, propDecorators: { passwordToCheck: [{
-                type: Input
-            }], strengthChange: [{
-                type: Output
-            }] } });
-
-class AuthJwtRegistrationComponent {
-    constructor(formBuilder, _snackbar, _accountService) {
-        this._snackbar = _snackbar;
-        this._accountService = _accountService;
-        this.registered = new EventEmitter();
-        // form
-        this.email = formBuilder.control('', {
-            validators: [Validators.required, Validators.email],
-            asyncValidators: this.getUniqueEmailValidator(this._accountService).bind(this),
-            nonNullable: true,
-        });
-        this.name = formBuilder.control('', {
-            validators: Validators.required,
-            asyncValidators: this.getUniqueNameValidator(this._accountService).bind(this),
-            nonNullable: true,
-        });
-        this.firstName = formBuilder.control('', {
-            validators: [Validators.required, Validators.maxLength(50)],
-            nonNullable: true,
-        });
-        this.lastName = formBuilder.control('', {
-            validators: [Validators.required, Validators.maxLength(50)],
-            nonNullable: true,
-        });
-        // http://stackoverflow.com/questions/35474991/angular-2-form-validating-for-repeat-password
-        this.password = formBuilder.control('', {
-            validators: [Validators.required, PasswordValidators.standard()],
-            nonNullable: true,
-        });
-        this.confirmPassword = formBuilder.control('', {
-            validators: Validators.required,
-            nonNullable: true,
-        });
-        this.form = formBuilder.group({
-            email: this.email,
-            name: this.name,
-            firstName: this.firstName,
-            lastName: this.lastName,
-            password: this.password,
-            confirmPassword: this.confirmPassword,
-        }, {
-            validators: [
-                PasswordValidators.areEqual('password', 'confirmPassword'),
-            ],
-        });
-    }
-    /**
-     * Creates a unique name validator. There is no dependency injection at this level,
-     * but we can use closures. As a matter of fact, we have access to the service instance
-     * from the component where we register validators. So we will implement a function
-     * that will accept the service as parameter, and create the actual validation function.
-     * This function will have access to the service when called during the validation process.
-     * See http://restlet.com/blog/2016/02/17/implementing-angular2-forms-beyond-basics-part-2/.
-     */
-    getUniqueNameValidator(service) {
-        return (control) => {
-            return new Promise((resolve, reject) => {
-                // avoid checking if empty
-                if (!control.value) {
-                    resolve(null);
-                }
-                else {
-                    service.isNameRegistered(control.value).subscribe({
-                        next: (data) => {
-                            if (!data.isExisting) {
-                                resolve(null);
-                            }
-                            else {
-                                resolve({ uniqueName: true });
-                            }
-                        },
-                        error: (error) => {
-                            console.error('Unique name validator error' +
-                                (error ? JSON.stringify(error) : ''));
-                            resolve({ uniqueName: true });
-                        },
-                    });
-                }
-            });
-        };
-    }
-    getUniqueEmailValidator(service) {
-        return (control) => {
-            return new Promise((resolve, reject) => {
-                // avoid checking if empty
-                if (!control.value) {
-                    resolve(null);
-                }
-                else {
-                    service.isEmailRegistered(control.value).subscribe({
-                        next: (data) => {
-                            if (!data.isExisting) {
-                                resolve(null);
-                            }
-                            else {
-                                resolve({ uniqueEmail: true });
-                            }
-                        },
-                        error: (error) => {
-                            console.error('Unique email validator error' +
-                                (error ? JSON.stringify(error) : ''));
-                            resolve({ uniqueEmail: true });
-                        },
-                    });
-                }
-            });
-        };
-    }
-    onSubmit() {
-        if (!this.form.valid ||
-            this.busy ||
-            this.name.pending ||
-            this.email.pending) {
-            return;
-        }
-        const model = {
-            email: this.email.value,
-            name: this.name.value,
-            firstName: this.firstName.value,
-            lastName: this.lastName.value,
-            password: this.password.value,
-        };
-        this.busy = true;
-        this._accountService
-            .register(model)
-            .pipe(take(1))
-            .subscribe({
-            next: () => {
-                this.busy = false;
-                this._snackbar.open('Registration succeeded', 'OK');
-                this.registered.emit();
-            },
-            error: (error) => {
-                this.busy = false;
-                console.error('Registration  error' + (error ? JSON.stringify(error) : ''));
-                this._snackbar.open('Registration error', 'OK');
-            },
-        });
-    }
-}
-AuthJwtRegistrationComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: AuthJwtRegistrationComponent, deps: [{ token: i1$1.FormBuilder }, { token: i2$1.MatSnackBar }, { token: AuthJwtAccountService }], target: i0.ɵɵFactoryTarget.Component });
-AuthJwtRegistrationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.4", type: AuthJwtRegistrationComponent, selector: "auth-jwt-registration", outputs: { registered: "registered" }, ngImport: i0, template: "<div>\r\n  <form role=\"form\" [formGroup]=\"form\" (submit)=\"onSubmit()\">\r\n    <fieldset>\r\n      <legend>registration</legend>\r\n      <!-- email -->\r\n      <div class=\"form-row\">\r\n        <mat-form-field>\r\n          <mat-label>email</mat-label>\r\n          <input\r\n            matInput\r\n            type=\"email\"\r\n            id=\"email\"\r\n            maxlength=\"256\"\r\n            required\r\n            autofocus\r\n            spellcheck=\"false\"\r\n            [formControl]=\"email\"\r\n          />\r\n          <mat-error\r\n            *ngIf=\"\r\n              $any(email).errors?.required && (email.dirty || email.touched)\r\n            \"\r\n            >email required</mat-error\r\n          >\r\n          <mat-error\r\n            *ngIf=\"$any(email).errors?.email && (email.dirty || email.touched)\"\r\n            >invalid email</mat-error\r\n          >\r\n          <mat-error\r\n            *ngIf=\"\r\n              $any(email).errors?.uniqueEmail && (email.dirty || email.touched)\r\n            \"\r\n            >email already registered</mat-error\r\n          >\r\n        </mat-form-field>\r\n        <mat-icon *ngIf=\"email.pending\">hourglass</mat-icon>\r\n      </div>\r\n\r\n      <!-- name -->\r\n      <div class=\"form-row\">\r\n        <mat-form-field>\r\n          <mat-label>username</mat-label>\r\n          <input\r\n            matInput\r\n            type=\"text\"\r\n            id=\"name\"\r\n            maxlength=\"50\"\r\n            required\r\n            pattern=\"^[a-zA-Z][a-zA-Z0-9]{2,49}$\"\r\n            spellcheck=\"false\"\r\n            [formControl]=\"name\"\r\n          />\r\n          <mat-error\r\n            *ngIf=\"$any(name).errors?.required && (name.dirty || name.touched)\"\r\n            >username required</mat-error\r\n          >\r\n          <mat-error\r\n            *ngIf=\"$any(name).errors?.pattern && (name.dirty || name.touched)\"\r\n            >invalid username</mat-error\r\n          >\r\n          <mat-error\r\n            *ngIf=\"\r\n              $any(name).errors?.uniqueName && (name.dirty || name.touched)\r\n            \"\r\n            >username already registered</mat-error\r\n          >\r\n        </mat-form-field>\r\n        <mat-icon *ngIf=\"name.pending\">hourglass</mat-icon>\r\n      </div>\r\n\r\n      <!-- first name -->\r\n      <div>\r\n        <mat-form-field>\r\n          <mat-label>first name</mat-label>\r\n          <input\r\n            matInput\r\n            type=\"text\"\r\n            id=\"firstName\"\r\n            maxlength=\"50\"\r\n            required\r\n            spellcheck=\"false\"\r\n            [formControl]=\"firstName\"\r\n          />\r\n          <mat-error\r\n            *ngIf=\"\r\n              firstName.hasError('required') &&\r\n              (firstName.dirty || firstName.touched)\r\n            \"\r\n            class=\"text-danger small\"\r\n          >\r\n            first name required\r\n          </mat-error>\r\n        </mat-form-field>\r\n      </div>\r\n\r\n      <!-- last name -->\r\n      <div>\r\n        <mat-form-field>\r\n          <mat-label>last name</mat-label>\r\n          <input\r\n            matInput\r\n            type=\"text\"\r\n            id=\"lastName\"\r\n            maxlength=\"50\"\r\n            required\r\n            spellcheck=\"false\"\r\n            [formControl]=\"lastName\"\r\n          />\r\n          <mat-error\r\n            *ngIf=\"\r\n              lastName.hasError('required') &&\r\n              (lastName.dirty || lastName.touched)\r\n            \"\r\n            class=\"text-danger small\"\r\n          >\r\n            last name required\r\n          </mat-error>\r\n        </mat-form-field>\r\n      </div>\r\n\r\n      <!-- <div [formGroup]=\"passwords\"> -->\r\n      <!-- password -->\r\n      <div>\r\n        <mat-form-field>\r\n          <mat-label>password</mat-label>\r\n          <input\r\n            matInput\r\n            type=\"password\"\r\n            name=\"password\"\r\n            autocomplete=\"new-password\"\r\n            maxlength=\"50\"\r\n            required\r\n            spellcheck=\"false\"\r\n            [formControl]=\"password\"\r\n          />\r\n          <auth-jwt-password-strength-bar [passwordToCheck]=\"password.value\">\r\n          </auth-jwt-password-strength-bar>\r\n          <mat-error\r\n            *ngIf=\"\r\n              $any(password).errors?.required &&\r\n              (password.dirty || password.touched)\r\n            \"\r\n            >password required</mat-error\r\n          >\r\n          <mat-error\r\n            *ngIf=\"\r\n              $any(password).errors?.passwordtooshort &&\r\n              (password.dirty || password.touched)\r\n            \"\r\n            >at least 8 characters</mat-error\r\n          >\r\n          <mat-error\r\n            *ngIf=\"\r\n              $any(password).errors?.noupperinpassword &&\r\n              (password.dirty || password.touched)\r\n            \"\r\n            >at least 1 uppercase letter</mat-error\r\n          >\r\n          <mat-error\r\n            *ngIf=\"\r\n              $any(password).errors?.nolowerinpassword &&\r\n              (password.dirty || password.touched)\r\n            \"\r\n            >at least 1 lowercase letter</mat-error\r\n          >\r\n          <mat-error\r\n            *ngIf=\"\r\n              $any(password).errors?.nosymbolinpassword &&\r\n              (password.dirty || password.touched)\r\n            \"\r\n            >at least 1 punctuation/symbol</mat-error\r\n          >\r\n        </mat-form-field>\r\n      </div>\r\n\r\n      <!-- confirm password -->\r\n      <div>\r\n        <mat-form-field>\r\n          <mat-label>confirm password</mat-label>\r\n          <input\r\n            matInput\r\n            type=\"password\"\r\n            name=\"confirmPassword\"\r\n            maxlength=\"50\"\r\n            required\r\n            spellcheck=\"false\"\r\n            [formControl]=\"confirmPassword\"\r\n          />\r\n        </mat-form-field>\r\n      </div>\r\n      <div\r\n        *ngIf=\"form.errors?.areequal && confirmPassword.touched\"\r\n        style=\"color: red\"\r\n      >\r\n        password differs from confirmation password\r\n      </div>\r\n\r\n      <button\r\n        mat-raised-button\r\n        type=\"submit\"\r\n        color=\"primary\"\r\n        [disabled]=\"\r\n          form.invalid || form.pristine || busy || name.pending || email.pending\r\n        \"\r\n      >\r\n        register\r\n      </button>\r\n      <mat-progress-spinner\r\n        diameter=\"20\"\r\n        *ngIf=\"busy\"\r\n        aria-label=\"Busy\"\r\n      ></mat-progress-spinner>\r\n    </fieldset>\r\n  </form>\r\n\r\n  <details>\r\n    <summary>Hints</summary>\r\n    <p>\r\n      To register a new user, you must provide his email address, choose a\r\n      password, and choose a username, which must be unique (you will be\r\n      notified if another user has already taken that name). The username must\r\n      include only letters/digits, start with a letter, and be no shorter than 3\r\n      characters, nor longer than 50.\r\n    </p>\r\n    <p>\r\n      To promote a decent security level, the password must include at least 8\r\n      characters, uppercase and lowercase letters, digits, and punctuation (like\r\n      dashes, stops, parentheses, etc.).\r\n    </p>\r\n    <p>\r\n      Once registered, if messaging is enabled on the server side the user will\r\n      receive an email message to the email address you specified; he will have\r\n      to click on the provided link to complete the registration process.\r\n      Otherwise, you should edit the newly created user and confirm the email\r\n      registration.\r\n    </p>\r\n  </details>\r\n</div>\r\n", styles: ["mat-form-field{width:400px}fieldset{border:1px solid silver;border-radius:8px;padding:16px}.form-row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.form-row *{flex:0 0 auto}details{margin:8px}\n"], dependencies: [{ kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$1.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1$1.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i1$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: i5.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i6.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i7.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i8.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i8.MatLabel, selector: "mat-label" }, { kind: "directive", type: i8.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "component", type: i9.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "component", type: PasswordStrengthBarComponent, selector: "auth-jwt-password-strength-bar", inputs: ["passwordToCheck"], outputs: ["strengthChange"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: AuthJwtRegistrationComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'auth-jwt-registration', template: "<div>\r\n  <form role=\"form\" [formGroup]=\"form\" (submit)=\"onSubmit()\">\r\n    <fieldset>\r\n      <legend>registration</legend>\r\n      <!-- email -->\r\n      <div class=\"form-row\">\r\n        <mat-form-field>\r\n          <mat-label>email</mat-label>\r\n          <input\r\n            matInput\r\n            type=\"email\"\r\n            id=\"email\"\r\n            maxlength=\"256\"\r\n            required\r\n            autofocus\r\n            spellcheck=\"false\"\r\n            [formControl]=\"email\"\r\n          />\r\n          <mat-error\r\n            *ngIf=\"\r\n              $any(email).errors?.required && (email.dirty || email.touched)\r\n            \"\r\n            >email required</mat-error\r\n          >\r\n          <mat-error\r\n            *ngIf=\"$any(email).errors?.email && (email.dirty || email.touched)\"\r\n            >invalid email</mat-error\r\n          >\r\n          <mat-error\r\n            *ngIf=\"\r\n              $any(email).errors?.uniqueEmail && (email.dirty || email.touched)\r\n            \"\r\n            >email already registered</mat-error\r\n          >\r\n        </mat-form-field>\r\n        <mat-icon *ngIf=\"email.pending\">hourglass</mat-icon>\r\n      </div>\r\n\r\n      <!-- name -->\r\n      <div class=\"form-row\">\r\n        <mat-form-field>\r\n          <mat-label>username</mat-label>\r\n          <input\r\n            matInput\r\n            type=\"text\"\r\n            id=\"name\"\r\n            maxlength=\"50\"\r\n            required\r\n            pattern=\"^[a-zA-Z][a-zA-Z0-9]{2,49}$\"\r\n            spellcheck=\"false\"\r\n            [formControl]=\"name\"\r\n          />\r\n          <mat-error\r\n            *ngIf=\"$any(name).errors?.required && (name.dirty || name.touched)\"\r\n            >username required</mat-error\r\n          >\r\n          <mat-error\r\n            *ngIf=\"$any(name).errors?.pattern && (name.dirty || name.touched)\"\r\n            >invalid username</mat-error\r\n          >\r\n          <mat-error\r\n            *ngIf=\"\r\n              $any(name).errors?.uniqueName && (name.dirty || name.touched)\r\n            \"\r\n            >username already registered</mat-error\r\n          >\r\n        </mat-form-field>\r\n        <mat-icon *ngIf=\"name.pending\">hourglass</mat-icon>\r\n      </div>\r\n\r\n      <!-- first name -->\r\n      <div>\r\n        <mat-form-field>\r\n          <mat-label>first name</mat-label>\r\n          <input\r\n            matInput\r\n            type=\"text\"\r\n            id=\"firstName\"\r\n            maxlength=\"50\"\r\n            required\r\n            spellcheck=\"false\"\r\n            [formControl]=\"firstName\"\r\n          />\r\n          <mat-error\r\n            *ngIf=\"\r\n              firstName.hasError('required') &&\r\n              (firstName.dirty || firstName.touched)\r\n            \"\r\n            class=\"text-danger small\"\r\n          >\r\n            first name required\r\n          </mat-error>\r\n        </mat-form-field>\r\n      </div>\r\n\r\n      <!-- last name -->\r\n      <div>\r\n        <mat-form-field>\r\n          <mat-label>last name</mat-label>\r\n          <input\r\n            matInput\r\n            type=\"text\"\r\n            id=\"lastName\"\r\n            maxlength=\"50\"\r\n            required\r\n            spellcheck=\"false\"\r\n            [formControl]=\"lastName\"\r\n          />\r\n          <mat-error\r\n            *ngIf=\"\r\n              lastName.hasError('required') &&\r\n              (lastName.dirty || lastName.touched)\r\n            \"\r\n            class=\"text-danger small\"\r\n          >\r\n            last name required\r\n          </mat-error>\r\n        </mat-form-field>\r\n      </div>\r\n\r\n      <!-- <div [formGroup]=\"passwords\"> -->\r\n      <!-- password -->\r\n      <div>\r\n        <mat-form-field>\r\n          <mat-label>password</mat-label>\r\n          <input\r\n            matInput\r\n            type=\"password\"\r\n            name=\"password\"\r\n            autocomplete=\"new-password\"\r\n            maxlength=\"50\"\r\n            required\r\n            spellcheck=\"false\"\r\n            [formControl]=\"password\"\r\n          />\r\n          <auth-jwt-password-strength-bar [passwordToCheck]=\"password.value\">\r\n          </auth-jwt-password-strength-bar>\r\n          <mat-error\r\n            *ngIf=\"\r\n              $any(password).errors?.required &&\r\n              (password.dirty || password.touched)\r\n            \"\r\n            >password required</mat-error\r\n          >\r\n          <mat-error\r\n            *ngIf=\"\r\n              $any(password).errors?.passwordtooshort &&\r\n              (password.dirty || password.touched)\r\n            \"\r\n            >at least 8 characters</mat-error\r\n          >\r\n          <mat-error\r\n            *ngIf=\"\r\n              $any(password).errors?.noupperinpassword &&\r\n              (password.dirty || password.touched)\r\n            \"\r\n            >at least 1 uppercase letter</mat-error\r\n          >\r\n          <mat-error\r\n            *ngIf=\"\r\n              $any(password).errors?.nolowerinpassword &&\r\n              (password.dirty || password.touched)\r\n            \"\r\n            >at least 1 lowercase letter</mat-error\r\n          >\r\n          <mat-error\r\n            *ngIf=\"\r\n              $any(password).errors?.nosymbolinpassword &&\r\n              (password.dirty || password.touched)\r\n            \"\r\n            >at least 1 punctuation/symbol</mat-error\r\n          >\r\n        </mat-form-field>\r\n      </div>\r\n\r\n      <!-- confirm password -->\r\n      <div>\r\n        <mat-form-field>\r\n          <mat-label>confirm password</mat-label>\r\n          <input\r\n            matInput\r\n            type=\"password\"\r\n            name=\"confirmPassword\"\r\n            maxlength=\"50\"\r\n            required\r\n            spellcheck=\"false\"\r\n            [formControl]=\"confirmPassword\"\r\n          />\r\n        </mat-form-field>\r\n      </div>\r\n      <div\r\n        *ngIf=\"form.errors?.areequal && confirmPassword.touched\"\r\n        style=\"color: red\"\r\n      >\r\n        password differs from confirmation password\r\n      </div>\r\n\r\n      <button\r\n        mat-raised-button\r\n        type=\"submit\"\r\n        color=\"primary\"\r\n        [disabled]=\"\r\n          form.invalid || form.pristine || busy || name.pending || email.pending\r\n        \"\r\n      >\r\n        register\r\n      </button>\r\n      <mat-progress-spinner\r\n        diameter=\"20\"\r\n        *ngIf=\"busy\"\r\n        aria-label=\"Busy\"\r\n      ></mat-progress-spinner>\r\n    </fieldset>\r\n  </form>\r\n\r\n  <details>\r\n    <summary>Hints</summary>\r\n    <p>\r\n      To register a new user, you must provide his email address, choose a\r\n      password, and choose a username, which must be unique (you will be\r\n      notified if another user has already taken that name). The username must\r\n      include only letters/digits, start with a letter, and be no shorter than 3\r\n      characters, nor longer than 50.\r\n    </p>\r\n    <p>\r\n      To promote a decent security level, the password must include at least 8\r\n      characters, uppercase and lowercase letters, digits, and punctuation (like\r\n      dashes, stops, parentheses, etc.).\r\n    </p>\r\n    <p>\r\n      Once registered, if messaging is enabled on the server side the user will\r\n      receive an email message to the email address you specified; he will have\r\n      to click on the provided link to complete the registration process.\r\n      Otherwise, you should edit the newly created user and confirm the email\r\n      registration.\r\n    </p>\r\n  </details>\r\n</div>\r\n", styles: ["mat-form-field{width:400px}fieldset{border:1px solid silver;border-radius:8px;padding:16px}.form-row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.form-row *{flex:0 0 auto}details{margin:8px}\n"] }]
-        }], ctorParameters: function () { return [{ type: i1$1.FormBuilder }, { type: i2$1.MatSnackBar }, { type: AuthJwtAccountService }]; }, propDecorators: { registered: [{
-                type: Output
-            }] } });
-
-const PAGE_SIZE = 20;
-class UserListRepository {
-    constructor(_accService) {
-        this._accService = _accService;
-        // create store
-        this._store = this.createStore();
-        this._lastPageSize = PAGE_SIZE;
-        this._loading$ = new BehaviorSubject(false);
-        this._saving$ = new BehaviorSubject(false);
-        this.loading$ = this._loading$.asObservable();
-        this.saving$ = this._saving$.asObservable();
-        // combine pagination parameters with page data for our consumers
-        this.pagination$ = combineLatest([
-            this._store.pipe(selectPaginationData()),
-            this._store.pipe(selectCurrentPageEntities()),
-        ]).pipe(map(([pagination, data]) => ({ ...pagination, data })), debounceTime(0));
-        // the active user, if required
-        this.activeUser$ = this._store.pipe(selectActiveEntity());
-        // the filter, if required
-        this.filter$ = this._store.pipe(select((state) => state.filter));
-        this.filter$.subscribe((filter) => {
-            // when filter changed, reset any existing page and move to page 1
-            const paginationData = this._store.getValue().pagination;
-            this._store.update(deleteAllPages());
-            // load page 1
-            this.loadPage(1, paginationData.perPage);
-        });
-        // the request status
-        this.status$ = this._store.pipe(selectRequestStatus('user-list'));
-        // load page 1 and subscribe to pagination
-        this.loadPage(1, PAGE_SIZE);
-        this.pagination$.subscribe(console.log);
-    }
-    createStore() {
-        const store = createStore({ name: 'user-list' }, withProps({
-            filter: {},
-        }), withEntities({ idKey: 'userName' }), withActiveId(), withRequestsCache(), withRequestsStatus(), withPagination());
-        return store;
-    }
-    adaptPage(page) {
-        // adapt the server page DataPage<T> to Elf pagination
-        return {
-            currentPage: page.pageNumber,
-            perPage: page.pageSize,
-            lastPage: page.pageCount,
-            total: page.total,
-            data: page.items,
-        };
-    }
-    addPage(response) {
-        const { data, ...paginationData } = response;
-        this._store.update(upsertEntities(data), updatePaginationData(paginationData), setPage(paginationData.currentPage, data.map((c) => c.userName)));
-    }
-    loadPage(pageNumber, pageSize) {
-        if (!pageSize) {
-            pageSize = PAGE_SIZE;
-        }
-        // if the page exists and page size is the same, just move to it
-        if (this._store.query(hasPage(pageNumber)) &&
-            pageSize === this._lastPageSize) {
-            console.log('Page exists: ' + pageNumber);
-            this._store.update(setCurrentPage(pageNumber));
-            return;
-        }
-        // reset cached pages if page size changed
-        if (this._lastPageSize !== pageSize) {
-            this._store.update(deleteAllPages());
-            this._lastPageSize = pageSize;
-        }
-        // load page from server
-        this._store.update(updateRequestStatus('user-list', 'pending'));
-        this._loading$.next(true);
-        this._accService
-            .getUsers(this._store.getValue().filter, pageNumber, pageSize)
-            .pipe(take$1(1))
-            .subscribe((page) => {
-            this._loading$.next(false);
-            this.addPage({ ...this.adaptPage(page), data: page.items });
-            this._store.update(updateRequestStatus('user-list', 'success'));
-        });
-    }
-    setFilter(filter) {
-        this._store.update((state) => ({ ...state, filter: filter }));
-    }
-    clearCache() {
-        this._store.update(deleteAllEntities(), deleteAllPages());
-    }
-    setActive(name) {
-        this._store.update(setActiveId(name));
-    }
-    updateActive(user) {
-        const promise = new Promise((resolve, reject) => {
-            this._saving$.next(true);
-            this._accService.updateUser(user).subscribe({
-                next: (_) => {
-                    this._saving$.next(false);
-                    this._store.update(upsertEntities(user));
-                    resolve(true);
-                },
-                error: (error) => {
-                    this._saving$.next(false);
-                    console.error(`Error updating user ${user.userName}: ` +
-                        JSON.stringify(error || {}));
-                    resolve(false);
-                },
-            });
-        });
-        return promise;
-    }
-    deleteUser(name) {
-        const promise = new Promise((resolve, reject) => {
-            this._saving$.next(true);
-            this._accService.deleteUser(name).subscribe({
-                next: (_) => {
-                    this._saving$.next(false);
-                    this.clearCache();
-                    this.loadPage(1);
-                    resolve(true);
-                },
-                error: (error) => {
-                    this._saving$.next(false);
-                    console.error(`Error deleting user ${name}: ` + JSON.stringify(error || {}));
-                    reject(error);
-                },
-            });
-        });
-        return promise;
-    }
-}
-UserListRepository.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: UserListRepository, deps: [{ token: AuthJwtAccountService }], target: i0.ɵɵFactoryTarget.Injectable });
-UserListRepository.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: UserListRepository, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: UserListRepository, decorators: [{
-            type: Injectable,
-            args: [{ providedIn: 'root' }]
-        }], ctorParameters: function () { return [{ type: AuthJwtAccountService }]; } });
-
-class UserFilterComponent {
-    constructor(formBuilder, _repository) {
-        this._repository = _repository;
-        this.filter$ = _repository.filter$;
-        // form
-        this.name = formBuilder.control(null);
-        this.form = formBuilder.group({
-            name: this.name,
-        });
-    }
-    ngOnInit() {
-        this.filter$.subscribe((f) => {
-            this.updateForm(f);
-        });
-    }
-    updateForm(filter) {
-        this.name.setValue(filter.name || null);
-        this.form.markAsPristine();
-    }
-    reset() {
-        this.form.reset();
-        this.apply();
-    }
-    getFilter() {
-        return {
-            name: this.name.value?.trim(),
-        };
-    }
-    apply() {
-        if (this.form.invalid) {
-            return;
-        }
-        const filter = this.getFilter();
-        // update filter in state
-        this._repository.setFilter(filter);
-    }
-}
-UserFilterComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: UserFilterComponent, deps: [{ token: i1$1.FormBuilder }, { token: UserListRepository }], target: i0.ɵɵFactoryTarget.Component });
-UserFilterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.4", type: UserFilterComponent, selector: "auth-jwt-user-filter", inputs: { disabled: "disabled" }, ngImport: i0, template: "<form [formGroup]=\"form\" (submit)=\"apply()\" ng-disabled=\"disabled\">\r\n  <div class=\"form-row\">\r\n    <mat-form-field>\r\n      <mat-label>name or ID</mat-label>\r\n      <input matInput [formControl]=\"name\" />\r\n      <button\r\n        mat-icon-button\r\n        matSuffix\r\n        type=\"button\"\r\n        (click)=\"reset()\"\r\n        color=\"warn\"\r\n        matTooltip=\"Reset filters\"\r\n        [disabled]=\"disabled\"\r\n      >\r\n        <mat-icon>clear</mat-icon>\r\n      </button>\r\n    </mat-form-field>\r\n\r\n    <button\r\n      style=\"margin-top: -20px\"\r\n      type=\"submit\"\r\n      mat-icon-button\r\n      color=\"primary\"\r\n      [disabled]=\"disabled\"\r\n      matTooltip=\"Apply filters\"\r\n    >\r\n      <mat-icon>check_circle</mat-icon>\r\n    </button>\r\n  </div>\r\n</form>\r\n", styles: [".form-row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.form-row *{flex:0 0 auto}\n"], dependencies: [{ kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: i5.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i6.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i7.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i8.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i8.MatLabel, selector: "mat-label" }, { kind: "directive", type: i8.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: i7$1.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: UserFilterComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'auth-jwt-user-filter', template: "<form [formGroup]=\"form\" (submit)=\"apply()\" ng-disabled=\"disabled\">\r\n  <div class=\"form-row\">\r\n    <mat-form-field>\r\n      <mat-label>name or ID</mat-label>\r\n      <input matInput [formControl]=\"name\" />\r\n      <button\r\n        mat-icon-button\r\n        matSuffix\r\n        type=\"button\"\r\n        (click)=\"reset()\"\r\n        color=\"warn\"\r\n        matTooltip=\"Reset filters\"\r\n        [disabled]=\"disabled\"\r\n      >\r\n        <mat-icon>clear</mat-icon>\r\n      </button>\r\n    </mat-form-field>\r\n\r\n    <button\r\n      style=\"margin-top: -20px\"\r\n      type=\"submit\"\r\n      mat-icon-button\r\n      color=\"primary\"\r\n      [disabled]=\"disabled\"\r\n      matTooltip=\"Apply filters\"\r\n    >\r\n      <mat-icon>check_circle</mat-icon>\r\n    </button>\r\n  </div>\r\n</form>\r\n", styles: [".form-row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.form-row *{flex:0 0 auto}\n"] }]
-        }], ctorParameters: function () { return [{ type: i1$1.FormBuilder }, { type: UserListRepository }]; }, propDecorators: { disabled: [{
-                type: Input
-            }] } });
-
-// https://medium.com/@tarik.nzl/making-use-of-dialogs-in-material-2-mddialog-7533d27df41
-class ConfirmDialogComponent {
-    constructor(dialogRef, data) {
-        this.dialogRef = dialogRef;
-        this.data = data;
-        this.title = 'Confirm';
-        this.prompt = 'Confirm operation?';
-        this.ok = 'yes';
-        this.cancel = 'no';
-    }
-    ngOnInit() { }
-}
-ConfirmDialogComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: ConfirmDialogComponent, deps: [{ token: i1$2.MatDialogRef }, { token: MAT_DIALOG_DATA, optional: true }], target: i0.ɵɵFactoryTarget.Component });
-ConfirmDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.4", type: ConfirmDialogComponent, selector: "ng-component", ngImport: i0, template: "<h1 mat-dialog-title>{{ title }}</h1>\r\n<mat-dialog-content>\r\n  {{ prompt }}\r\n</mat-dialog-content>\r\n<mat-dialog-actions>\r\n  <button\r\n    type=\"button\"\r\n    mat-raised-button\r\n    color=\"warn\"\r\n    (click)=\"dialogRef.close(true)\"\r\n  >\r\n    {{ ok }}\r\n  </button>\r\n  <button type=\"button\" mat-button (click)=\"dialogRef.close()\">\r\n    {{ cancel }}\r\n  </button>\r\n</mat-dialog-actions>\r\n", styles: [""], dependencies: [{ kind: "component", type: i5.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: i1$2.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i1$2.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "directive", type: i1$2.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: ConfirmDialogComponent, decorators: [{
-            type: Component,
-            args: [{ template: "<h1 mat-dialog-title>{{ title }}</h1>\r\n<mat-dialog-content>\r\n  {{ prompt }}\r\n</mat-dialog-content>\r\n<mat-dialog-actions>\r\n  <button\r\n    type=\"button\"\r\n    mat-raised-button\r\n    color=\"warn\"\r\n    (click)=\"dialogRef.close(true)\"\r\n  >\r\n    {{ ok }}\r\n  </button>\r\n  <button type=\"button\" mat-button (click)=\"dialogRef.close()\">\r\n    {{ cancel }}\r\n  </button>\r\n</mat-dialog-actions>\r\n" }]
-        }], ctorParameters: function () { return [{ type: i1$2.MatDialogRef }, { type: undefined, decorators: [{
-                    type: Optional
-                }, {
-                    type: Inject,
-                    args: [MAT_DIALOG_DATA]
-                }] }]; } });
-
-// https://medium.com/@tarik.nzl/making-use-of-dialogs-in-material-2-mddialog-7533d27df41
-/**
- * This service acts as a wrapper for MatDialog to simplify the process of calling
- * the dialog and subscribing to it. What it will do is create an Instance of
- * MatDialog with our custom component (ConfirmDialogComponent). Then it will set
- * any public properties it needs to by setting the properties on the
- * componentInstance object. It will return the observable afterClosed()
- * to the caller so they can subscribe to it. This will emit an event whenever
- * the dialog is closed.
- */
-class DialogService {
-    constructor(dialog) {
-        this.dialog = dialog;
-    }
-    confirm(title, prompt, ok = 'yes', cancel = 'no') {
-        let dialogRef;
-        dialogRef = this.dialog.open(ConfirmDialogComponent);
-        dialogRef.componentInstance.title = title;
-        dialogRef.componentInstance.prompt = prompt;
-        dialogRef.componentInstance.ok = ok;
-        dialogRef.componentInstance.cancel = cancel;
-        return dialogRef.afterClosed();
-    }
-}
-DialogService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: DialogService, deps: [{ token: i1$2.MatDialog }], target: i0.ɵɵFactoryTarget.Injectable });
-DialogService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: DialogService, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: DialogService, decorators: [{
-            type: Injectable,
-            args: [{
-                    providedIn: 'root'
-                }]
-        }], ctorParameters: function () { return [{ type: i1$2.MatDialog }]; } });
-
-class UserEditorComponent {
-    constructor(formBuilder, _authService) {
-        this._authService = _authService;
-        // events
-        this.userChange = new EventEmitter();
-        this.editorClose = new EventEmitter();
-        // form
-        this.email = formBuilder.control(null, [
-            Validators.required,
-            Validators.email,
-        ]);
-        this.emailConfirmed = formBuilder.control(false);
-        this.lockoutEnabled = formBuilder.control(false);
-        this.firstName = formBuilder.control(null, [
-            Validators.required,
-            Validators.maxLength(50),
-        ]);
-        this.lastName = formBuilder.control(null, [
-            Validators.required,
-            Validators.maxLength(50),
-        ]);
-        this.roles = formBuilder.control(null, Validators.maxLength(200));
-        this.form = formBuilder.group({
-            email: this.email,
-            emailConfirmed: this.emailConfirmed,
-            lockoutEnabled: this.lockoutEnabled,
-            firstName: this.firstName,
-            lastName: this.lastName,
-            roles: this.roles,
-        });
-    }
-    set user(value) {
-        this._user = value;
-        this.updateForm(value);
-    }
-    get user() {
-        return this._user;
-    }
-    ngOnInit() { }
-    updateForm(user) {
-        if (!user) {
-            this.form.reset();
-        }
-        else {
-            this.email.setValue(user.email);
-            this.emailConfirmed.setValue(user.emailConfirmed);
-            this.lockoutEnabled.setValue(user.lockoutEnabled);
-            this.firstName.setValue(user.firstName);
-            this.lastName.setValue(user.lastName);
-            if (user.roles?.length > 0) {
-                this.roles.setValue(user.roles.join(' '));
-            }
-            else {
-                this.roles.setValue(null);
-            }
-        }
-    }
-    getUserFromForm() {
-        return {
-            userName: this._user?.userName || '',
-            email: this.email.value,
-            emailConfirmed: this.emailConfirmed.value,
-            lockoutEnabled: this.lockoutEnabled.value,
-            firstName: this.firstName.value,
-            lastName: this.lastName.value,
-            roles: this.roles.value
-                ? this.roles.value.split(' ').filter((s) => s)
-                : [],
-        };
-    }
-    endLockout() {
-        if (this.unlocked) {
-            return;
-        }
-        this._user.lockoutEnd = this._authService.getUTCDate();
-        this.unlocked = true;
-    }
-    close() {
-        this.editorClose.emit();
-    }
-    save() {
-        if (this.form.invalid) {
-            return;
-        }
-        this.userChange.emit(this.getUserFromForm());
-    }
-}
-UserEditorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: UserEditorComponent, deps: [{ token: i1$1.UntypedFormBuilder }, { token: i2$2.AuthJwtService }], target: i0.ɵɵFactoryTarget.Component });
-UserEditorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.4", type: UserEditorComponent, selector: "auth-jwt-user-editor", inputs: { user: "user" }, outputs: { userChange: "userChange", editorClose: "editorClose" }, ngImport: i0, template: "<form [formGroup]=\"form\" (submit)=\"save()\">\r\n  <div class=\"form-row\">\r\n    <!-- email -->\r\n    <mat-form-field>\r\n      <mat-label>email</mat-label>\r\n      <input type=\"text\" matInput [formControl]=\"email\" />\r\n      <mat-error\r\n        *ngIf=\"email.hasError('required') && (email.dirty || email.touched)\"\r\n      >\r\n        email address required\r\n      </mat-error>\r\n      <mat-error\r\n        *ngIf=\"email.hasError('pattern') && (email.dirty || email.touched)\"\r\n      >\r\n        invalid email address\r\n      </mat-error>\r\n    </mat-form-field>\r\n\r\n    <!-- emailConfirmed -->\r\n    <mat-checkbox [formControl]=\"emailConfirmed\"\r\n      >email address confirmed</mat-checkbox\r\n    >\r\n  </div>\r\n\r\n  <!-- lockoutEnabled -->\r\n  <div class=\"form-row\">\r\n    <mat-checkbox [formControl]=\"lockoutEnabled\">lockout enabled</mat-checkbox>\r\n    <button\r\n      mat-icon-button\r\n      color=\"primary\"\r\n      (click)=\"endLockout()\"\r\n      [disabled]=\"unlocked\"\r\n      matTooltip=\"Unlock this user if locked\"\r\n    >\r\n      <mat-icon>lock_open</mat-icon>\r\n    </button>\r\n  </div>\r\n\r\n  <div class=\"form-row\">\r\n    <!-- firstName -->\r\n    <mat-form-field>\r\n      <mat-label>first name</mat-label>\r\n      <input type=\"text\" matInput [formControl]=\"firstName\" />\r\n      <mat-error\r\n        *ngIf=\"\r\n          firstName.hasError('required') &&\r\n          (firstName.dirty || firstName.touched)\r\n        \"\r\n      >\r\n        first name required\r\n      </mat-error>\r\n      <mat-error\r\n        *ngIf=\"\r\n          firstName.hasError('maxlength') &&\r\n          (firstName.dirty || firstName.touched)\r\n        \"\r\n      >\r\n        first name too long\r\n      </mat-error>\r\n    </mat-form-field>\r\n\r\n    <!-- lastName -->\r\n    <mat-form-field>\r\n      <mat-label>last name</mat-label>\r\n      <input type=\"text\" matInput [formControl]=\"lastName\" />\r\n      <mat-error\r\n        *ngIf=\"\r\n          lastName.hasError('required') && (lastName.dirty || lastName.touched)\r\n        \"\r\n      >\r\n        last name required\r\n      </mat-error>\r\n      <mat-error\r\n        *ngIf=\"\r\n          lastName.hasError('maxlength') && (lastName.dirty || lastName.touched)\r\n        \"\r\n      >\r\n        last name too long\r\n      </mat-error>\r\n    </mat-form-field>\r\n  </div>\r\n\r\n  <!-- roles -->\r\n  <div>\r\n    <mat-form-field style=\"width: 16em\">\r\n      <mat-label>roles</mat-label>\r\n      <input type=\"text\" matInput [formControl]=\"roles\" />\r\n      <mat-error\r\n        *ngIf=\"roles.hasError('maxlength') && (roles.dirty || roles.touched)\"\r\n      >\r\n        too long\r\n      </mat-error>\r\n      <mat-hint>roles (separated by space)</mat-hint>\r\n    </mat-form-field>\r\n  </div>\r\n\r\n  <!-- buttons -->\r\n  <br />\r\n  <div>\r\n    <button mat-icon-button color=\"warn\" matTooltip=\"Close\" (click)=\"close()\">\r\n      <mat-icon>cancel</mat-icon>\r\n    </button>\r\n    <button\r\n      type=\"submit\"\r\n      mat-icon-button\r\n      color=\"primary\"\r\n      [disabled]=\"form.invalid\"\r\n      matTooltip=\"Save user\"\r\n    >\r\n      <mat-icon>check_circle</mat-icon>\r\n    </button>\r\n  </div>\r\n</form>\r\n", styles: [".form-row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.form-row *{flex:0 0 auto}\n"], dependencies: [{ kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: i5.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i5$1.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex"], exportAs: ["matCheckbox"] }, { kind: "component", type: i6.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i7.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i8.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i8.MatLabel, selector: "mat-label" }, { kind: "directive", type: i8.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i8.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i7$1.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: UserEditorComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'auth-jwt-user-editor', template: "<form [formGroup]=\"form\" (submit)=\"save()\">\r\n  <div class=\"form-row\">\r\n    <!-- email -->\r\n    <mat-form-field>\r\n      <mat-label>email</mat-label>\r\n      <input type=\"text\" matInput [formControl]=\"email\" />\r\n      <mat-error\r\n        *ngIf=\"email.hasError('required') && (email.dirty || email.touched)\"\r\n      >\r\n        email address required\r\n      </mat-error>\r\n      <mat-error\r\n        *ngIf=\"email.hasError('pattern') && (email.dirty || email.touched)\"\r\n      >\r\n        invalid email address\r\n      </mat-error>\r\n    </mat-form-field>\r\n\r\n    <!-- emailConfirmed -->\r\n    <mat-checkbox [formControl]=\"emailConfirmed\"\r\n      >email address confirmed</mat-checkbox\r\n    >\r\n  </div>\r\n\r\n  <!-- lockoutEnabled -->\r\n  <div class=\"form-row\">\r\n    <mat-checkbox [formControl]=\"lockoutEnabled\">lockout enabled</mat-checkbox>\r\n    <button\r\n      mat-icon-button\r\n      color=\"primary\"\r\n      (click)=\"endLockout()\"\r\n      [disabled]=\"unlocked\"\r\n      matTooltip=\"Unlock this user if locked\"\r\n    >\r\n      <mat-icon>lock_open</mat-icon>\r\n    </button>\r\n  </div>\r\n\r\n  <div class=\"form-row\">\r\n    <!-- firstName -->\r\n    <mat-form-field>\r\n      <mat-label>first name</mat-label>\r\n      <input type=\"text\" matInput [formControl]=\"firstName\" />\r\n      <mat-error\r\n        *ngIf=\"\r\n          firstName.hasError('required') &&\r\n          (firstName.dirty || firstName.touched)\r\n        \"\r\n      >\r\n        first name required\r\n      </mat-error>\r\n      <mat-error\r\n        *ngIf=\"\r\n          firstName.hasError('maxlength') &&\r\n          (firstName.dirty || firstName.touched)\r\n        \"\r\n      >\r\n        first name too long\r\n      </mat-error>\r\n    </mat-form-field>\r\n\r\n    <!-- lastName -->\r\n    <mat-form-field>\r\n      <mat-label>last name</mat-label>\r\n      <input type=\"text\" matInput [formControl]=\"lastName\" />\r\n      <mat-error\r\n        *ngIf=\"\r\n          lastName.hasError('required') && (lastName.dirty || lastName.touched)\r\n        \"\r\n      >\r\n        last name required\r\n      </mat-error>\r\n      <mat-error\r\n        *ngIf=\"\r\n          lastName.hasError('maxlength') && (lastName.dirty || lastName.touched)\r\n        \"\r\n      >\r\n        last name too long\r\n      </mat-error>\r\n    </mat-form-field>\r\n  </div>\r\n\r\n  <!-- roles -->\r\n  <div>\r\n    <mat-form-field style=\"width: 16em\">\r\n      <mat-label>roles</mat-label>\r\n      <input type=\"text\" matInput [formControl]=\"roles\" />\r\n      <mat-error\r\n        *ngIf=\"roles.hasError('maxlength') && (roles.dirty || roles.touched)\"\r\n      >\r\n        too long\r\n      </mat-error>\r\n      <mat-hint>roles (separated by space)</mat-hint>\r\n    </mat-form-field>\r\n  </div>\r\n\r\n  <!-- buttons -->\r\n  <br />\r\n  <div>\r\n    <button mat-icon-button color=\"warn\" matTooltip=\"Close\" (click)=\"close()\">\r\n      <mat-icon>cancel</mat-icon>\r\n    </button>\r\n    <button\r\n      type=\"submit\"\r\n      mat-icon-button\r\n      color=\"primary\"\r\n      [disabled]=\"form.invalid\"\r\n      matTooltip=\"Save user\"\r\n    >\r\n      <mat-icon>check_circle</mat-icon>\r\n    </button>\r\n  </div>\r\n</form>\r\n", styles: [".form-row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.form-row *{flex:0 0 auto}\n"] }]
-        }], ctorParameters: function () { return [{ type: i1$1.UntypedFormBuilder }, { type: i2$2.AuthJwtService }]; }, propDecorators: { user: [{
-                type: Input
-            }], userChange: [{
-                type: Output
-            }], editorClose: [{
-                type: Output
-            }] } });
-
-class UserListComponent {
-    constructor(_repository, _dialogService, _gravatarService) {
-        this._repository = _repository;
-        this._dialogService = _dialogService;
-        this._gravatarService = _gravatarService;
-        this.pagination$ = _repository.pagination$;
-        this.active$ = _repository.activeUser$;
-        this.loading$ = _repository.loading$;
-    }
-    pageChange(event) {
-        this._repository.loadPage(event.pageIndex + 1, event.pageSize);
-    }
-    deleteUser(user) {
-        this._dialogService
-            .confirm('Confirm', `Delete User ${user.userName}?`)
-            .pipe(take(1))
-            .subscribe((yes) => {
-            if (!yes) {
-                return;
-            }
-            this._repository.deleteUser(user.userName).finally(() => {
-                this._repository.clearCache();
-                this._repository.loadPage(1);
-            });
-        });
-    }
-    setActiveUser(user) {
-        this._repository.setActive(user?.userName || null);
-    }
-    resetActiveUser() {
-        this._repository.setActive(null);
-    }
-    saveActiveUser(user) {
-        this._repository.updateActive(user);
-        this._repository.setActive(null);
-    }
-    onUserEditorClose() {
-        this._repository.setActive(null);
-    }
-    getGravatarUrl(email, size = 80) {
-        return this._gravatarService.buildGravatarUrl(email, size);
-    }
-    clearCache() {
-        this._repository.clearCache();
-        this._repository.loadPage(1);
-    }
-}
-UserListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: UserListComponent, deps: [{ token: UserListRepository }, { token: DialogService }, { token: i2$2.GravatarService }], target: i0.ɵɵFactoryTarget.Component });
-UserListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.4", type: UserListComponent, selector: "auth-jwt-user-list", ngImport: i0, template: "<div id=\"container\">\r\n  <div>\r\n    <!-- filters -->\r\n    <div style=\"grid-area: filters\">\r\n      <auth-jwt-user-filter></auth-jwt-user-filter>\r\n    </div>\r\n\r\n    <!-- list -->\r\n    <div style=\"grid-area: list\" *ngIf=\"pagination$ | async as pagination\">\r\n      <div *ngIf=\"loading$ | async\" gdArea=\"progress\">\r\n        <mat-progress-bar mode=\"indeterminate\"></mat-progress-bar>\r\n      </div>\r\n      <table>\r\n        <thead>\r\n          <td></td>\r\n          <td></td>\r\n          <th>name</th>\r\n          <th class=\"noif-lt-md\">first</th>\r\n          <th class=\"noif-lt-md\">last</th>\r\n          <th class=\"noif-lt-md\">email</th>\r\n          <th>roles</th>\r\n          <th class=\"noif-lt-md\">lock end</th>\r\n        </thead>\r\n        <tbody>\r\n          <tr *ngFor=\"let user of pagination.data\">\r\n            <td>\r\n              <button\r\n                mat-icon-button\r\n                type=\"button\"\r\n                matTooltip=\"Edit {{ user.userName }}\"\r\n                color=\"primary\"\r\n                (click)=\"setActiveUser(user)\"\r\n              >\r\n                <mat-icon>mode_edit</mat-icon>\r\n              </button>\r\n              <button\r\n                mat-icon-button\r\n                type=\"button\"\r\n                matTooltip=\"Delete {{ user.userName }}\"\r\n                color=\"warn\"\r\n                (click)=\"deleteUser(user)\"\r\n              >\r\n                <mat-icon>remove_circle</mat-icon>\r\n              </button>\r\n            </td>\r\n            <td>\r\n              <img\r\n                [src]=\"getGravatarUrl(user.email, 32)\"\r\n                [alt]=\"user.userName\"\r\n              />\r\n            </td>\r\n            <td>{{ user.userName }}</td>\r\n            <td class=\"noif-lt-md\">{{ user.firstName }}</td>\r\n            <td class=\"noif-lt-md\">{{ user.lastName }}</td>\r\n            <td class=\"noif-lt-md\">\r\n              <a [href]=\"'mailto:' + user.email\">{{ user.email }}</a>\r\n            </td>\r\n            <td>{{ user.roles.join(\" \") }}</td>\r\n            <td class=\"noif-lt-md\">{{ user.lockoutEnd }}</td>\r\n          </tr>\r\n        </tbody>\r\n      </table>\r\n\r\n      <!-- paginator -->\r\n      <div style=\"grid-area: paginator; justify-content: end\" class=\"form-row\">\r\n        <button\r\n          type=\"button\"\r\n          mat-icon-button\r\n          color=\"warn\"\r\n          matTooltip=\"Clear items cache\"\r\n          (click)=\"clearCache()\"\r\n        >\r\n          <mat-icon>autorenew</mat-icon>\r\n        </button>\r\n\r\n        <mat-paginator\r\n          gdArea=\"pager\"\r\n          gdAlignColumns=\"center\"\r\n          gdAlignRows=\"start\"\r\n          [length]=\"pagination.total\"\r\n          [pageSize]=\"pagination.perPage\"\r\n          [pageSizeOptions]=\"[20, 50, 75, 100]\"\r\n          [pageIndex]=\"pagination.currentPage - 1\"\r\n          [showFirstLastButtons]=\"true\"\r\n          (page)=\"pageChange($event)\"\r\n        ></mat-paginator>\r\n      </div>\r\n    </div>\r\n  </div>\r\n\r\n  <!-- editor -->\r\n  <mat-expansion-panel style=\"grid-area: editor\"\r\n    [expanded]=\"active$ | async\"\r\n    [disabled]=\"!(active$ | async)\"\r\n  >\r\n    <div *ngIf=\"active$ | async as active\">\r\n      <fieldset>\r\n        <legend>{{ active.userName }}</legend>\r\n        <auth-jwt-user-editor\r\n          [user]=\"active\"\r\n          (userChange)=\"saveActiveUser($event)\"\r\n          (editorClose)=\"resetActiveUser()\"\r\n        ></auth-jwt-user-editor>\r\n      </fieldset>\r\n    </div>\r\n  </mat-expansion-panel>\r\n</div>\r\n", styles: ["tr:nth-child(odd){background-color:#f8f8f8}th{padding:0 8px;text-align:left;color:silver;font-weight:400}td{padding:0 8px}td.command{width:24px}table{width:100%;border-collapse:collapse}fieldset{border:1px solid silver;border-radius:8px;padding:16px}.form-row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.form-row *{flex:0 0 auto}div#container{display:grid;grid-template-rows:auto 1fr auto auto;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));grid-template-areas:\"filters\" \"list\" \"paginator\" \"editor\";gap:8px}@media only screen and (max-width: 959px){.noif-lt-md{display:none}}\n"], dependencies: [{ kind: "directive", type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i5.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i6$1.MatExpansionPanel, selector: "mat-expansion-panel", inputs: ["disabled", "expanded", "hideToggle", "togglePosition"], outputs: ["opened", "closed", "expandedChange", "afterExpand", "afterCollapse"], exportAs: ["matExpansionPanel"] }, { kind: "component", type: i6.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i8$1.MatPaginator, selector: "mat-paginator", inputs: ["disabled"], exportAs: ["matPaginator"] }, { kind: "component", type: i9$1.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }, { kind: "directive", type: i7$1.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "component", type: UserFilterComponent, selector: "auth-jwt-user-filter", inputs: ["disabled"] }, { kind: "component", type: UserEditorComponent, selector: "auth-jwt-user-editor", inputs: ["user"], outputs: ["userChange", "editorClose"] }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: UserListComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'auth-jwt-user-list', template: "<div id=\"container\">\r\n  <div>\r\n    <!-- filters -->\r\n    <div style=\"grid-area: filters\">\r\n      <auth-jwt-user-filter></auth-jwt-user-filter>\r\n    </div>\r\n\r\n    <!-- list -->\r\n    <div style=\"grid-area: list\" *ngIf=\"pagination$ | async as pagination\">\r\n      <div *ngIf=\"loading$ | async\" gdArea=\"progress\">\r\n        <mat-progress-bar mode=\"indeterminate\"></mat-progress-bar>\r\n      </div>\r\n      <table>\r\n        <thead>\r\n          <td></td>\r\n          <td></td>\r\n          <th>name</th>\r\n          <th class=\"noif-lt-md\">first</th>\r\n          <th class=\"noif-lt-md\">last</th>\r\n          <th class=\"noif-lt-md\">email</th>\r\n          <th>roles</th>\r\n          <th class=\"noif-lt-md\">lock end</th>\r\n        </thead>\r\n        <tbody>\r\n          <tr *ngFor=\"let user of pagination.data\">\r\n            <td>\r\n              <button\r\n                mat-icon-button\r\n                type=\"button\"\r\n                matTooltip=\"Edit {{ user.userName }}\"\r\n                color=\"primary\"\r\n                (click)=\"setActiveUser(user)\"\r\n              >\r\n                <mat-icon>mode_edit</mat-icon>\r\n              </button>\r\n              <button\r\n                mat-icon-button\r\n                type=\"button\"\r\n                matTooltip=\"Delete {{ user.userName }}\"\r\n                color=\"warn\"\r\n                (click)=\"deleteUser(user)\"\r\n              >\r\n                <mat-icon>remove_circle</mat-icon>\r\n              </button>\r\n            </td>\r\n            <td>\r\n              <img\r\n                [src]=\"getGravatarUrl(user.email, 32)\"\r\n                [alt]=\"user.userName\"\r\n              />\r\n            </td>\r\n            <td>{{ user.userName }}</td>\r\n            <td class=\"noif-lt-md\">{{ user.firstName }}</td>\r\n            <td class=\"noif-lt-md\">{{ user.lastName }}</td>\r\n            <td class=\"noif-lt-md\">\r\n              <a [href]=\"'mailto:' + user.email\">{{ user.email }}</a>\r\n            </td>\r\n            <td>{{ user.roles.join(\" \") }}</td>\r\n            <td class=\"noif-lt-md\">{{ user.lockoutEnd }}</td>\r\n          </tr>\r\n        </tbody>\r\n      </table>\r\n\r\n      <!-- paginator -->\r\n      <div style=\"grid-area: paginator; justify-content: end\" class=\"form-row\">\r\n        <button\r\n          type=\"button\"\r\n          mat-icon-button\r\n          color=\"warn\"\r\n          matTooltip=\"Clear items cache\"\r\n          (click)=\"clearCache()\"\r\n        >\r\n          <mat-icon>autorenew</mat-icon>\r\n        </button>\r\n\r\n        <mat-paginator\r\n          gdArea=\"pager\"\r\n          gdAlignColumns=\"center\"\r\n          gdAlignRows=\"start\"\r\n          [length]=\"pagination.total\"\r\n          [pageSize]=\"pagination.perPage\"\r\n          [pageSizeOptions]=\"[20, 50, 75, 100]\"\r\n          [pageIndex]=\"pagination.currentPage - 1\"\r\n          [showFirstLastButtons]=\"true\"\r\n          (page)=\"pageChange($event)\"\r\n        ></mat-paginator>\r\n      </div>\r\n    </div>\r\n  </div>\r\n\r\n  <!-- editor -->\r\n  <mat-expansion-panel style=\"grid-area: editor\"\r\n    [expanded]=\"active$ | async\"\r\n    [disabled]=\"!(active$ | async)\"\r\n  >\r\n    <div *ngIf=\"active$ | async as active\">\r\n      <fieldset>\r\n        <legend>{{ active.userName }}</legend>\r\n        <auth-jwt-user-editor\r\n          [user]=\"active\"\r\n          (userChange)=\"saveActiveUser($event)\"\r\n          (editorClose)=\"resetActiveUser()\"\r\n        ></auth-jwt-user-editor>\r\n      </fieldset>\r\n    </div>\r\n  </mat-expansion-panel>\r\n</div>\r\n", styles: ["tr:nth-child(odd){background-color:#f8f8f8}th{padding:0 8px;text-align:left;color:silver;font-weight:400}td{padding:0 8px}td.command{width:24px}table{width:100%;border-collapse:collapse}fieldset{border:1px solid silver;border-radius:8px;padding:16px}.form-row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.form-row *{flex:0 0 auto}div#container{display:grid;grid-template-rows:auto 1fr auto auto;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));grid-template-areas:\"filters\" \"list\" \"paginator\" \"editor\";gap:8px}@media only screen and (max-width: 959px){.noif-lt-md{display:none}}\n"] }]
-        }], ctorParameters: function () { return [{ type: UserListRepository }, { type: DialogService }, { type: i2$2.GravatarService }]; } });
-
-class AuthJwtAdminModule {
-}
-AuthJwtAdminModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: AuthJwtAdminModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-AuthJwtAdminModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.1.4", ngImport: i0, type: AuthJwtAdminModule, declarations: [AuthJwtRegistrationComponent,
-        PasswordStrengthBarComponent,
-        UserFilterComponent,
-        UserListComponent,
-        ConfirmDialogComponent,
-        UserEditorComponent], imports: [CommonModule,
-        HttpClientModule,
-        FormsModule,
-        RouterModule,
-        ReactiveFormsModule,
-        // material
-        MatButtonModule,
-        MatCardModule,
-        MatCheckboxModule,
-        MatDialogModule,
-        MatExpansionModule,
-        MatIconModule,
-        MatInputModule,
-        MatPaginatorModule,
-        MatProgressBarModule,
-        MatProgressSpinnerModule,
-        MatSnackBarModule,
-        MatTooltipModule,
-        AuthJwtLoginModule,
-        NgToolsModule], exports: [AuthJwtRegistrationComponent,
-        PasswordStrengthBarComponent,
-        UserFilterComponent,
-        UserListComponent] });
-AuthJwtAdminModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: AuthJwtAdminModule, imports: [CommonModule,
-        HttpClientModule,
-        FormsModule,
-        RouterModule,
-        ReactiveFormsModule,
-        // material
-        MatButtonModule,
-        MatCardModule,
-        MatCheckboxModule,
-        MatDialogModule,
-        MatExpansionModule,
-        MatIconModule,
-        MatInputModule,
-        MatPaginatorModule,
-        MatProgressBarModule,
-        MatProgressSpinnerModule,
-        MatSnackBarModule,
-        MatTooltipModule,
-        AuthJwtLoginModule,
-        NgToolsModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: AuthJwtAdminModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [
-                        AuthJwtRegistrationComponent,
-                        PasswordStrengthBarComponent,
-                        UserFilterComponent,
-                        UserListComponent,
-                        ConfirmDialogComponent,
-                        UserEditorComponent,
-                    ],
-                    imports: [
-                        CommonModule,
-                        HttpClientModule,
-                        FormsModule,
-                        RouterModule,
-                        ReactiveFormsModule,
-                        // material
-                        MatButtonModule,
-                        MatCardModule,
-                        MatCheckboxModule,
-                        MatDialogModule,
-                        MatExpansionModule,
-                        MatIconModule,
-                        MatInputModule,
-                        MatPaginatorModule,
-                        MatProgressBarModule,
-                        MatProgressSpinnerModule,
-                        MatSnackBarModule,
-                        MatTooltipModule,
-                        AuthJwtLoginModule,
-                        NgToolsModule
-                    ],
-                    exports: [
-                        AuthJwtRegistrationComponent,
-                        PasswordStrengthBarComponent,
-                        UserFilterComponent,
-                        UserListComponent
-                    ],
-                }]
-        }] });
-
-/*
- * Public API Surface of auth-jwt-admin
- */
-
-/**
- * Generated bundle index. Do not edit.
- */
-
-export { AuthJwtAccountService, AuthJwtAdminModule, AuthJwtRegistrationComponent, PasswordStrengthBarComponent, PasswordValidators, UserFilterComponent, UserListComponent, UserListRepository };
-//# sourceMappingURL=myrmidon-auth-jwt-admin.mjs.map