@firestitch/2fa 12.3.5 → 12.4.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.
@@ -9,8 +9,9 @@ export declare class Fs2faVerificationComponent implements OnDestroy, AfterViewI
9
9
  private _cdRef;
10
10
  private _dialog;
11
11
  verificationCodeComponent: Fs2faVerificationCodeComponent;
12
- method: IFsVerificationMethod;
12
+ verificationMethod: IFsVerificationMethod;
13
13
  resend: () => Observable<void>;
14
+ showTrustedDevice: boolean;
14
15
  getVerificationMethods: () => Observable<IFsVerificationMethod[]>;
15
16
  selectVerificationMethod: (verificationMethod: IFsVerificationMethod) => Observable<IFsVerificationMethod>;
16
17
  verified: EventEmitter<unknown>;
@@ -22,11 +23,12 @@ export declare class Fs2faVerificationComponent implements OnDestroy, AfterViewI
22
23
  VerificationMethodType: typeof VerificationMethodType;
23
24
  private _destroy$;
24
25
  constructor(_cdRef: ChangeDetectorRef, _dialog: FsDialog);
26
+ get recipient(): string;
25
27
  ngOnInit(): void;
26
28
  ngOnDestroy(): void;
27
29
  ngAfterViewInit(): void;
28
30
  resendCode(): void;
29
31
  showVerificationMethods(): void;
30
32
  static ɵfac: i0.ɵɵFactoryDeclaration<Fs2faVerificationComponent, never>;
31
- static ɵcmp: i0.ɵɵComponentDeclaration<Fs2faVerificationComponent, "fs-2fa-verification", never, { "method": "method"; "resend": "resend"; "getVerificationMethods": "getVerificationMethods"; "selectVerificationMethod": "selectVerificationMethod"; }, { "verified": "verified"; "codeChanged": "codeChanged"; "codeCompleted": "codeCompleted"; }, never, never>;
33
+ static ɵcmp: i0.ɵɵComponentDeclaration<Fs2faVerificationComponent, "fs-2fa-verification", never, { "verificationMethod": "verificationMethod"; "resend": "resend"; "showTrustedDevice": "showTrustedDevice"; "getVerificationMethods": "getVerificationMethods"; "selectVerificationMethod": "selectVerificationMethod"; }, { "verified": "verified"; "codeChanged": "codeChanged"; "codeCompleted": "codeCompleted"; }, never, never>;
32
34
  }
@@ -1,11 +1,11 @@
1
1
  import { EventEmitter } from '@angular/core';
2
2
  import { CodeInputComponent } from '../../../../modules/code-input/components/code-input';
3
3
  import { VerificationMethodType } from '../../../../enums/verification-method-type.enum';
4
- import { IFsVerificationMethod } from '../../../../interfaces/verification-method.interface';
5
4
  import * as i0 from "@angular/core";
