@aws-amplify/ui-angular 5.0.39 → 5.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -53,7 +53,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
53
53
  }]
54
54
  }] });
55
55
 
56
- const VERSION = '5.0.39';
56
+ const VERSION = '5.1.0';
57
57
 
58
58
  const logger$1 = new ConsoleLogger('state-machine');
59
59
  /**
@@ -544,10 +544,10 @@ class FormFieldComponent {
544
544
  }
545
545
  }
546
546
  FormFieldComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FormFieldComponent, deps: [{ token: AuthenticatorService }], target: i0.ɵɵFactoryTarget.Component });
547
- FormFieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FormFieldComponent, selector: "amplify-form-field", inputs: { name: "name", formField: "formField" }, ngImport: i0, template: "<div class=\"amplify-flex amplify-field amplify-authenticator__column\">\n <!-- Country code field -->\n <amplify-phone-number-field\n *ngIf=\"isPhoneField()\"\n [name]=\"name\"\n [label]=\"formField.label\"\n [defaultCountryCode]=\"formField.dialCode\"\n [dialCodeList]=\"formField.dialCodeList\"\n [placeholder]=\"formField.placeholder\"\n [required]=\"formField.isRequired\"\n [labelHidden]=\"formField.labelHidden\"\n [autocomplete]=\"formField.autocomplete\"\n [hasError]=\"hasError\"\n [describedBy]=\"ariaDescribedBy\"\n type=\"tel\"\n ></amplify-phone-number-field>\n\n <amplify-password-field\n *ngIf=\"isPasswordField()\"\n [name]=\"name\"\n [label]=\"formField.label\"\n [placeholder]=\"formField.placeholder\"\n [required]=\"formField.isRequired\"\n [labelHidden]=\"formField.labelHidden\"\n [autocomplete]=\"formField.autocomplete\"\n [hasError]=\"hasError\"\n [describedBy]=\"ariaDescribedBy\"\n (setBlur)=\"onBlur($event)\"\n ></amplify-password-field>\n\n <amplify-text-field\n *ngIf=\"!isPasswordField() && !isPhoneField()\"\n [name]=\"name\"\n [label]=\"formField.label\"\n [placeholder]=\"formField.placeholder\"\n [required]=\"formField.isRequired\"\n [labelHidden]=\"formField.labelHidden\"\n [autocomplete]=\"formField.autocomplete\"\n [type]=\"formField.type\"\n [hasError]=\"hasError\"\n [describedBy]=\"ariaDescribedBy\"\n ></amplify-text-field>\n\n <div data-amplify-sign-up-errors *ngIf=\"hasError()\" [id]=\"errorId\">\n <div\n class=\"amplify-text amplify-text--error\"\n data-variation=\"error\"\n *ngFor=\"let error of errors\"\n >\n {{ translate(error) }}\n </div>\n </div>\n</div>\n", dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: PasswordFieldComponent, selector: "amplify-password-field", inputs: ["autocomplete", "disabled", "fieldId", "initialValue", "label", "name", "placeholder", "required", "labelHidden", "hasError", "describedBy"], outputs: ["setBlur"] }, { kind: "component", type: PhoneNumberFieldComponent, selector: "amplify-phone-number-field", inputs: ["autocomplete", "disabled", "defaultCountryCode", "selectFieldId", "textFieldId", "initialValue", "label", "name", "placeholder", "required", "type", "labelHidden", "dialCodeList", "hasError", "describedBy"] }, { kind: "component", type: TextFieldComponent, selector: "amplify-text-field", inputs: ["autocomplete", "disabled", "fieldId", "initialValue", "label", "name", "placeholder", "required", "type", "labelHidden", "hasError", "describedBy"] }] });
547
+ FormFieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FormFieldComponent, selector: "amplify-form-field", inputs: { name: "name", formField: "formField" }, ngImport: i0, template: "<div class=\"amplify-flex amplify-field amplify-authenticator__column\">\n <!-- Country code field -->\n <amplify-phone-number-field\n *ngIf=\"isPhoneField()\"\n [name]=\"name\"\n [label]=\"formField.label\"\n [defaultCountryCode]=\"formField.dialCode\"\n [dialCodeList]=\"formField.dialCodeList\"\n [placeholder]=\"formField.placeholder\"\n [required]=\"formField.isRequired\"\n [labelHidden]=\"formField.labelHidden\"\n [autocomplete]=\"formField.autocomplete\"\n [hasError]=\"hasError\"\n [describedBy]=\"ariaDescribedBy\"\n type=\"tel\"\n ></amplify-phone-number-field>\n\n <amplify-password-field\n *ngIf=\"isPasswordField()\"\n [name]=\"name\"\n [label]=\"formField.label\"\n [placeholder]=\"formField.placeholder\"\n [required]=\"formField.isRequired\"\n [labelHidden]=\"formField.labelHidden\"\n [autocomplete]=\"formField.autocomplete\"\n [hasError]=\"hasError\"\n [describedBy]=\"ariaDescribedBy\"\n (setBlur)=\"onBlur($event)\"\n ></amplify-password-field>\n\n <amplify-text-field\n *ngIf=\"!isPasswordField() && !isPhoneField()\"\n [name]=\"name\"\n [label]=\"formField.label\"\n [placeholder]=\"formField.placeholder\"\n [required]=\"formField.isRequired\"\n [labelHidden]=\"formField.labelHidden\"\n [autocomplete]=\"formField.autocomplete\"\n [type]=\"formField.type\"\n [hasError]=\"hasError\"\n [describedBy]=\"ariaDescribedBy\"\n ></amplify-text-field>\n\n <div\n data-amplify-sign-up-errors\n *ngIf=\"hasError()\"\n [id]=\"errorId\"\n >\n <div\n class=\"amplify-text amplify-text--error\"\n data-variation=\"error\"\n *ngFor=\"let error of errors\"\n >\n {{ translate(error) }}\n </div>\n </div>\n</div>", dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: PasswordFieldComponent, selector: "amplify-password-field", inputs: ["autocomplete", "disabled", "fieldId", "initialValue", "label", "name", "placeholder", "required", "labelHidden", "hasError", "describedBy"], outputs: ["setBlur"] }, { kind: "component", type: PhoneNumberFieldComponent, selector: "amplify-phone-number-field", inputs: ["autocomplete", "disabled", "defaultCountryCode", "selectFieldId", "textFieldId", "initialValue", "label", "name", "placeholder", "required", "type", "labelHidden", "dialCodeList", "hasError", "describedBy"] }, { kind: "component", type: TextFieldComponent, selector: "amplify-text-field", inputs: ["autocomplete", "disabled", "fieldId", "initialValue", "label", "name", "placeholder", "required", "type", "labelHidden", "hasError", "describedBy"] }] });
548
548
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FormFieldComponent, decorators: [{
549
549
  type: Component,
550
- args: [{ selector: 'amplify-form-field', template: "<div class=\"amplify-flex amplify-field amplify-authenticator__column\">\n <!-- Country code field -->\n <amplify-phone-number-field\n *ngIf=\"isPhoneField()\"\n [name]=\"name\"\n [label]=\"formField.label\"\n [defaultCountryCode]=\"formField.dialCode\"\n [dialCodeList]=\"formField.dialCodeList\"\n [placeholder]=\"formField.placeholder\"\n [required]=\"formField.isRequired\"\n [labelHidden]=\"formField.labelHidden\"\n [autocomplete]=\"formField.autocomplete\"\n [hasError]=\"hasError\"\n [describedBy]=\"ariaDescribedBy\"\n type=\"tel\"\n ></amplify-phone-number-field>\n\n <amplify-password-field\n *ngIf=\"isPasswordField()\"\n [name]=\"name\"\n [label]=\"formField.label\"\n [placeholder]=\"formField.placeholder\"\n [required]=\"formField.isRequired\"\n [labelHidden]=\"formField.labelHidden\"\n [autocomplete]=\"formField.autocomplete\"\n [hasError]=\"hasError\"\n [describedBy]=\"ariaDescribedBy\"\n (setBlur)=\"onBlur($event)\"\n ></amplify-password-field>\n\n <amplify-text-field\n *ngIf=\"!isPasswordField() && !isPhoneField()\"\n [name]=\"name\"\n [label]=\"formField.label\"\n [placeholder]=\"formField.placeholder\"\n [required]=\"formField.isRequired\"\n [labelHidden]=\"formField.labelHidden\"\n [autocomplete]=\"formField.autocomplete\"\n [type]=\"formField.type\"\n [hasError]=\"hasError\"\n [describedBy]=\"ariaDescribedBy\"\n ></amplify-text-field>\n\n <div data-amplify-sign-up-errors *ngIf=\"hasError()\" [id]=\"errorId\">\n <div\n class=\"amplify-text amplify-text--error\"\n data-variation=\"error\"\n *ngFor=\"let error of errors\"\n >\n {{ translate(error) }}\n </div>\n </div>\n</div>\n" }]
550
+ args: [{ selector: 'amplify-form-field', template: "<div class=\"amplify-flex amplify-field amplify-authenticator__column\">\n <!-- Country code field -->\n <amplify-phone-number-field\n *ngIf=\"isPhoneField()\"\n [name]=\"name\"\n [label]=\"formField.label\"\n [defaultCountryCode]=\"formField.dialCode\"\n [dialCodeList]=\"formField.dialCodeList\"\n [placeholder]=\"formField.placeholder\"\n [required]=\"formField.isRequired\"\n [labelHidden]=\"formField.labelHidden\"\n [autocomplete]=\"formField.autocomplete\"\n [hasError]=\"hasError\"\n [describedBy]=\"ariaDescribedBy\"\n type=\"tel\"\n ></amplify-phone-number-field>\n\n <amplify-password-field\n *ngIf=\"isPasswordField()\"\n [name]=\"name\"\n [label]=\"formField.label\"\n [placeholder]=\"formField.placeholder\"\n [required]=\"formField.isRequired\"\n [labelHidden]=\"formField.labelHidden\"\n [autocomplete]=\"formField.autocomplete\"\n [hasError]=\"hasError\"\n [describedBy]=\"ariaDescribedBy\"\n (setBlur)=\"onBlur($event)\"\n ></amplify-password-field>\n\n <amplify-text-field\n *ngIf=\"!isPasswordField() && !isPhoneField()\"\n [name]=\"name\"\n [label]=\"formField.label\"\n [placeholder]=\"formField.placeholder\"\n [required]=\"formField.isRequired\"\n [labelHidden]=\"formField.labelHidden\"\n [autocomplete]=\"formField.autocomplete\"\n [type]=\"formField.type\"\n [hasError]=\"hasError\"\n [describedBy]=\"ariaDescribedBy\"\n ></amplify-text-field>\n\n <div\n data-amplify-sign-up-errors\n *ngIf=\"hasError()\"\n [id]=\"errorId\"\n >\n <div\n class=\"amplify-text amplify-text--error\"\n data-variation=\"error\"\n *ngFor=\"let error of errors\"\n >\n {{ translate(error) }}\n </div>\n </div>\n</div>" }]
551
551
  }], ctorParameters: function () { return [{ type: AuthenticatorService }]; }, propDecorators: { name: [{
552
552
  type: Input
553
553
  }], formField: [{
@@ -596,14 +596,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
596
596
  args: [{ selector: 'amplify-error', template: "<div\n class=\"amplify-flex amplify-alert amplify-alert--error\"\n data-variation=\"error\"\n style=\"align-items: center; justify-content: space-between\"\n *ngIf=\"isVisible\"\n role=\"alert\"\n>\n <div class=\"amplify-flex\" style=\"align-items: center\">\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n class=\"amplify-icon\"\n [attr.aria-hidden]=\"true\"\n viewBox=\"0 0 24 24\"\n fill=\"currentColor\"\n >\n <path\n d=\"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-2h2v2zm0-4h-2V7h2v6z\"\n ></path>\n </svg>\n <div><ng-content></ng-content></div>\n </div>\n <button\n amplify-button\n [attr.aria-label]=\"dismissAriaLabel\"\n variation=\"link\"\n [fullWidth]=\"false\"\n (click)=\"close()\"\n >\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n class=\"amplify-icon\"\n [attr.aria-hidden]=\"true\"\n viewBox=\"0 0 24 24\"\n fill=\"currentColor\"\n >\n <path\n d=\"M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z\"\n ></path>\n </svg>\n </button>\n</div>\n" }]
597
597
  }] });
598
598
 
599
- const { getBackToSignInText: getBackToSignInText$4, getResendCodeText: getResendCodeText$1, getSubmitText: getSubmitText$1, getResetYourPasswordText: getResetYourPasswordText$1, } = authenticatorTextUtil;
599
+ const { getBackToSignInText: getBackToSignInText$6, getResendCodeText: getResendCodeText$1, getSubmitText: getSubmitText$1, getResetYourPasswordText: getResetYourPasswordText$1, } = authenticatorTextUtil;
600
600
  class ConfirmResetPasswordComponent {
601
601
  constructor(authenticator) {
602
602
  this.authenticator = authenticator;
603
603
  this.dataAttr = '';
604
604
  this.headerText = getResetYourPasswordText$1();
605
605
  // translated strings
606
- this.backToSignInText = getBackToSignInText$4();
606
+ this.backToSignInText = getBackToSignInText$6();
607
607
  this.resendCodeText = getResendCodeText$1();
608
608
  this.submitText = getSubmitText$1();
609
609
  }
@@ -632,13 +632,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
632
632
  type: Input
633
633
  }] } });
634
634
 
635
- const { getConfirmText: getConfirmText$2, getBackToSignInText: getBackToSignInText$3, getChallengeText } = authenticatorTextUtil;
635
+ const { getConfirmText: getConfirmText$4, getBackToSignInText: getBackToSignInText$5, getChallengeText } = authenticatorTextUtil;
636
636
  class ConfirmSignInComponent {
637
637
  constructor(authenticator) {
638
638
  this.authenticator = authenticator;
639
639
  this.dataAttr = '';
640
- this.confirmText = getConfirmText$2();
641
- this.backToSignInText = getBackToSignInText$3();
640
+ this.confirmText = getConfirmText$4();
641
+ this.backToSignInText = getBackToSignInText$5();
642
642
  }
643
643
  get context() {
644
644
  return this.authenticator.slotContext;
@@ -672,14 +672,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
672
672
  args: ['attr.data-amplify-authenticator-confirmsignin']
673
673
  }] } });
674
674
 
675
- const { getResendCodeText, getConfirmText: getConfirmText$1, getDeliveryMethodText, getDeliveryMessageText, } = authenticatorTextUtil;
675
+ const { getResendCodeText, getConfirmText: getConfirmText$3, getDeliveryMethodText, getDeliveryMessageText, } = authenticatorTextUtil;
676
676
  class ConfirmSignUpComponent {
677
677
  constructor(authenticator) {
678
678
  this.authenticator = authenticator;
679
679
  this.dataAttr = '';
680
680
  // translated texts
681
681
  this.resendCodeText = getResendCodeText();
682
- this.confirmText = getConfirmText$1();
682
+ this.confirmText = getConfirmText$3();
683
683
  }
684
684
  get context() {
685
685
  return this.authenticator.slotContext;
@@ -756,7 +756,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
756
756
  args: [{ selector: 'amplify-force-new-password-form-fields', template: "<div class=\"amplify-flex amplify-authenticator__column\" data-amplify-fieldset>\n <amplify-base-form-fields route=\"forceNewPassword\"></amplify-base-form-fields>\n</div>\n" }]
757
757
  }] });
758
758
 
759
- const { getChangePasswordText, getBackToSignInText: getBackToSignInText$2 } = authenticatorTextUtil;
759
+ const { getChangePasswordText, getBackToSignInText: getBackToSignInText$4 } = authenticatorTextUtil;
760
760
  class ForceNewPasswordComponent {
761
761
  constructor(authenticator) {
762
762
  this.authenticator = authenticator;
@@ -764,7 +764,7 @@ class ForceNewPasswordComponent {
764
764
  this.headerText = getChangePasswordText();
765
765
  // translated texts
766
766
  this.changePasswordText = getChangePasswordText();
767
- this.backToSignInText = getBackToSignInText$2();
767
+ this.backToSignInText = getBackToSignInText$4();
768
768
  }
769
769
  get context() {
770
770
  return this.authenticator.slotContext;
@@ -791,7 +791,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
791
791
  type: Input
792
792
  }] } });
793
793
 
794
- const { getResetYourPasswordText, getSendCodeText, getBackToSignInText: getBackToSignInText$1 } = authenticatorTextUtil;
794
+ const { getResetYourPasswordText, getSendCodeText, getBackToSignInText: getBackToSignInText$3 } = authenticatorTextUtil;
795
795
  class ForgotPasswordComponent {
796
796
  constructor(authenticator) {
797
797
  this.authenticator = authenticator;
@@ -799,7 +799,7 @@ class ForgotPasswordComponent {
799
799
  this.headerText = getResetYourPasswordText();
800
800
  // translated texts
801
801
  this.sendCodeText = getSendCodeText();
802
- this.backToSignInText = getBackToSignInText$1();
802
+ this.backToSignInText = getBackToSignInText$3();
803
803
  }
804
804
  get context() {
805
805
  return this.authenticator.slotContext;
@@ -826,6 +826,80 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
826
826
  type: Input
827
827
  }] } });
828
828
 
829
+ const { getConfirmText: getConfirmText$2, getBackToSignInText: getBackToSignInText$2, getSelectMfaTypeText, getSelectMfaTypeByChallengeName, getMfaTypeLabelByValue, } = authenticatorTextUtil;
830
+ class SelectMfaTypeComponent {
831
+ constructor(authenticator) {
832
+ this.authenticator = authenticator;
833
+ this.confirmText = getConfirmText$2();
834
+ this.backToSignInText = getBackToSignInText$2();
835
+ this.selectMfaTypeText = getSelectMfaTypeText();
836
+ this.getMfaTypeLabelByValue = getMfaTypeLabelByValue;
837
+ this.allowedMfaTypes = [];
838
+ this.classNames = classNames;
839
+ this.ComponentClassName = ComponentClassName;
840
+ }
841
+ get context() {
842
+ return this.authenticator.slotContext;
843
+ }
844
+ ngOnInit() {
845
+ this.setHeaderText();
846
+ this.setAllowedMfaTypes();
847
+ }
848
+ setHeaderText() {
849
+ const actorContext = getActorContext(this.authenticator.authState);
850
+ this.headerText = getSelectMfaTypeByChallengeName(actorContext.challengeName);
851
+ }
852
+ setAllowedMfaTypes() {
853
+ const actorContext = getActorContext(this.authenticator.authState);
854
+ this.allowedMfaTypes = actorContext.allowedMfaTypes;
855
+ }
856
+ onInput(event) {
857
+ event.preventDefault();
858
+ const { name, value } = event.target;
859
+ this.authenticator.updateForm({ name, value });
860
+ }
861
+ onSubmit(event) {
862
+ event.preventDefault();
863
+ this.authenticator.submitForm(getFormDataFromEvent(event));
864
+ }
865
+ }
866
+ SelectMfaTypeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SelectMfaTypeComponent, deps: [{ token: AuthenticatorService }], target: i0.ɵɵFactoryTarget.Component });
867
+ SelectMfaTypeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: SelectMfaTypeComponent, selector: "amplify-select-mfa-type", ngImport: i0, template: "<form\n data-amplify-form\n data-amplify-authenticator-select-mfa-type\n (submit)=\"onSubmit($event)\"\n (input)=\"onInput($event)\"\n>\n <fieldset\n [class]=\"classNames(ComponentClassName.Flex, 'amplify-authenticator__column')\"\n data-amplify-fieldset\n [disabled]=\"authenticator.isPending\"\n >\n <amplify-slot\n name=\"select-mfa-type-header\"\n [context]=\"context\"\n >\n <h3 [class]=\"classNames(ComponentClassName.Heading, 'amplify-heading--3')\">{{ headerText }}</h3>\n </amplify-slot>\n <div\n *ngFor=\"let mfaType of allowedMfaTypes; index as i\"\n [class]=\"classNames(ComponentClassName.Flex, ComponentClassName.Field, ComponentClassName.RadioGroupField)\"\n role=\"radiogroup\"\n >\n <label\n [class]=\"classNames(ComponentClassName.Flex, ComponentClassName.Radio)\"\n [attr.data-amplify-radio-control-label]\n >\n <span [class]=\"classNames(ComponentClassName.Text, ComponentClassName.RadioLabel)\">\n {{getMfaTypeLabelByValue(mfaType)}}\n </span>\n <input\n [class]=\"classNames(ComponentClassName.Input, ComponentClassName.FieldGroupControl, ComponentClassName.VisuallyHidden, ComponentClassName.RadioInput)\"\n [attr.data-amplify-radio-control-input]\n [value]=\"mfaType\"\n [checked]=\"i === 0\"\n name=\"mfa_type\"\n type=\"radio\"\n required\n />\n <span\n [class]=\"classNames(ComponentClassName.Flex, ComponentClassName.RadioButton)\"\n [attr.aria-hidden]=\"true\"\n ></span>\n </label>\n </div>\n <button\n amplify-button\n variation=\"primary\"\n fullWidth=\"true\"\n type=\"submit\"\n [isDisabled]=\"authenticator.isPending\"\n >\n {{ confirmText }}\n </button>\n <button\n amplify-button\n size=\"small\"\n variation=\"link\"\n fontWeight=\"normal\"\n fullWidth=\"true\"\n (click)=\"authenticator.toSignIn()\"\n >\n {{ backToSignInText }}\n </button>\n <amplify-error *ngIf=\"authenticator.error\">\n {{ authenticator.error }}\n </amplify-error>\n </fieldset>\n <amplify-slot\n name=\"select-mfa-type-footer\"\n [context]=\"context\"\n ></amplify-slot>\n</form>", dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: AmplifySlotComponent, selector: "amplify-slot", inputs: ["name", "context"] }, { kind: "component", type: ButtonComponent, selector: "button[amplify-button]", inputs: ["type", "fullWidth", "isDisabled", "size", "variation", "fontWeight"] }, { kind: "component", type: ErrorComponent, selector: "amplify-error" }] });
868
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SelectMfaTypeComponent, decorators: [{
869
+ type: Component,
870
+ args: [{ selector: 'amplify-select-mfa-type', template: "<form\n data-amplify-form\n data-amplify-authenticator-select-mfa-type\n (submit)=\"onSubmit($event)\"\n (input)=\"onInput($event)\"\n>\n <fieldset\n [class]=\"classNames(ComponentClassName.Flex, 'amplify-authenticator__column')\"\n data-amplify-fieldset\n [disabled]=\"authenticator.isPending\"\n >\n <amplify-slot\n name=\"select-mfa-type-header\"\n [context]=\"context\"\n >\n <h3 [class]=\"classNames(ComponentClassName.Heading, 'amplify-heading--3')\">{{ headerText }}</h3>\n </amplify-slot>\n <div\n *ngFor=\"let mfaType of allowedMfaTypes; index as i\"\n [class]=\"classNames(ComponentClassName.Flex, ComponentClassName.Field, ComponentClassName.RadioGroupField)\"\n role=\"radiogroup\"\n >\n <label\n [class]=\"classNames(ComponentClassName.Flex, ComponentClassName.Radio)\"\n [attr.data-amplify-radio-control-label]\n >\n <span [class]=\"classNames(ComponentClassName.Text, ComponentClassName.RadioLabel)\">\n {{getMfaTypeLabelByValue(mfaType)}}\n </span>\n <input\n [class]=\"classNames(ComponentClassName.Input, ComponentClassName.FieldGroupControl, ComponentClassName.VisuallyHidden, ComponentClassName.RadioInput)\"\n [attr.data-amplify-radio-control-input]\n [value]=\"mfaType\"\n [checked]=\"i === 0\"\n name=\"mfa_type\"\n type=\"radio\"\n required\n />\n <span\n [class]=\"classNames(ComponentClassName.Flex, ComponentClassName.RadioButton)\"\n [attr.aria-hidden]=\"true\"\n ></span>\n </label>\n </div>\n <button\n amplify-button\n variation=\"primary\"\n fullWidth=\"true\"\n type=\"submit\"\n [isDisabled]=\"authenticator.isPending\"\n >\n {{ confirmText }}\n </button>\n <button\n amplify-button\n size=\"small\"\n variation=\"link\"\n fontWeight=\"normal\"\n fullWidth=\"true\"\n (click)=\"authenticator.toSignIn()\"\n >\n {{ backToSignInText }}\n </button>\n <amplify-error *ngIf=\"authenticator.error\">\n {{ authenticator.error }}\n </amplify-error>\n </fieldset>\n <amplify-slot\n name=\"select-mfa-type-footer\"\n [context]=\"context\"\n ></amplify-slot>\n</form>" }]
871
+ }], ctorParameters: function () { return [{ type: AuthenticatorService }]; } });
872
+
873
+ const { getConfirmText: getConfirmText$1, getBackToSignInText: getBackToSignInText$1, getSetupEmailText } = authenticatorTextUtil;
874
+ class SetupEmailComponent {
875
+ constructor(authenticator) {
876
+ this.authenticator = authenticator;
877
+ this.headerText = getSetupEmailText();
878
+ this.confirmText = getConfirmText$1();
879
+ this.backToSignInText = getBackToSignInText$1();
880
+ this.classNames = classNames;
881
+ this.ComponentClassName = ComponentClassName;
882
+ }
883
+ get context() {
884
+ return this.authenticator.slotContext;
885
+ }
886
+ onInput(event) {
887
+ event.preventDefault();
888
+ const { name, value } = event.target;
889
+ this.authenticator.updateForm({ name, value });
890
+ }
891
+ onSubmit(event) {
892
+ event.preventDefault();
893
+ this.authenticator.submitForm(getFormDataFromEvent(event));
894
+ }
895
+ }
896
+ SetupEmailComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SetupEmailComponent, deps: [{ token: AuthenticatorService }], target: i0.ɵɵFactoryTarget.Component });
897
+ SetupEmailComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: SetupEmailComponent, selector: "amplify-setup-email", ngImport: i0, template: "<form\n data-amplify-form\n data-amplify-authenticator-setup-email\n (submit)=\"onSubmit($event)\"\n (input)=\"onInput($event)\"\n>\n <fieldset\n [class]=\"classNames(ComponentClassName.Flex, 'amplify-authenticator__column')\"\n data-amplify-fieldset\n [disabled]=\"authenticator.isPending\"\n >\n <amplify-slot\n name=\"setup-email-header\"\n [context]=\"context\"\n >\n <h3 [class]=\"classNames(ComponentClassName.Heading, 'amplify-heading--3')\">{{ headerText }}</h3>\n </amplify-slot>\n <amplify-base-form-fields route=\"setupEmail\"></amplify-base-form-fields>\n\n <button\n amplify-button\n variation=\"primary\"\n fullWidth=\"true\"\n type=\"submit\"\n [isDisabled]=\"authenticator.isPending\"\n >\n {{ confirmText }}\n </button>\n <button\n amplify-button\n size=\"small\"\n variation=\"link\"\n fontWeight=\"normal\"\n fullWidth=\"true\"\n (click)=\"authenticator.toSignIn()\"\n >\n {{ backToSignInText }}\n </button>\n <amplify-error *ngIf=\"authenticator.error\">\n {{ authenticator.error }}\n </amplify-error>\n </fieldset>\n <amplify-slot\n name=\"setup-email-footer\"\n [context]=\"context\"\n ></amplify-slot>\n</form>", dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: AmplifySlotComponent, selector: "amplify-slot", inputs: ["name", "context"] }, { kind: "component", type: BaseFormFieldsComponent, selector: "amplify-base-form-fields", inputs: ["route"] }, { kind: "component", type: ButtonComponent, selector: "button[amplify-button]", inputs: ["type", "fullWidth", "isDisabled", "size", "variation", "fontWeight"] }, { kind: "component", type: ErrorComponent, selector: "amplify-error" }] });
898
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SetupEmailComponent, decorators: [{
899
+ type: Component,
900
+ args: [{ selector: 'amplify-setup-email', template: "<form\n data-amplify-form\n data-amplify-authenticator-setup-email\n (submit)=\"onSubmit($event)\"\n (input)=\"onInput($event)\"\n>\n <fieldset\n [class]=\"classNames(ComponentClassName.Flex, 'amplify-authenticator__column')\"\n data-amplify-fieldset\n [disabled]=\"authenticator.isPending\"\n >\n <amplify-slot\n name=\"setup-email-header\"\n [context]=\"context\"\n >\n <h3 [class]=\"classNames(ComponentClassName.Heading, 'amplify-heading--3')\">{{ headerText }}</h3>\n </amplify-slot>\n <amplify-base-form-fields route=\"setupEmail\"></amplify-base-form-fields>\n\n <button\n amplify-button\n variation=\"primary\"\n fullWidth=\"true\"\n type=\"submit\"\n [isDisabled]=\"authenticator.isPending\"\n >\n {{ confirmText }}\n </button>\n <button\n amplify-button\n size=\"small\"\n variation=\"link\"\n fontWeight=\"normal\"\n fullWidth=\"true\"\n (click)=\"authenticator.toSignIn()\"\n >\n {{ backToSignInText }}\n </button>\n <amplify-error *ngIf=\"authenticator.error\">\n {{ authenticator.error }}\n </amplify-error>\n </fieldset>\n <amplify-slot\n name=\"setup-email-footer\"\n [context]=\"context\"\n ></amplify-slot>\n</form>" }]
901
+ }], ctorParameters: function () { return [{ type: AuthenticatorService }]; } });
902
+
829
903
  const logger = new ConsoleLogger('SetupTotp');
830
904
  const { getSetupTotpText, getCopyText, getBackToSignInText, getConfirmText, getCopiedText, } = authenticatorTextUtil;
831
905
  class SetupTotpComponent {
@@ -1270,10 +1344,10 @@ class AuthenticatorComponent {
1270
1344
  }
1271
1345
  }
1272
1346
  AuthenticatorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: AuthenticatorComponent, deps: [{ token: AuthenticatorService }, { token: CustomComponentsService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
1273
- AuthenticatorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: AuthenticatorComponent, selector: "amplify-authenticator", inputs: { formFields: "formFields", initialState: "initialState", loginMechanisms: "loginMechanisms", services: "services", signUpAttributes: "signUpAttributes", socialProviders: "socialProviders", variation: "variation", hideSignUp: "hideSignUp" }, providers: [CustomComponentsService], queries: [{ propertyName: "customComponentQuery", predicate: AmplifySlotDirective }], ngImport: i0, template: "<div\n data-amplify-authenticator\n [attr.data-variation]=\"variation\"\n *ngIf=\"hasRouteComponent()\"\n>\n <div data-amplify-container>\n <amplify-slot name=\"header\" [context]=\"context\"></amplify-slot>\n <div\n data-amplify-router\n [attr.data-amplify-router-content]=\"hasTabs() ? undefined : ''\"\n >\n <amplify-tabs\n (tabChange)=\"onTabChange()\"\n *ngIf=\"(route === 'signIn' || route === 'signUp') && !hideSignUp\"\n >\n <amplify-tab-item\n [title]=\"signInTitle\"\n [active]=\"route === 'signIn'\"\n data-amplify-router-content\n >\n <!-- signIn component -->\n <amplify-slot\n name=\"sign-in\"\n [context]=\"context\"\n *ngIf=\"route === 'signIn'\"\n >\n <amplify-sign-in></amplify-sign-in>\n </amplify-slot>\n </amplify-tab-item>\n <amplify-tab-item\n [title]=\"signUpTitle\"\n [active]=\"route === 'signUp'\"\n data-amplify-router-content\n >\n <!-- signUp component -->\n <amplify-slot\n name=\"sign-up\"\n [context]=\"context\"\n *ngIf=\"route === 'signUp'\"\n >\n <amplify-sign-up></amplify-sign-up>\n </amplify-slot>\n </amplify-tab-item>\n </amplify-tabs>\n\n <amplify-slot\n name=\"sign-in\"\n [context]=\"context\"\n *ngIf=\"route === 'signIn' && hideSignUp\"\n >\n <amplify-sign-in></amplify-sign-in>\n </amplify-slot>\n\n <!-- confirmSignUp content -->\n <amplify-slot\n name=\"confirm-sign-up\"\n [context]=\"context\"\n *ngIf=\"route === 'confirmSignUp'\"\n >\n <amplify-confirm-sign-up></amplify-confirm-sign-up>\n </amplify-slot>\n\n <!-- confirmSignIn content -->\n <amplify-slot\n name=\"confirm-sign-in\"\n [context]=\"context\"\n *ngIf=\"route === 'confirmSignIn'\"\n >\n <amplify-confirm-sign-in></amplify-confirm-sign-in>\n </amplify-slot>\n\n <!-- setupTotp content -->\n <amplify-slot\n name=\"setup-totp\"\n [context]=\"context\"\n *ngIf=\"route === 'setupTotp'\"\n >\n <amplify-setup-totp></amplify-setup-totp>\n </amplify-slot>\n\n <!-- forceNewPassword content -->\n <amplify-slot\n name=\"force-new-password\"\n [context]=\"context\"\n *ngIf=\"route === 'forceNewPassword'\"\n >\n <amplify-force-new-password></amplify-force-new-password>\n </amplify-slot>\n\n <!-- forgotPassword content -->\n <amplify-slot\n name=\"forgot-password\"\n [context]=\"context\"\n *ngIf=\"route === 'forgotPassword'\"\n >\n <amplify-forgot-password></amplify-forgot-password>\n </amplify-slot>\n\n <!-- confirmResetPassword content -->\n <amplify-slot\n name=\"confirm-reset-password\"\n [context]=\"context\"\n *ngIf=\"route === 'confirmResetPassword'\"\n >\n <amplify-confirm-reset-password></amplify-confirm-reset-password>\n </amplify-slot>\n\n <!-- verifyUser content -->\n <amplify-slot\n name=\"verify-user\"\n [context]=\"context\"\n *ngIf=\"route === 'verifyUser'\"\n >\n <amplify-verify-user></amplify-verify-user>\n </amplify-slot>\n\n <!-- confirmVerifyUser content -->\n <amplify-slot\n name=\"confirm-verify-user\"\n [context]=\"context\"\n *ngIf=\"route === 'confirmVerifyUser'\"\n >\n <amplify-confirm-verify-user></amplify-confirm-verify-user>\n </amplify-slot>\n </div>\n\n <amplify-slot name=\"footer\" [context]=\"context\"></amplify-slot>\n </div>\n</div>\n\n<!-- signedIn content is rendered outside authenticator so it's not styled by authenticator -->\n<amplify-slot\n name=\"authenticated\"\n [context]=\"context\"\n *ngIf=\"route === 'authenticated'\"\n>\n <ng-content></ng-content>\n</amplify-slot>\n", dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: AmplifySlotComponent, selector: "amplify-slot", inputs: ["name", "context"] }, { kind: "component", type: ConfirmResetPasswordComponent, selector: "amplify-confirm-reset-password", inputs: ["headerText"] }, { kind: "component", type: ConfirmSignInComponent, selector: "amplify-confirm-sign-in" }, { kind: "component", type: ConfirmSignUpComponent, selector: "amplify-confirm-sign-up" }, { kind: "component", type: ConfirmVerifyUserComponent, selector: "amplify-confirm-verify-user", inputs: ["headerText"] }, { kind: "component", type: ForceNewPasswordComponent, selector: "amplify-force-new-password", inputs: ["headerText"] }, { kind: "component", type: ForgotPasswordComponent, selector: "amplify-forgot-password", inputs: ["headerText"] }, { kind: "component", type: SetupTotpComponent, selector: "amplify-setup-totp" }, { kind: "component", type: SignInComponent, selector: "amplify-sign-in" }, { kind: "component", type: SignUpComponent, selector: "amplify-sign-up" }, { kind: "component", type: TabItemComponent, selector: "amplify-tab-item", inputs: ["title", "active", "id", "labelledById", "tabIndex"] }, { kind: "component", type: TabsComponent, selector: "amplify-tabs", outputs: ["tabChange"] }, { kind: "component", type: VerifyUserComponent, selector: "amplify-verify-user", inputs: ["headerText"] }], encapsulation: i0.ViewEncapsulation.None });
1347
+ AuthenticatorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: AuthenticatorComponent, selector: "amplify-authenticator", inputs: { formFields: "formFields", initialState: "initialState", loginMechanisms: "loginMechanisms", services: "services", signUpAttributes: "signUpAttributes", socialProviders: "socialProviders", variation: "variation", hideSignUp: "hideSignUp" }, providers: [CustomComponentsService], queries: [{ propertyName: "customComponentQuery", predicate: AmplifySlotDirective }], ngImport: i0, template: "<div\n data-amplify-authenticator\n [attr.data-variation]=\"variation\"\n *ngIf=\"hasRouteComponent()\"\n>\n <div data-amplify-container>\n <amplify-slot\n name=\"header\"\n [context]=\"context\"\n ></amplify-slot>\n <div\n data-amplify-router\n [attr.data-amplify-router-content]=\"hasTabs() ? undefined : ''\"\n >\n <amplify-tabs\n (tabChange)=\"onTabChange()\"\n *ngIf=\"(route === 'signIn' || route === 'signUp') && !hideSignUp\"\n >\n <amplify-tab-item\n [title]=\"signInTitle\"\n [active]=\"route === 'signIn'\"\n data-amplify-router-content\n >\n <!-- signIn component -->\n <amplify-slot\n name=\"sign-in\"\n [context]=\"context\"\n *ngIf=\"route === 'signIn'\"\n >\n <amplify-sign-in></amplify-sign-in>\n </amplify-slot>\n </amplify-tab-item>\n <amplify-tab-item\n [title]=\"signUpTitle\"\n [active]=\"route === 'signUp'\"\n data-amplify-router-content\n >\n <!-- signUp component -->\n <amplify-slot\n name=\"sign-up\"\n [context]=\"context\"\n *ngIf=\"route === 'signUp'\"\n >\n <amplify-sign-up></amplify-sign-up>\n </amplify-slot>\n </amplify-tab-item>\n </amplify-tabs>\n\n <amplify-slot\n name=\"sign-in\"\n [context]=\"context\"\n *ngIf=\"route === 'signIn' && hideSignUp\"\n >\n <amplify-sign-in></amplify-sign-in>\n </amplify-slot>\n\n <!-- confirmSignUp content -->\n <amplify-slot\n name=\"confirm-sign-up\"\n [context]=\"context\"\n *ngIf=\"route === 'confirmSignUp'\"\n >\n <amplify-confirm-sign-up></amplify-confirm-sign-up>\n </amplify-slot>\n\n <!-- confirmSignIn content -->\n <amplify-slot\n name=\"confirm-sign-in\"\n [context]=\"context\"\n *ngIf=\"route === 'confirmSignIn'\"\n >\n <amplify-confirm-sign-in></amplify-confirm-sign-in>\n </amplify-slot>\n\n <!-- setupTotp content -->\n <amplify-slot\n name=\"setup-totp\"\n [context]=\"context\"\n *ngIf=\"route === 'setupTotp'\"\n >\n <amplify-setup-totp></amplify-setup-totp>\n </amplify-slot>\n\n <!-- forceNewPassword content -->\n <amplify-slot\n name=\"force-new-password\"\n [context]=\"context\"\n *ngIf=\"route === 'forceNewPassword'\"\n >\n <amplify-force-new-password></amplify-force-new-password>\n </amplify-slot>\n\n <!-- forgotPassword content -->\n <amplify-slot\n name=\"forgot-password\"\n [context]=\"context\"\n *ngIf=\"route === 'forgotPassword'\"\n >\n <amplify-forgot-password></amplify-forgot-password>\n </amplify-slot>\n\n <!-- confirmResetPassword content -->\n <amplify-slot\n name=\"confirm-reset-password\"\n [context]=\"context\"\n *ngIf=\"route === 'confirmResetPassword'\"\n >\n <amplify-confirm-reset-password></amplify-confirm-reset-password>\n </amplify-slot>\n\n <!-- verifyUser content -->\n <amplify-slot\n name=\"verify-user\"\n [context]=\"context\"\n *ngIf=\"route === 'verifyUser'\"\n >\n <amplify-verify-user></amplify-verify-user>\n </amplify-slot>\n\n <!-- confirmVerifyUser content -->\n <amplify-slot\n name=\"confirm-verify-user\"\n [context]=\"context\"\n *ngIf=\"route === 'confirmVerifyUser'\"\n >\n <amplify-confirm-verify-user></amplify-confirm-verify-user>\n </amplify-slot>\n\n <!-- selectMfaType content -->\n <amplify-slot\n name=\"select-mfa-type\"\n [context]=\"context\"\n *ngIf=\"route === 'selectMfaType'\"\n >\n <amplify-select-mfa-type></amplify-select-mfa-type>\n </amplify-slot>\n\n <!-- setupEmail content -->\n <amplify-slot\n name=\"setup-email\"\n [context]=\"context\"\n *ngIf=\"route === 'setupEmail'\"\n >\n <amplify-setup-email></amplify-setup-email>\n </amplify-slot>\n </div>\n\n <amplify-slot\n name=\"footer\"\n [context]=\"context\"\n ></amplify-slot>\n </div>\n</div>\n\n<!-- signedIn content is rendered outside authenticator so it's not styled by authenticator -->\n<amplify-slot\n name=\"authenticated\"\n [context]=\"context\"\n *ngIf=\"route === 'authenticated'\"\n>\n <ng-content></ng-content>\n</amplify-slot>", dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: AmplifySlotComponent, selector: "amplify-slot", inputs: ["name", "context"] }, { kind: "component", type: ConfirmResetPasswordComponent, selector: "amplify-confirm-reset-password", inputs: ["headerText"] }, { kind: "component", type: ConfirmSignInComponent, selector: "amplify-confirm-sign-in" }, { kind: "component", type: ConfirmSignUpComponent, selector: "amplify-confirm-sign-up" }, { kind: "component", type: ConfirmVerifyUserComponent, selector: "amplify-confirm-verify-user", inputs: ["headerText"] }, { kind: "component", type: ForceNewPasswordComponent, selector: "amplify-force-new-password", inputs: ["headerText"] }, { kind: "component", type: ForgotPasswordComponent, selector: "amplify-forgot-password", inputs: ["headerText"] }, { kind: "component", type: SelectMfaTypeComponent, selector: "amplify-select-mfa-type" }, { kind: "component", type: SetupEmailComponent, selector: "amplify-setup-email" }, { kind: "component", type: SetupTotpComponent, selector: "amplify-setup-totp" }, { kind: "component", type: SignInComponent, selector: "amplify-sign-in" }, { kind: "component", type: SignUpComponent, selector: "amplify-sign-up" }, { kind: "component", type: TabItemComponent, selector: "amplify-tab-item", inputs: ["title", "active", "id", "labelledById", "tabIndex"] }, { kind: "component", type: TabsComponent, selector: "amplify-tabs", outputs: ["tabChange"] }, { kind: "component", type: VerifyUserComponent, selector: "amplify-verify-user", inputs: ["headerText"] }], encapsulation: i0.ViewEncapsulation.None });
1274
1348
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: AuthenticatorComponent, decorators: [{
1275
1349
  type: Component,
1276
- args: [{ selector: 'amplify-authenticator', providers: [CustomComponentsService], encapsulation: ViewEncapsulation.None, template: "<div\n data-amplify-authenticator\n [attr.data-variation]=\"variation\"\n *ngIf=\"hasRouteComponent()\"\n>\n <div data-amplify-container>\n <amplify-slot name=\"header\" [context]=\"context\"></amplify-slot>\n <div\n data-amplify-router\n [attr.data-amplify-router-content]=\"hasTabs() ? undefined : ''\"\n >\n <amplify-tabs\n (tabChange)=\"onTabChange()\"\n *ngIf=\"(route === 'signIn' || route === 'signUp') && !hideSignUp\"\n >\n <amplify-tab-item\n [title]=\"signInTitle\"\n [active]=\"route === 'signIn'\"\n data-amplify-router-content\n >\n <!-- signIn component -->\n <amplify-slot\n name=\"sign-in\"\n [context]=\"context\"\n *ngIf=\"route === 'signIn'\"\n >\n <amplify-sign-in></amplify-sign-in>\n </amplify-slot>\n </amplify-tab-item>\n <amplify-tab-item\n [title]=\"signUpTitle\"\n [active]=\"route === 'signUp'\"\n data-amplify-router-content\n >\n <!-- signUp component -->\n <amplify-slot\n name=\"sign-up\"\n [context]=\"context\"\n *ngIf=\"route === 'signUp'\"\n >\n <amplify-sign-up></amplify-sign-up>\n </amplify-slot>\n </amplify-tab-item>\n </amplify-tabs>\n\n <amplify-slot\n name=\"sign-in\"\n [context]=\"context\"\n *ngIf=\"route === 'signIn' && hideSignUp\"\n >\n <amplify-sign-in></amplify-sign-in>\n </amplify-slot>\n\n <!-- confirmSignUp content -->\n <amplify-slot\n name=\"confirm-sign-up\"\n [context]=\"context\"\n *ngIf=\"route === 'confirmSignUp'\"\n >\n <amplify-confirm-sign-up></amplify-confirm-sign-up>\n </amplify-slot>\n\n <!-- confirmSignIn content -->\n <amplify-slot\n name=\"confirm-sign-in\"\n [context]=\"context\"\n *ngIf=\"route === 'confirmSignIn'\"\n >\n <amplify-confirm-sign-in></amplify-confirm-sign-in>\n </amplify-slot>\n\n <!-- setupTotp content -->\n <amplify-slot\n name=\"setup-totp\"\n [context]=\"context\"\n *ngIf=\"route === 'setupTotp'\"\n >\n <amplify-setup-totp></amplify-setup-totp>\n </amplify-slot>\n\n <!-- forceNewPassword content -->\n <amplify-slot\n name=\"force-new-password\"\n [context]=\"context\"\n *ngIf=\"route === 'forceNewPassword'\"\n >\n <amplify-force-new-password></amplify-force-new-password>\n </amplify-slot>\n\n <!-- forgotPassword content -->\n <amplify-slot\n name=\"forgot-password\"\n [context]=\"context\"\n *ngIf=\"route === 'forgotPassword'\"\n >\n <amplify-forgot-password></amplify-forgot-password>\n </amplify-slot>\n\n <!-- confirmResetPassword content -->\n <amplify-slot\n name=\"confirm-reset-password\"\n [context]=\"context\"\n *ngIf=\"route === 'confirmResetPassword'\"\n >\n <amplify-confirm-reset-password></amplify-confirm-reset-password>\n </amplify-slot>\n\n <!-- verifyUser content -->\n <amplify-slot\n name=\"verify-user\"\n [context]=\"context\"\n *ngIf=\"route === 'verifyUser'\"\n >\n <amplify-verify-user></amplify-verify-user>\n </amplify-slot>\n\n <!-- confirmVerifyUser content -->\n <amplify-slot\n name=\"confirm-verify-user\"\n [context]=\"context\"\n *ngIf=\"route === 'confirmVerifyUser'\"\n >\n <amplify-confirm-verify-user></amplify-confirm-verify-user>\n </amplify-slot>\n </div>\n\n <amplify-slot name=\"footer\" [context]=\"context\"></amplify-slot>\n </div>\n</div>\n\n<!-- signedIn content is rendered outside authenticator so it's not styled by authenticator -->\n<amplify-slot\n name=\"authenticated\"\n [context]=\"context\"\n *ngIf=\"route === 'authenticated'\"\n>\n <ng-content></ng-content>\n</amplify-slot>\n" }]
1350
+ args: [{ selector: 'amplify-authenticator', providers: [CustomComponentsService], encapsulation: ViewEncapsulation.None, template: "<div\n data-amplify-authenticator\n [attr.data-variation]=\"variation\"\n *ngIf=\"hasRouteComponent()\"\n>\n <div data-amplify-container>\n <amplify-slot\n name=\"header\"\n [context]=\"context\"\n ></amplify-slot>\n <div\n data-amplify-router\n [attr.data-amplify-router-content]=\"hasTabs() ? undefined : ''\"\n >\n <amplify-tabs\n (tabChange)=\"onTabChange()\"\n *ngIf=\"(route === 'signIn' || route === 'signUp') && !hideSignUp\"\n >\n <amplify-tab-item\n [title]=\"signInTitle\"\n [active]=\"route === 'signIn'\"\n data-amplify-router-content\n >\n <!-- signIn component -->\n <amplify-slot\n name=\"sign-in\"\n [context]=\"context\"\n *ngIf=\"route === 'signIn'\"\n >\n <amplify-sign-in></amplify-sign-in>\n </amplify-slot>\n </amplify-tab-item>\n <amplify-tab-item\n [title]=\"signUpTitle\"\n [active]=\"route === 'signUp'\"\n data-amplify-router-content\n >\n <!-- signUp component -->\n <amplify-slot\n name=\"sign-up\"\n [context]=\"context\"\n *ngIf=\"route === 'signUp'\"\n >\n <amplify-sign-up></amplify-sign-up>\n </amplify-slot>\n </amplify-tab-item>\n </amplify-tabs>\n\n <amplify-slot\n name=\"sign-in\"\n [context]=\"context\"\n *ngIf=\"route === 'signIn' && hideSignUp\"\n >\n <amplify-sign-in></amplify-sign-in>\n </amplify-slot>\n\n <!-- confirmSignUp content -->\n <amplify-slot\n name=\"confirm-sign-up\"\n [context]=\"context\"\n *ngIf=\"route === 'confirmSignUp'\"\n >\n <amplify-confirm-sign-up></amplify-confirm-sign-up>\n </amplify-slot>\n\n <!-- confirmSignIn content -->\n <amplify-slot\n name=\"confirm-sign-in\"\n [context]=\"context\"\n *ngIf=\"route === 'confirmSignIn'\"\n >\n <amplify-confirm-sign-in></amplify-confirm-sign-in>\n </amplify-slot>\n\n <!-- setupTotp content -->\n <amplify-slot\n name=\"setup-totp\"\n [context]=\"context\"\n *ngIf=\"route === 'setupTotp'\"\n >\n <amplify-setup-totp></amplify-setup-totp>\n </amplify-slot>\n\n <!-- forceNewPassword content -->\n <amplify-slot\n name=\"force-new-password\"\n [context]=\"context\"\n *ngIf=\"route === 'forceNewPassword'\"\n >\n <amplify-force-new-password></amplify-force-new-password>\n </amplify-slot>\n\n <!-- forgotPassword content -->\n <amplify-slot\n name=\"forgot-password\"\n [context]=\"context\"\n *ngIf=\"route === 'forgotPassword'\"\n >\n <amplify-forgot-password></amplify-forgot-password>\n </amplify-slot>\n\n <!-- confirmResetPassword content -->\n <amplify-slot\n name=\"confirm-reset-password\"\n [context]=\"context\"\n *ngIf=\"route === 'confirmResetPassword'\"\n >\n <amplify-confirm-reset-password></amplify-confirm-reset-password>\n </amplify-slot>\n\n <!-- verifyUser content -->\n <amplify-slot\n name=\"verify-user\"\n [context]=\"context\"\n *ngIf=\"route === 'verifyUser'\"\n >\n <amplify-verify-user></amplify-verify-user>\n </amplify-slot>\n\n <!-- confirmVerifyUser content -->\n <amplify-slot\n name=\"confirm-verify-user\"\n [context]=\"context\"\n *ngIf=\"route === 'confirmVerifyUser'\"\n >\n <amplify-confirm-verify-user></amplify-confirm-verify-user>\n </amplify-slot>\n\n <!-- selectMfaType content -->\n <amplify-slot\n name=\"select-mfa-type\"\n [context]=\"context\"\n *ngIf=\"route === 'selectMfaType'\"\n >\n <amplify-select-mfa-type></amplify-select-mfa-type>\n </amplify-slot>\n\n <!-- setupEmail content -->\n <amplify-slot\n name=\"setup-email\"\n [context]=\"context\"\n *ngIf=\"route === 'setupEmail'\"\n >\n <amplify-setup-email></amplify-setup-email>\n </amplify-slot>\n </div>\n\n <amplify-slot\n name=\"footer\"\n [context]=\"context\"\n ></amplify-slot>\n </div>\n</div>\n\n<!-- signedIn content is rendered outside authenticator so it's not styled by authenticator -->\n<amplify-slot\n name=\"authenticated\"\n [context]=\"context\"\n *ngIf=\"route === 'authenticated'\"\n>\n <ng-content></ng-content>\n</amplify-slot>" }]
1277
1351
  }], ctorParameters: function () { return [{ type: AuthenticatorService }, { type: CustomComponentsService }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { formFields: [{
1278
1352
  type: Input
1279
1353
  }], initialState: [{
@@ -1352,6 +1426,8 @@ AmplifyAuthenticatorModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.
1352
1426
  PhoneNumberFieldComponent,
1353
1427
  ForgotPasswordComponent,
1354
1428
  SelectComponent,
1429
+ SelectMfaTypeComponent,
1430
+ SetupEmailComponent,
1355
1431
  SetupTotpComponent,
1356
1432
  SignInComponent,
1357
1433
  SignUpComponent,
@@ -1390,6 +1466,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
1390
1466
  PhoneNumberFieldComponent,
1391
1467
  ForgotPasswordComponent,
1392
1468
  SelectComponent,
1469
+ SelectMfaTypeComponent,
1470
+ SetupEmailComponent,
1393
1471
  SetupTotpComponent,
1394
1472
  SignInComponent,
1395
1473
  SignUpComponent,