@aws-amplify/ui-angular 3.2.15 → 3.2.17

package/bundles/aws-amplify-ui-angular.umd.js

@@ -1,8 +1,8 @@
 (function (global, factory) {
-    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/common'), require('@aws-amplify/ui'), require('@aws-amplify/core'), require('xstate'), require('nanoid'), require('classnames'), require('qrcode'), require('aws-amplify')) :
-    typeof define === 'function' && define.amd ? define('@aws-amplify/ui-angular', ['exports', '@angular/core', '@angular/common', '@aws-amplify/ui', '@aws-amplify/core', 'xstate', 'nanoid', 'classnames', 'qrcode', 'aws-amplify'], factory) :
-    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global["aws-amplify"] = global["aws-amplify"] || {}, global["aws-amplify"]["ui-angular"] = {}), global.ng.core, global.ng.common, global.ui, global.core, global.xstate, global.nanoid, global.classnames, global.QRCode, global["aws-amplify"]));
-})(this, (function (exports, i0, i6, ui, core, xstate, nanoid, classnames, QRCode, awsAmplify) { 'use strict';
+    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/common'), require('@aws-amplify/ui'), require('rxjs'), require('xstate'), require('aws-amplify'), require('@aws-amplify/core'), require('nanoid'), require('classnames'), require('qrcode')) :
+    typeof define === 'function' && define.amd ? define('@aws-amplify/ui-angular', ['exports', '@angular/core', '@angular/common', '@aws-amplify/ui', 'rxjs', 'xstate', 'aws-amplify', '@aws-amplify/core', 'nanoid', 'classnames', 'qrcode'], factory) :
+    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global["aws-amplify"] = global["aws-amplify"] || {}, global["aws-amplify"]["ui-angular"] = {}), global.ng.core, global.ng.common, global.ui, global.rxjs, global.xstate, global["aws-amplify"], global.core, global.nanoid, global.classnames, global.QRCode));
+})(this, (function (exports, i0, i6, ui, rxjs, xstate, awsAmplify, core, nanoid, classnames, QRCode) { 'use strict';
 
     function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -29,6 +29,60 @@
     var classnames__default = /*#__PURE__*/_interopDefaultLegacy(classnames);
     var QRCode__default = /*#__PURE__*/_interopDefaultLegacy(QRCode);
 
+    var AmplifySlotDirective = /** @class */ (function () {
+        function AmplifySlotDirective(template) {
+            this.template = template;
+        }
+        Object.defineProperty(AmplifySlotDirective.prototype, "amplifySlot", {
+            set: function (component) {
+                this.name = component;
+            },
+            enumerable: false,
+            configurable: true
+        });
+        return AmplifySlotDirective;
+    }());
+    AmplifySlotDirective.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: AmplifySlotDirective, deps: [{ token: i0__namespace.TemplateRef }], target: i0__namespace.ɵɵFactoryTarget.Directive });
+    AmplifySlotDirective.ɵdir = i0__namespace.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.17", type: AmplifySlotDirective, selector: "[amplifySlot]", inputs: { amplifySlot: "amplifySlot" }, ngImport: i0__namespace });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: AmplifySlotDirective, decorators: [{
+                type: i0.Directive,
+                args: [{
+                        selector: '[amplifySlot]',
+                    }]
+            }], ctorParameters: function () { return [{ type: i0__namespace.TemplateRef }]; }, propDecorators: { amplifySlot: [{
+                    type: i0.Input
+                }] } });
+
+    /**
+     * Stores and provides custom components that users provide with `amplify-slot`.
+     */
+    var CustomComponentsService = /** @class */ (function () {
+        function CustomComponentsService() {
+            this._customComponents = {};
+        }
+        Object.defineProperty(CustomComponentsService.prototype, "customComponents", {
+            get: function () {
+                return this._customComponents;
+            },
+            set: function (customComponents) {
+                this._customComponents = Object.assign(Object.assign({}, this._customComponents), customComponents);
+            },
+            enumerable: false,
+            configurable: true
+        });
+        return CustomComponentsService;
+    }());
+    CustomComponentsService.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: CustomComponentsService, deps: [], target: i0__namespace.ɵɵFactoryTarget.Injectable });
+    CustomComponentsService.ɵprov = i0__namespace.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: CustomComponentsService, providedIn: 'root' });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: CustomComponentsService, decorators: [{
+                type: i0.Injectable,
+                args: [{
+                        providedIn: 'root',
+                    }]
+            }] });
+
+    var VERSION = '3.2.17';
+
     /******************************************************************************
     Copyright (c) Microsoft Corporation.
 
@@ -414,82 +468,24 @@
         return typeof state === "function" ? receiver === state : state.has(receiver);
     }
 
-    var AmplifySlotDirective = /** @class */ (function () {
-        function AmplifySlotDirective(template) {
-            this.template = template;
-        }
-        Object.defineProperty(AmplifySlotDirective.prototype, "amplifySlot", {
-            set: function (component) {
-                this.name = component;
-            },
-            enumerable: false,
-            configurable: true
-        });
-        return AmplifySlotDirective;
-    }());
-    AmplifySlotDirective.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: AmplifySlotDirective, deps: [{ token: i0__namespace.TemplateRef }], target: i0__namespace.ɵɵFactoryTarget.Directive });
-    AmplifySlotDirective.ɵdir = i0__namespace.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.17", type: AmplifySlotDirective, selector: "[amplifySlot]", inputs: { amplifySlot: "amplifySlot" }, ngImport: i0__namespace });
-    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: AmplifySlotDirective, decorators: [{
-                type: i0.Directive,
-                args: [{
-                        selector: '[amplifySlot]',
-                    }]
-            }], ctorParameters: function () { return [{ type: i0__namespace.TemplateRef }]; }, propDecorators: { amplifySlot: [{
-                    type: i0.Input
-                }] } });
-
-    /**
-     * Stores and provides custom components that users provide with `amplify-slot`.
-     */
-    var CustomComponentsService = /** @class */ (function () {
-        function CustomComponentsService() {
-            this._customComponents = {};
-        }
-        Object.defineProperty(CustomComponentsService.prototype, "customComponents", {
-            get: function () {
-                return this._customComponents;
-            },
-            set: function (customComponents) {
-                this._customComponents = Object.assign(Object.assign({}, this._customComponents), customComponents);
-            },
-            enumerable: false,
-            configurable: true
-        });
-        return CustomComponentsService;
-    }());
-    CustomComponentsService.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: CustomComponentsService, deps: [], target: i0__namespace.ɵɵFactoryTarget.Injectable });
-    CustomComponentsService.ɵprov = i0__namespace.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: CustomComponentsService, providedIn: 'root' });
-    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: CustomComponentsService, decorators: [{
-                type: i0.Injectable,
-                args: [{
-                        providedIn: 'root',
-                    }]
-            }] });
-
-    var VERSION = '3.2.15';
-
     var logger$1 = new core.Logger('state-machine');
     /**
      * AuthenticatorService provides access to the authenticator state and context.
      */
     var AuthenticatorService = /** @class */ (function () {
         function AuthenticatorService() {
-            var _this = this;
+            this._authStatus = 'configuring';
             var machine = ui.createAuthenticatorMachine();
-            var authService = xstate.interpret(machine).start();
-            this._machineSubscription = authService.subscribe(function (state) {
-                var newState = state;
-                _this._authState = newState;
-                _this._facade = ui.getServiceFacade({
-                    send: authService.send,
-                    state: newState,
-                });
-            });
-            this._authService = authService;
+            this._authService = xstate.interpret(machine).start();
+            this.setupMachineSubscription();
+            this.setupHubListener();
+            this.getInitialAuthStatus();
         }
         AuthenticatorService.prototype.ngOnDestroy = function () {
             if (this._machineSubscription)
                 this._machineSubscription.unsubscribe();
+            if (this._unsubscribeHub)
+                this._unsubscribeHub();
         };
         Object.defineProperty(AuthenticatorService.prototype, "error", {
             /**
@@ -528,8 +524,7 @@
         });
         Object.defineProperty(AuthenticatorService.prototype, "authStatus", {
             get: function () {
-                var _a;
-                return (_a = this._facade) === null || _a === void 0 ? void 0 : _a.authStatus;
+                return this._authStatus;
             },
             enumerable: false,
             configurable: true
@@ -684,6 +679,14 @@
             enumerable: false,
             configurable: true
         });
+        Object.defineProperty(AuthenticatorService.prototype, "hubSubject", {
+            /** @deprecated For internal use only */
+            get: function () {
+                return this._hubSubject;
+            },
+            enumerable: false,
+            configurable: true
+        });
         AuthenticatorService.prototype.subscribe = function (callback) {
             var _this = this;
             if (!this._authService) {
@@ -698,6 +701,59 @@
         AuthenticatorService.prototype.send = function (event) {
             this.authService.send(event);
         };
+        AuthenticatorService.prototype.getInitialAuthStatus = function () {
+            return __awaiter(this, void 0, void 0, function () {
+                var e_1;
+                return __generator(this, function (_b) {
+                    switch (_b.label) {
+                        case 0:
+                            _b.trys.push([0, 2, , 3]);
+                            return [4 /*yield*/, awsAmplify.Auth.currentAuthenticatedUser()];
+                        case 1:
+                            _b.sent();
+                            this._authStatus = 'authenticated';
+                            return [3 /*break*/, 3];
+                        case 2:
+                            e_1 = _b.sent();
+                            this._authStatus = 'unauthenticated';
+                            return [3 /*break*/, 3];
+                        case 3: return [2 /*return*/];
+                    }
+                });
+            });
+        };
+        AuthenticatorService.prototype.setupHubListener = function () {
+            var _this = this;
+            this._hubSubject = new rxjs.Subject();
+            var onSignIn = function () {
+                _this._authStatus = 'authenticated';
+            };
+            var onSignOut = function () {
+                _this._authStatus = 'unauthenticated';
+            };
+            this._unsubscribeHub = ui.listenToAuthHub(this._authService, function (data, service) { return __awaiter(_this, void 0, void 0, function () {
+                return __generator(this, function (_b) {
+                    switch (_b.label) {
+                        case 0: return [4 /*yield*/, ui.defaultAuthHubHandler(data, service, { onSignIn: onSignIn, onSignOut: onSignOut })];
+                        case 1:
+                            _b.sent();
+                            this._hubSubject.next();
+                            return [2 /*return*/];
+                    }
+                });
+            }); });
+        };
+        AuthenticatorService.prototype.setupMachineSubscription = function () {
+            var _this = this;
+            this._machineSubscription = this._authService.subscribe(function (state) {
+                var newState = state;
+                _this._authState = newState;
+                _this._facade = ui.getServiceFacade({
+                    send: _this._authService.send,
+                    state: newState,
+                });
+            });
+        };
         return AuthenticatorService;
     }());
     AuthenticatorService.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: AuthenticatorService, deps: [], target: i0__namespace.ɵɵFactoryTarget.Injectable });