6
5
  export declare class Fs2faVerificationCodeComponent {
7
6
  codeInputComponent: CodeInputComponent;
8
- method: IFsVerificationMethod;
7
+ type: VerificationMethodType;
8
+ recipient: string;
9
9
  code: any;
10
10
  codeChanged: EventEmitter<string>;
11
11
  codeCompleted: EventEmitter<void>;
@@ -13,5 +13,5 @@ export declare class Fs2faVerificationCodeComponent {
13
13
  codeChange(code: any): void;
14
14
  focus(): void;
15
15
  static ɵfac: i0.ɵɵFactoryDeclaration<Fs2faVerificationCodeComponent, never>;
16
- static ɵcmp: i0.ɵɵComponentDeclaration<Fs2faVerificationCodeComponent, "fs-2fa-verification-code", never, { "method": "method"; "code": "code"; }, { "codeChanged": "codeChanged"; "codeCompleted": "codeCompleted"; }, never, never>;
16
+ static ɵcmp: i0.ɵɵComponentDeclaration<Fs2faVerificationCodeComponent, "fs-2fa-verification-code", never, { "type": "type"; "recipient": "recipient"; "code": "code"; }, { "codeChanged": "codeChanged"; "codeCompleted": "codeCompleted"; }, never, never>;
17
17
  }
@@ -6,7 +6,7 @@ import * as i0 from "@angular/core";
6
6
  export declare class Fs2faVerificationMethodsComponent {
7
7
  private _dialogData;
8
8
  private _dialogRef;
9
- method: IFsVerificationMethod;
9
+ verificationMethod: IFsVerificationMethod;
10
10
  phone: string;
11
11
  code: string;
12
12
  verificationMethods: Record<string, IFsVerificationMethod[]>;
@@ -60,7 +60,7 @@
60
60
  this._dialogRef = _dialogRef;
61
61
  this.verificationMethodType = exports.VerificationMethodType;
62
62
  this.setVerificationMethod = function () {
63
- return _this._selectVerificationMethod(_this.method)
63
+ return _this._selectVerificationMethod(_this.verificationMethod)
64
64
  .pipe(operators.tap(function (method) {
65
65
  _this._dialogRef.close(method);
66
66
  }));
@@ -74,7 +74,7 @@
74
74
  };
75
75
  Fs2faVerificationMethodsComponent.prototype._setActiveMethod = function () {
76
76
  var _a;
77
- this.method = (_a = this._dialogData) === null || _a === void 0 ? void 0 : _a.method;
77
+ this.verificationMethod = (_a = this._dialogData) === null || _a === void 0 ? void 0 : _a.verificationMethod;
78
78
  };
79
79
  Fs2faVerificationMethodsComponent.prototype._initMethods = function (verificationMethods) {
80
80
  this.verificationMethods = verificationMethods
@@ -89,7 +89,7 @@
89
89
  return Fs2faVerificationMethodsComponent;
90
90
  }());
91
91
  Fs2faVerificationMethodsComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: Fs2faVerificationMethodsComponent, deps: [{ token: i1.MAT_DIALOG_DATA }, { token: i1__namespace.MatDialogRef }], target: i0__namespace.ɵɵFactoryTarget.Component });