@@ -1838,34 +1894,26 @@
                 packageName: '@aws-amplify/ui-angular',
                 version: VERSION,
             });
-            var _b = this.authenticator, authService = _b.authService, initializeMachine = _b.initializeMachine;
-            this.unsubscribeHub = ui.listenToAuthHub(authService, function (data, service) { return __awaiter(_this, void 0, void 0, function () {
-                return __generator(this, function (_a) {
-                    switch (_a.label) {
-                        case 0: return [4 /*yield*/, ui.defaultAuthHubHandler(data, service)];
-                        case 1:
-                            _a.sent();
-                            /**
-                             * Hub events aren't properly caught by Angular, because they are
-                             * synchronous events. Angular tracks async network events and
-                             * html events, but not synchronous events like hub.
-                             *
-                             * On any notable hub events, we run change detection manually.
-                             */
-                            this.changeDetector.detectChanges();
-                            /**
-                             * Hub events that we handle can lead to multiple state changes:
-                             * e.g. `authenticated` -> `signOut` -> initialState.
-                             *
-                             * We want to ensure change detection runs all the way, until
-                             * we reach back to the initial state. Setting the below flag
-                             * to true to until we reach initial state.
-                             */
-                            this.isHandlingHubEvent = true;
-                            return [2 /*return*/];
-                    }
-                });
-            }); });
+            var initializeMachine = this.authenticator.initializeMachine;
+            this.authenticator.hubSubject.subscribe(function () {
+                /*
+                 * Hub events aren't properly caught by Angular, because they are
+                 * synchronous events. Angular tracks async network events and
+                 * html events, but not synchronous events like hub.
+                 *
+                 * On any notable hub events, we run change detection manually.
+                 */
+                _this.changeDetector.detectChanges();
+                /*
+                 * Hub events that we handle can lead to multiple state changes:
+                 * e.g. `authenticated` -> `signOut` -> initialState.
+                 *
+                 * We want to ensure change detection runs all the way, until
+                 * we reach back to the initial state. Setting the below flag
+                 * to true to until we reach initial state.
+                 */
+                _this.isHandlingHubEvent = true;
+            });
             /**
              * Subscribes to state machine changes and sends INIT event
              * once machine reaches 'setup' state.
@@ -1908,8 +1956,6 @@
         AuthenticatorComponent.prototype.ngOnDestroy = function () {
             if (this.unsubscribeMachine)
                 this.unsubscribeMachine();
-            if (this.unsubscribeHub)
-                this.unsubscribeHub();
         };
         Object.defineProperty(AuthenticatorComponent.prototype, "context", {
             /**