92
- Fs2faVerificationMethodsComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: Fs2faVerificationMethodsComponent, selector: "ng-component", ngImport: i0__namespace, template: "<fs-dialog>\n <h1 mat-dialog-title>\n Verification Methods\n </h1>\n <form fsForm [submit]=\"setVerificationMethod\" [dirtySubmitButton]=\"false\">\n <mat-dialog-content>\n <ng-container>\n <fs-radio-group [(ngModel)]=\"method\" name=\"method\" [compareWith]=\"compareWith\">\n <ng-container *ngFor=\"let methodMap of verificationMethods | keyvalue\">\n <div class=\"method\">\n <ng-container [ngSwitch]=\"methodMap.key\">\n <ng-container *ngSwitchCase=\"verificationMethodType.Sms\">\n <div class=\"method-header\">\n <div class=\"method-icon\">\n <mat-icon>\n textsms\n </mat-icon>\n </div>\n <div class=\"method-name\">\n <div class=\"method-title\">Text Message</div>\n <div class=\"method-subtitle\">\n Verification code send to one of following mobile number\n </div>\n </div>\n </div>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"verificationMethodType.Email\">\n <div class=\"method-header\">\n <div class=\"method-icon\">\n <mat-icon>\n mail\n </mat-icon>\n </div>\n <div class=\"method-name\">\n <div class=\"method-title\">Email</div>\n <div class=\"method-subtitle\">\n Verification code send to one of following email\n </div>\n </div>\n </div>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"verificationMethodType.App\">\n <div class=\"method-header\">\n <div class=\"method-icon\">\n <mat-icon>\n phone_iphone\n </mat-icon>\n </div>\n <div class=\"method-name\">\n <div class=\"method-title\">Authenticator App</div>\n <div class=\"method-subtitle\">\n Verification code generated by an authenticator app\n </div>\n </div>\n </div>\n </ng-container> \n </ng-container>\n\n <mat-radio-button class=\"method-item\" *ngFor=\"let method of methodMap.value\" [value]=\"method\">\n <ng-container [ngSwitch]=\"methodMap.key\">\n <ng-container *ngSwitchCase=\"verificationMethodType.Sms\">\n {{ method.phoneNumber }}\n </ng-container>\n <ng-container *ngSwitchCase=\"verificationMethodType.Email\">\n {{ method.email }}\n </ng-container>\n <ng-container *ngSwitchCase=\"verificationMethodType.App\">\n Authenticator App\n </ng-container> \n </ng-container>\n </mat-radio-button>\n </div>\n </ng-container>\n </fs-radio-group>\n </ng-container>\n </mat-dialog-content>\n <mat-dialog-actions>\n <div class=\"actions\">\n <button mat-button type=\"submit\" color=\"primary\">Next</button>\n <button mat-button type=\"button\" [mat-dialog-close]=\"null\">Cancel</button>\n </div>\n </mat-dialog-actions>\n </form>\n</fs-dialog>\n", styles: [".method{display:block;margin-bottom:20px}.method .method-header{display:flex;align-items:flex-start}.method .method-header .method-name{margin-left:10px}.method .method-header .method-name .method-title{font-size:14px;font-weight:400}.method .method-header .method-name .method-subtitle{font-size:12px;color:#a3a3a3}.method .method-item{display:block;margin:10px 0 0 35px}\n"], components: [{ type: i3__namespace.FsDialogComponent, selector: "fs-dialog", inputs: ["mobileMode"] }, { type: i3__namespace$1.FsRadioGroupComponent, selector: "fs-radio-group", inputs: ["orientation", "label", "name", "disabled", "radioPosition", "compareWith", "required"] }, { type: i4__namespace.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i5__namespace.MatRadioButton, selector: "mat-radio-button", inputs: ["disableRipple", "tabIndex"], exportAs: ["matRadioButton"] }, { type: i7__namespace.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }], directives: [{ type: i1__namespace.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { type: i8__namespace.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i8__namespace.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i8__namespace.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i9__namespace.FsFormDirective, selector: "[fsForm]", inputs: ["wrapperSelector", "messageSelector", "hintSelector", "labelSelector", "autocomplete", "shortcuts", "confirm", "confirmDialog", "confirmDrawer", "confirmBrowser", "confirmTabs", "dirtySubmitButton", "submit", "successDelay", "errorDelay", "tabGroup"], outputs: ["fsForm", "invalid", "valid", "submitted", "reseted", "cleared"] }, { type: i1__namespace.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { type: i8__namespace.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i8__namespace.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i9__namespace$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i9__namespace$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i9__namespace$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i1__namespace.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }, { type: i9__namespace.FsSubmitButtonDirective, selector: "button[type=\"submit\"]", inputs: ["name", "dirtySubmit"] }, { type: i1__namespace.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["type", "mat-dialog-close", "aria-label", "matDialogClose"], exportAs: ["matDialogClose"] }], pipes: { "keyvalue": i9__namespace$1.KeyValuePipe }, changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
92
+ Fs2faVerificationMethodsComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: Fs2faVerificationMethodsComponent, selector: "ng-component", ngImport: i0__namespace, template: "<fs-dialog>\n <h1 mat-dialog-title>\n Verification Methods\n </h1>\n <form fsForm [submit]=\"setVerificationMethod\" [dirtySubmitButton]=\"false\">\n <mat-dialog-content>\n <ng-container>\n <fs-radio-group [(ngModel)]=\"verificationMethod\" name=\"method\" [compareWith]=\"compareWith\">\n <ng-container *ngFor=\"let methodMap of verificationMethods | keyvalue\">\n <div class=\"method\">\n <ng-container [ngSwitch]=\"methodMap.key\">\n <ng-container *ngSwitchCase=\"verificationMethodType.Sms\">\n <div class=\"method-header\">\n <div class=\"method-icon\">\n <mat-icon>\n textsms\n </mat-icon>\n </div>\n <div class=\"method-name\">\n <div class=\"method-title\">Text Message</div>\n <div class=\"method-subtitle\">\n Verification code send to one of following mobile number\n </div>\n </div>\n </div>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"verificationMethodType.Email\">\n <div class=\"method-header\">\n <div class=\"method-icon\">\n <mat-icon>\n mail\n </mat-icon>\n </div>\n <div class=\"method-name\">\n <div class=\"method-title\">Email</div>\n <div class=\"method-subtitle\">\n Verification code send to one of following email\n </div>\n </div>\n </div>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"verificationMethodType.App\">\n <div class=\"method-header\">\n <div class=\"method-icon\">\n <mat-icon>\n phone_iphone\n </mat-icon>\n </div>\n <div class=\"method-name\">\n <div class=\"method-title\">Authenticator App</div>\n <div class=\"method-subtitle\">\n Verification code generated by an authenticator app\n </div>\n </div>\n </div>\n </ng-container> \n </ng-container>\n\n <mat-radio-button class=\"method-item\" *ngFor=\"let method of methodMap.value\" [value]=\"method\">\n <ng-container [ngSwitch]=\"methodMap.key\">\n <ng-container *ngSwitchCase=\"verificationMethodType.Sms\">\n {{ method.phoneNumber }}\n </ng-container>\n <ng-container *ngSwitchCase=\"verificationMethodType.Email\">\n {{ method.email }}\n </ng-container>\n <ng-container *ngSwitchCase=\"verificationMethodType.App\">\n Authenticator App\n </ng-container> \n </ng-container>\n </mat-radio-button>\n </div>\n </ng-container>\n </fs-radio-group>\n </ng-container>\n </mat-dialog-content>\n <mat-dialog-actions>\n <div class=\"actions\">\n <button mat-button type=\"submit\" color=\"primary\">Next</button>\n <button mat-button type=\"button\" [mat-dialog-close]=\"null\">Cancel</button>\n </div>\n </mat-dialog-actions>\n </form>\n</fs-dialog>\n", styles: [".method{display:block;margin-bottom:20px}.method .method-header{display:flex;align-items:flex-start}.method .method-header .method-name{margin-left:10px}.method .method-header .method-name .method-title{font-size:14px;font-weight:400}.method .method-header .method-name .method-subtitle{font-size:12px;color:#a3a3a3}.method .method-item{display:block;margin:10px 0 0 35px}\n"], components: [{ type: i3__namespace.FsDialogComponent, selector: "fs-dialog", inputs: ["mobileMode"] }, { type: i3__namespace$1.FsRadioGroupComponent, selector: "fs-radio-group", inputs: ["orientation", "label", "name", "disabled", "radioPosition", "compareWith", "required"] }, { type: i4__namespace.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i5__namespace.MatRadioButton, selector: "mat-radio-button", inputs: ["disableRipple", "tabIndex"], exportAs: ["matRadioButton"] }, { type: i7__namespace.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }], directives: [{ type: i1__namespace.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { type: i8__namespace.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i8__namespace.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i8__namespace.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i9__namespace.FsFormDirective, selector: "[fsForm]", inputs: ["wrapperSelector", "messageSelector", "hintSelector", "labelSelector", "autocomplete", "shortcuts", "confirm", "confirmDialog", "confirmDrawer", "confirmBrowser", "confirmTabs", "dirtySubmitButton", "submit", "successDelay", "errorDelay", "tabGroup"], outputs: ["fsForm", "invalid", "valid", "submitted", "reseted", "cleared"] }, { type: i1__namespace.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { type: i8__namespace.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i8__namespace.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i9__namespace$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i9__namespace$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i9__namespace$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i1__namespace.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }, { type: i9__namespace.FsSubmitButtonDirective, selector: "button[type=\"submit\"]", inputs: ["name", "dirtySubmit"] }, { type: i1__namespace.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["type", "mat-dialog-close", "aria-label", "matDialogClose"], exportAs: ["matDialogClose"] }], pipes: { "keyvalue": i9__namespace$1.KeyValuePipe }, changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
93
93
  i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: Fs2faVerificationMethodsComponent, decorators: [{
94
94
  type: i0.Component,
95
95
  args: [{
@@ -155,7 +155,7 @@
155
155
  return Fs2faVerificationCodeComponent;
156
156
  }());
157
157
  Fs2faVerificationCodeComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: Fs2faVerificationCodeComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
158
- Fs2faVerificationCodeComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: Fs2faVerificationCodeComponent, selector: "fs-2fa-verification-code", inputs: { method: "method", code: "code" }, outputs: { codeChanged: "codeChanged", codeCompleted: "codeCompleted" }, viewQueries: [{ propertyName: "codeInputComponent", first: true, predicate: CodeInputComponent, descendants: true }], ngImport: i0__namespace, template: "<ng-container *ngIf=\"method.phoneNumber && method.type === VerificationMethodType.Sms\">\n <p class=\"description\">\n A text message with a verification code was just\n sent to <span style=\"white-space: nowrap;\">{{ method.phoneNumber }}</span> to verify it's you.\n </p>\n\n <ng-container *ngTemplateOutlet=\"input\"></ng-container>\n</ng-container>\n\n<ng-container *ngIf=\"method.type === VerificationMethodType.Email\">\n <p class=\"description\">\n A email with a verification code was just sent to {{ method.email }} to verify it's you.\n </p>\n <ng-container *ngTemplateOutlet=\"input\"></ng-container>\n</ng-container>\n\n<ng-container *ngIf=\"method.type === VerificationMethodType.App\">\n <p class=\"description\">\n Enter the verification code generated by your 2 factor authenticator app to verify it's you.\n </p>\n <ng-container *ngTemplateOutlet=\"input\"></ng-container>\n</ng-container>\n\n<ng-template #input> \n <app-code-input \n [code]=\"code\"\n (codeChanged)=\"codeChange($event)\"\n (codeCompleted)=\"codeCompleted.emit()\">\n </app-code-input> \n</ng-template> ", styles: ["mat-form-field{width:100%}mat-form-field ::ng-deep .mat-form-field-subscript-wrapper{min-height:unset!important}mat-form-field ::ng-deep .mat-form-field-subscript-wrapper .fs-form-error{padding-bottom:5px}app-code-input{margin-bottom:5px}\n"], components: [{ type: CodeInputComponent, selector: "app-code-input", inputs: ["codeLength", "code"], outputs: ["codeCompleted", "codeChanged"] }], directives: [{ type: i9__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i9__namespace$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }], viewProviders: [
158
+ Fs2faVerificationCodeComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: Fs2faVerificationCodeComponent, selector: "fs-2fa-verification-code", inputs: { type: "type", recipient: "recipient", code: "code" }, outputs: { codeChanged: "codeChanged", codeCompleted: "codeCompleted" }, viewQueries: [{ propertyName: "codeInputComponent", first: true, predicate: CodeInputComponent, descendants: true }], ngImport: i0__namespace, template: "<ng-container *ngIf=\"type === VerificationMethodType.Sms\">\n <p class=\"description\">\n A text message with a verification code was just\n sent to <span style=\"white-space: nowrap;\">{{ recipient }}</span> to verify it's you.\n </p>\n\n <ng-container *ngTemplateOutlet=\"input\"></ng-container>\n</ng-container>\n\n<ng-container *ngIf=\"type === VerificationMethodType.Email\">\n <p class=\"description\">\n A email with a verification code was just sent to {{ recipient }} to verify it's you.\n </p>\n <ng-container *ngTemplateOutlet=\"input\"></ng-container>\n</ng-container>\n\n<ng-container *ngIf=\"type === VerificationMethodType.App\">\n <p class=\"description\">\n Enter the verification code generated by your 2 factor authenticator app to verify it's you.\n </p>\n <ng-container *ngTemplateOutlet=\"input\"></ng-container>\n</ng-container>\n\n<ng-template #input> \n <app-code-input \n [code]=\"code\"\n (codeChanged)=\"codeChange($event)\"\n (codeCompleted)=\"codeCompleted.emit()\">\n </app-code-input> \n</ng-template> ", styles: ["mat-form-field{width:100%}mat-form-field ::ng-deep .mat-form-field-subscript-wrapper{min-height:unset!important}mat-form-field ::ng-deep .mat-form-field-subscript-wrapper .fs-form-error{padding-bottom:5px}app-code-input{margin-bottom:5px}\n"], components: [{ type: CodeInputComponent, selector: "app-code-input", inputs: ["codeLength", "code"], outputs: ["codeCompleted", "codeChanged"] }], directives: [{ type: i9__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i9__namespace$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }], viewProviders: [
159
159
  {
160
160
  provide: i8.ControlContainer,
161
161
  useExisting: i8.NgForm,
@@ -180,7 +180,9 @@
180
180
  }], propDecorators: { codeInputComponent: [{
181
181
  type: i0.ViewChild,
182
182
  args: [CodeInputComponent]
183
- }], method: [{
183
+ }], type: [{
184
+ type: i0.Input
185
+ }], recipient: [{
184
186
  type: i0.Input
185
187
  }], code: [{
186
188
  type: i0.Input
@@ -194,6 +196,7 @@
194
196
  function Fs2faVerificationComponent(_cdRef, _dialog) {
195
197
  this._cdRef = _cdRef;
196
198
  this._dialog = _dialog;
199
+ this.showTrustedDevice = true;
197
200
  this.verified = new i0.EventEmitter();
198
201
  this.codeChanged = new i0.EventEmitter();
199
202
  this.codeCompleted = new i0.EventEmitter();
@@ -203,6 +206,18 @@
203
206
  this.VerificationMethodType = exports.VerificationMethodType;
204
207
  this._destroy$ = new rxjs.Subject();
205
208
  }
209
+ Object.defineProperty(Fs2faVerificationComponent.prototype, "recipient", {
210
+ get: function () {
211
+ if (this.verificationMethod.type === exports.VerificationMethodType.Email) {
212
+ return this.verificationMethod.email;
213
+ }
214
+ if (this.verificationMethod.type === exports.VerificationMethodType.Sms) {
215
+ return this.verificationMethod.phoneNumber;
216
+ }
217
+ },
218
+ enumerable: false,
219
+ configurable: true
220
+ });
206
221
  Fs2faVerificationComponent.prototype.ngOnInit = function () {
207
222
  var _this = this;
208
223
  this.codeChanged
@@ -236,15 +251,15 @@
236
251
  .subscribe(function (verificationMethods) {
237
252
  _this._dialog.open(Fs2faVerificationMethodsComponent, {
238
253
  data: {
239
- method: _this.method,
254
+ verificationMethod: _this.verificationMethod,
240
255
  verificationMethods: verificationMethods,
241
256
  selectVerificationMethod: _this.selectVerificationMethod,
242
257
  }
243
258
  })
244
259
  .afterClosed()
245
- .pipe(operators.filter(function (method) { return !!method; }))
246
- .subscribe(function (method) {
247
- _this.method = method;
260
+ .pipe(operators.filter(function (verificationMethod) { return !!verificationMethod; }))
261
+ .subscribe(function (verificationMethod) {
262
+ _this.verificationMethod = verificationMethod;
248
263
  _this.code = '';
249
264
  _this._cdRef.markForCheck();
250
265
  setTimeout(function () {
@@ -256,7 +271,7 @@
256
271
  return Fs2faVerificationComponent;
257
272
  }());
258
273
  Fs2faVerificationComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: Fs2faVerificationComponent, deps: [{ token: i0__namespace.ChangeDetectorRef }, { token: i3__namespace.FsDialog }], target: i0__namespace.ɵɵFactoryTarget.Component });
259
- Fs2faVerificationComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: Fs2faVerificationComponent, selector: "fs-2fa-verification", inputs: { method: "method", resend: "resend", getVerificationMethods: "getVerificationMethods", selectVerificationMethod: "selectVerificationMethod" }, outputs: { verified: "verified", codeChanged: "codeChanged", codeCompleted: "codeCompleted" }, viewQueries: [{ propertyName: "verificationCodeComponent", first: true, predicate: Fs2faVerificationCodeComponent, descendants: true }], ngImport: i0__namespace, template: "<div class=\"code-container\">\n <fs-2fa-verification-code\n [method]=\"method\"\n [code]=\"code\"\n (codeChanged)=\"codeChanged.emit($event)\"\n (codeCompleted)=\"codeCompleted.emit()\">\n </fs-2fa-verification-code>\n</div>\n\n<div class=\"additional\">\n <mat-checkbox\n name=\"trust-device\"\n [(ngModel)]=\"trustedDevice\">\n Trust this device\n </mat-checkbox>\n\n <span class=\"resend-code-btn\">\n <ng-container *ngIf=\"!resendInProgress else sending\">\n <a (click)=\"resendCode()\">\n Resend Code\n </a>\n </ng-container>\n <ng-template #sending>\n <mat-spinner [diameter]=\"12\"></mat-spinner> Sending\n </ng-template>\n </span>\n</div>", styles: [".code-container{text-align:center}.additional{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:10px}.additional .resend-code-btn{cursor:pointer;text-transform:none}.additional .resend-code-btn mat-spinner{display:inline-block;vertical-align:middle}\n"], components: [{ type: Fs2faVerificationCodeComponent, selector: "fs-2fa-verification-code", inputs: ["method", "code"], outputs: ["codeChanged", "codeCompleted"] }, { type: i3__namespace$2.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex", "aria-label", "aria-labelledby", "id", "labelPosition", "name", "required", "checked", "disabled", "indeterminate", "aria-describedby", "value"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { type: i4__namespace$1.MatSpinner, selector: "mat-spinner", inputs: ["color"] }], directives: [{ type: i8__namespace.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i8__namespace.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i9__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
274
+ Fs2faVerificationComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: Fs2faVerificationComponent, selector: "fs-2fa-verification", inputs: { verificationMethod: "verificationMethod", resend: "resend", showTrustedDevice: "showTrustedDevice", getVerificationMethods: "getVerificationMethods", selectVerificationMethod: "selectVerificationMethod" }, outputs: { verified: "verified", codeChanged: "codeChanged", codeCompleted: "codeCompleted" }, viewQueries: [{ propertyName: "verificationCodeComponent", first: true, predicate: Fs2faVerificationCodeComponent, descendants: true }], ngImport: i0__namespace, template: "<div class=\"code-container\">\n <fs-2fa-verification-code\n [recipient]=\"recipient\"\n [type]=\"verificationMethod.type\"\n [code]=\"code\"\n (codeChanged)=\"codeChanged.emit($event)\"\n (codeCompleted)=\"codeCompleted.emit()\">\n </fs-2fa-verification-code>\n</div>\n\n<div class=\"additional\">\n <mat-checkbox\n *ngIf=\"showTrustedDevice\"\n name=\"trust-device\"\n [(ngModel)]=\"trustedDevice\">\n Trust this device\n </mat-checkbox>\n\n <span class=\"resend-code-btn\">\n <ng-container *ngIf=\"!resendInProgress else sending\">\n <a (click)=\"resendCode()\">\n Resend Code\n </a>\n </ng-container>\n <ng-template #sending>\n <mat-spinner [diameter]=\"12\"></mat-spinner> Sending\n </ng-template>\n </span>\n</div>", styles: [".code-container{text-align:center}.additional{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:10px}.additional .resend-code-btn{cursor:pointer;text-transform:none}.additional .resend-code-btn mat-spinner{display:inline-block;vertical-align:middle}\n"], components: [{ type: Fs2faVerificationCodeComponent, selector: "fs-2fa-verification-code", inputs: ["type", "recipient", "code"], outputs: ["codeChanged", "codeCompleted"] }, { type: i3__namespace$2.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex", "aria-label", "aria-labelledby", "id", "labelPosition", "name", "required", "checked", "disabled", "indeterminate", "aria-describedby", "value"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { type: i4__namespace$1.MatSpinner, selector: "mat-spinner", inputs: ["color"] }], directives: [{ type: i9__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i8__namespace.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i8__namespace.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
260
275
  i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: Fs2faVerificationComponent, decorators: [{
261
276
  type: i0.Component,
262
277
  args: [{
@@ -270,10 +285,12 @@
270
285
  }], ctorParameters: function () { return [{ type: i0__namespace.ChangeDetectorRef }, { type: i3__namespace.FsDialog }]; }, propDecorators: { verificationCodeComponent: [{
271
286
  type: i0.ViewChild,
272
287
  args: [Fs2faVerificationCodeComponent]
273
- }], method: [{
288
+ }], verificationMethod: [{
274
289
  type: i0.Input
275
290
  }], resend: [{
276
291
  type: i0.Input
292
+ }], showTrustedDevice: [{
293
+ type: i0.Input
277
294
  }], getVerificationMethods: [{
278
295
  type: i0.Input
279
296
  }], selectVerificationMethod: [{