@lowcodeunit/applications-flow-common 1.33.89-lets-get-social-ish → 1.33.95-lets-get-social-ish

package/bundles/lowcodeunit-applications-flow-common.umd.js

@@ -1,8 +1,8 @@
 (function (global, factory) {
-    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('rxjs'), require('@angular/common/http'), require('@lcu/common'), require('@angular/forms'), require('@angular/flex-layout'), require('@lowcodeunit/app-host-common'), require('@angular/cdk/keycodes'), require('rxjs/operators'), require('@angular/cdk/layout')) :
-    typeof define === 'function' && define.amd ? define('@lowcodeunit/applications-flow-common', ['exports', '@angular/core', 'rxjs', '@angular/common/http', '@lcu/common', '@angular/forms', '@angular/flex-layout', '@lowcodeunit/app-host-common', '@angular/cdk/keycodes', 'rxjs/operators', '@angular/cdk/layout'], factory) :
-    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.lowcodeunit = global.lowcodeunit || {}, global.lowcodeunit['applications-flow-common'] = {}), global.ng.core, global.rxjs, global.ng.common.http, global.i2, global.ng.forms, global.ng.flexLayout, global.appHostCommon, global.ng.cdk.keycodes, global.rxjs.operators, global.ng.cdk.layout));
-}(this, (function (exports, i0, rxjs, i1, i2, forms, flexLayout, appHostCommon, keycodes, operators, layout) { 'use strict';
+    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('rxjs'), require('@angular/common/http'), require('@lcu/common'), require('@angular/forms'), require('@angular/flex-layout'), require('@lowcodeunit/app-host-common'), require('@angular/cdk/keycodes'), require('rxjs/operators'), require('@angular/cdk/layout'), require('@angular/material/tooltip'), require('@angular/material/slide-toggle')) :
+    typeof define === 'function' && define.amd ? define('@lowcodeunit/applications-flow-common', ['exports', '@angular/core', 'rxjs', '@angular/common/http', '@lcu/common', '@angular/forms', '@angular/flex-layout', '@lowcodeunit/app-host-common', '@angular/cdk/keycodes', 'rxjs/operators', '@angular/cdk/layout', '@angular/material/tooltip', '@angular/material/slide-toggle'], factory) :
+    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.lowcodeunit = global.lowcodeunit || {}, global.lowcodeunit['applications-flow-common'] = {}), global.ng.core, global.rxjs, global.ng.common.http, global.i2, global.ng.forms, global.ng.flexLayout, global.appHostCommon, global.ng.cdk.keycodes, global.rxjs.operators, global.ng.cdk.layout, global.ng.material.tooltip, global.ng.material.slideToggle));
+}(this, (function (exports, i0, rxjs, i1, i2, forms, flexLayout, appHostCommon, keycodes, operators, layout, tooltip, slideToggle) { 'use strict';
 
     /*! *****************************************************************************
     Copyright (c) Microsoft Corporation.
@@ -1069,6 +1069,100 @@
         { type: i0.Injector }
     ]; };
 
+    var SaveApplicationAsCodeEventRequest = /** @class */ (function () {
+        function SaveApplicationAsCodeEventRequest() {
+        }
+        return SaveApplicationAsCodeEventRequest;
+    }());
+    var SaveDFSModifierEventRequest = /** @class */ (function () {
+        function SaveDFSModifierEventRequest() {
+        }
+        return SaveDFSModifierEventRequest;
+    }());
+    var SaveEnvironmentAsCodeEventRequest = /** @class */ (function () {
+        function SaveEnvironmentAsCodeEventRequest() {
+        }
+        return SaveEnvironmentAsCodeEventRequest;
+    }());
+    var SaveProjectAsCodeEventRequest = /** @class */ (function () {
+        function SaveProjectAsCodeEventRequest() {
+        }
+        return SaveProjectAsCodeEventRequest;
+    }());
+    var ApplicationsFlowEventsService = /** @class */ (function () {
+        // Constructors
+        function ApplicationsFlowEventsService() {
+            this.DeleteApplicationEvent = new i0.EventEmitter();
+            this.DeleteDevOpsActionEvent = new i0.EventEmitter();
+            this.DeleteProjectEvent = new i0.EventEmitter();
+            this.DeleteSourceControlEvent = new i0.EventEmitter();
+            this.EnsureUserEnterpriseEvent = new i0.EventEmitter();
+            this.LoadEnterpriseAsCodeEvent = new i0.EventEmitter();
+            this.SaveApplicationAsCodeEvent = new i0.EventEmitter();
+            this.SaveDFSModifierEvent = new i0.EventEmitter();
+            this.SaveEnterpriseAsCodeEvent = new i0.EventEmitter();
+            this.SaveEnvironmentAsCodeEvent = new i0.EventEmitter();
+            this.SaveProjectAsCodeEvent = new i0.EventEmitter();
+            this.SetCreatingProjectEvent = new i0.EventEmitter();
+            this.SetEditProjectSettingsEvent = new i0.EventEmitter();
+            this.UnpackLowCodeUnitEvent = new i0.EventEmitter();
+        }
+        // API Methods
+        ApplicationsFlowEventsService.prototype.DeleteApplication = function (appLookup) {
+            this.DeleteApplicationEvent.emit(appLookup);
+        };
+        ApplicationsFlowEventsService.prototype.DeleteDevOpsAction = function (doaLookup) {
+            this.DeleteDevOpsActionEvent.emit(doaLookup);
+        };
+        ApplicationsFlowEventsService.prototype.DeleteProject = function (projectLookup) {
+            this.DeleteProjectEvent.emit(projectLookup);
+        };
+        ApplicationsFlowEventsService.prototype.DeleteSourceControl = function (scLookup) {
+            this.DeleteSourceControlEvent.emit(scLookup);
+        };
+        ApplicationsFlowEventsService.prototype.EnsureUserEnterprise = function () {
+            this.EnsureUserEnterpriseEvent.emit();
+        };
+        // public ListProjects(withLoading: boolean): void {
+        //   this.ListProjectsEvent.emit(withLoading);
+        // }
+        ApplicationsFlowEventsService.prototype.LoadEnterpriseAsCode = function () {
+            this.LoadEnterpriseAsCodeEvent.emit();
+        };
+        ApplicationsFlowEventsService.prototype.SaveApplicationAsCode = function (req) {
+            this.SaveApplicationAsCodeEvent.emit(req);
+        };
+        ApplicationsFlowEventsService.prototype.SaveDFSModifier = function (req) {
+            this.SaveDFSModifierEvent.emit(req);
+        };
+        ApplicationsFlowEventsService.prototype.SaveEnterpriseAsCode = function (eac) {
+            this.SaveEnterpriseAsCodeEvent.emit(eac);
+        };
+        ApplicationsFlowEventsService.prototype.SaveEnvironmentAsCode = function (req) {
+            this.SaveEnvironmentAsCodeEvent.emit(req);
+        };
+        ApplicationsFlowEventsService.prototype.SaveProjectAsCode = function (req) {
+            this.SaveProjectAsCodeEvent.emit(req);
+        };
+        ApplicationsFlowEventsService.prototype.SetCreatingProject = function (creatingProject) {
+            this.SetCreatingProjectEvent.emit(creatingProject);
+        };
+        ApplicationsFlowEventsService.prototype.SetEditProjectSettings = function (projectLookup) {
+            this.SetEditProjectSettingsEvent.emit(projectLookup);
+        };
+        ApplicationsFlowEventsService.prototype.UnpackLowCodeUnit = function (req) {
+            this.UnpackLowCodeUnitEvent.emit(req);
+        };
+        return ApplicationsFlowEventsService;
+    }());
+    ApplicationsFlowEventsService.ɵprov = i0.ɵɵdefineInjectable({ factory: function ApplicationsFlowEventsService_Factory() { return new ApplicationsFlowEventsService(); }, token: ApplicationsFlowEventsService, providedIn: "root" });
+    ApplicationsFlowEventsService.decorators = [
+        { type: i0.Injectable, args: [{
+                    providedIn: 'root',
+                },] }
+    ];
+    ApplicationsFlowEventsService.ctorParameters = function () { return []; };
+
     var ApplicationsFlowState = /** @class */ (function () {
         function ApplicationsFlowState() {
             this.GitHub = {};
@@ -1169,99 +1263,327 @@
     //   public Repository?: string;
     // }
 
-    var SaveApplicationAsCodeEventRequest = /** @class */ (function () {
-        function SaveApplicationAsCodeEventRequest() {
-        }
-        return SaveApplicationAsCodeEventRequest;
-    }());
-    var SaveDFSModifierEventRequest = /** @class */ (function () {
-        function SaveDFSModifierEventRequest() {
-        }
-        return SaveDFSModifierEventRequest;
-    }());
-    var SaveEnvironmentAsCodeEventRequest = /** @class */ (function () {
-        function SaveEnvironmentAsCodeEventRequest() {
-        }
-        return SaveEnvironmentAsCodeEventRequest;
-    }());
-    var SaveProjectAsCodeEventRequest = /** @class */ (function () {
-        function SaveProjectAsCodeEventRequest() {
-        }
-        return SaveProjectAsCodeEventRequest;
-    }());
-    var ApplicationsFlowEventsService = /** @class */ (function () {
-        // Constructors
-        function ApplicationsFlowEventsService() {
-            this.DeleteApplicationEvent = new i0.EventEmitter();
-            this.DeleteDevOpsActionEvent = new i0.EventEmitter();
-            this.DeleteProjectEvent = new i0.EventEmitter();
-            this.DeleteSourceControlEvent = new i0.EventEmitter();
-            this.EnsureUserEnterpriseEvent = new i0.EventEmitter();
-            this.LoadEnterpriseAsCodeEvent = new i0.EventEmitter();
-            this.SaveApplicationAsCodeEvent = new i0.EventEmitter();
-            this.SaveDFSModifierEvent = new i0.EventEmitter();
-            this.SaveEnterpriseAsCodeEvent = new i0.EventEmitter();
-            this.SaveEnvironmentAsCodeEvent = new i0.EventEmitter();
-            this.SaveProjectAsCodeEvent = new i0.EventEmitter();
-            this.SetCreatingProjectEvent = new i0.EventEmitter();
-            this.SetEditProjectSettingsEvent = new i0.EventEmitter();
-            this.UnpackLowCodeUnitEvent = new i0.EventEmitter();
+    var EaCService = /** @class */ (function () {
+        //  Constructors
+        function EaCService(appsFlowEventsSvc, projectService) {
+            this.appsFlowEventsSvc = appsFlowEventsSvc;
+            this.projectService = projectService;
+            this.State = new ApplicationsFlowState();
+            this.setServices();
         }
-        // API Methods
-        ApplicationsFlowEventsService.prototype.DeleteApplication = function (appLookup) {
-            this.DeleteApplicationEvent.emit(appLookup);
+        //  API Methods
+        EaCService.prototype.DeleteApplication = function (appLookup, appName) {
+            return __awaiter(this, void 0, void 0, function () {
+                return __generator(this, function (_b) {
+                    switch (_b.label) {
+                        case 0:
+                            if (!confirm("Are you sure you want to delete application '" + appName + "'?")) return [3 /*break*/, 2];
+                            return [4 /*yield*/, this.projectService.DeleteApplication(this.State, appLookup)];
+                        case 1:
+                            _b.sent();
+                            _b.label = 2;
+                        case 2: return [2 /*return*/];
+                    }
+                });
+            });
         };
-        ApplicationsFlowEventsService.prototype.DeleteDevOpsAction = function (doaLookup) {
-            this.DeleteDevOpsActionEvent.emit(doaLookup);
+        EaCService.prototype.DeleteDevOpsAction = function (doaLookup) {
+            return __awaiter(this, void 0, void 0, function () {
+                return __generator(this, function (_b) {
+                    switch (_b.label) {
+                        case 0:
+                            if (!confirm("Are you sure you want to delete DevOps action '" + doaLookup + "'?")) return [3 /*break*/, 2];
+                            return [4 /*yield*/, this.projectService.DeleteDevOpsAction(this.State, doaLookup)];
+                        case 1:
+                            _b.sent();
+                            _b.label = 2;
+                        case 2: return [2 /*return*/];
+                    }
+                });
+            });
         };
-        ApplicationsFlowEventsService.prototype.DeleteProject = function (projectLookup) {
-            this.DeleteProjectEvent.emit(projectLookup);
+        EaCService.prototype.DeleteProject = function (projectLookup) {
+            return __awaiter(this, void 0, void 0, function () {
+                return __generator(this, function (_b) {
+                    switch (_b.label) {
+                        case 0:
+                            if (!confirm("Are you sure you want to delete Project '" + projectLookup + "'?")) return [3 /*break*/, 2];
+                            return [4 /*yield*/, this.projectService.DeleteProject(this.State, projectLookup)];
+                        case 1:
+                            _b.sent();
+                            _b.label = 2;
+                        case 2: return [2 /*return*/];
+                    }
+                });
+            });
         };
-        ApplicationsFlowEventsService.prototype.DeleteSourceControl = function (scLookup) {
-            this.DeleteSourceControlEvent.emit(scLookup);
+        EaCService.prototype.DeleteSourceControl = function (scLookup) {
+            return __awaiter(this, void 0, void 0, function () {
+                return __generator(this, function (_b) {
+                    switch (_b.label) {
+                        case 0:
+                            if (!confirm("Are you sure you want to delete Source Control '" + scLookup + "'?")) return [3 /*break*/, 2];
+                            return [4 /*yield*/, this.projectService.DeleteSourceControl(this.State, scLookup)];
+                        case 1:
+                            _b.sent();
+                            _b.label = 2;
+                        case 2: return [2 /*return*/];
+                    }
+                });
+            });
         };
-        ApplicationsFlowEventsService.prototype.EnsureUserEnterprise = function () {
-            this.EnsureUserEnterpriseEvent.emit();
+        // this.appsFlowEventsSvc.EnsureUserEnterpriseEvent.subscribe(async () => {
+        //   await this.projectService.EnsureUserEnterprise(this.State);
+        // });
+        EaCService.prototype.EnsureUserEnterprise = function (appLookup, appName) {
+            return __awaiter(this, void 0, void 0, function () {
+                return __generator(this, function (_b) {
+                    switch (_b.label) {
+                        case 0: return [4 /*yield*/, this.projectService.EnsureUserEnterprise(this.State)];
+                        case 1:
+                            _b.sent();
+                            return [2 /*return*/];
+                    }
+                });
+            });
         };
-        // public ListProjects(withLoading: boolean): void {
-        //   this.ListProjectsEvent.emit(withLoading);
-        // }
-        ApplicationsFlowEventsService.prototype.LoadEnterpriseAsCode = function () {
-            this.LoadEnterpriseAsCodeEvent.emit();
+        EaCService.prototype.LoadEnterpriseAsCode = function () {
+            return __awaiter(this, void 0, void 0, function () {
+                return __generator(this, function (_b) {
+                    switch (_b.label) {
+                        case 0: return [4 /*yield*/, this.projectService.LoadEnterpriseAsCode(this.State)];
+                        case 1:
+                            _b.sent();
+                            return [2 /*return*/];
+                    }
+                });
+            });
         };
-        ApplicationsFlowEventsService.prototype.SaveApplicationAsCode = function (req) {
-            this.SaveApplicationAsCodeEvent.emit(req);
+        EaCService.prototype.SaveApplicationAsCode = function (req) {
+            return __awaiter(this, void 0, void 0, function () {
+                return __generator(this, function (_b) {
+                    switch (_b.label) {
+                        case 0: return [4 /*yield*/, this.handleSaveApplication(req)];
+                        case 1:
+                            _b.sent();
+                            return [2 /*return*/];
+                    }
+                });
+            });
         };
-        ApplicationsFlowEventsService.prototype.SaveDFSModifier = function (req) {
-            this.SaveDFSModifierEvent.emit(req);
+        EaCService.prototype.SaveDFSModifierEvent = function (req) {
+            return __awaiter(this, void 0, void 0, function () {
+                return __generator(this, function (_b) {
+                    switch (_b.label) {
+                        case 0: return [4 /*yield*/, this.handleSaveDFSModifier(req)];
+                        case 1:
+                            _b.sent();
+                            return [2 /*return*/];
+                    }
+                });
+            });
         };
-        ApplicationsFlowEventsService.prototype.SaveEnterpriseAsCode = function (eac) {
-            this.SaveEnterpriseAsCodeEvent.emit(eac);
+        EaCService.prototype.SaveEnterpriseAsCode = function (eac) {
+            return __awaiter(this, void 0, void 0, function () {
+                return __generator(this, function (_b) {
+                    switch (_b.label) {
+                        case 0: return [4 /*yield*/, this.projectService.SaveEnterpriseAsCode(this.State, eac)];
+                        case 1:
+                            _b.sent();
+                            return [2 /*return*/];
+                    }
+                });
+            });
         };
-        ApplicationsFlowEventsService.prototype.SaveEnvironmentAsCode = function (req) {
-            this.SaveEnvironmentAsCodeEvent.emit(req);
+        EaCService.prototype.SaveEnvironmentAsCode = function (req) {
+            return __awaiter(this, void 0, void 0, function () {
+                return __generator(this, function (_b) {
+                    switch (_b.label) {
+                        case 0: return [4 /*yield*/, this.handleSaveEnvironment(req)];
+                        case 1:
+                            _b.sent();
+                            return [2 /*return*/];
+                    }
+                });
+            });
         };
-        ApplicationsFlowEventsService.prototype.SaveProjectAsCode = function (req) {
-            this.SaveProjectAsCodeEvent.emit(req);
+        EaCService.prototype.SaveProjectAsCode = function (req) {
+            return __awaiter(this, void 0, void 0, function () {
+                return __generator(this, function (_b) {
+                    switch (_b.label) {
+                        case 0: return [4 /*yield*/, this.handleSaveProject(req.ProjectLookup, req.Project)];
+                        case 1:
+                            _b.sent();
+                            return [2 /*return*/];
+                    }
+                });
+            });
         };
-        ApplicationsFlowEventsService.prototype.SetCreatingProject = function (creatingProject) {
-            this.SetCreatingProjectEvent.emit(creatingProject);
+        EaCService.prototype.SetCreatingProject = function (creatingProject) {
+            return __awaiter(this, void 0, void 0, function () {
+                return __generator(this, function (_b) {
+                    this.projectService.SetCreatingProject(creatingProject);
+                    return [2 /*return*/];
+                });
+            });
         };
-        ApplicationsFlowEventsService.prototype.SetEditProjectSettings = function (projectLookup) {
-            this.SetEditProjectSettingsEvent.emit(projectLookup);
+        EaCService.prototype.SetEditProjectSettings = function (projectLookup) {
+            return __awaiter(this, void 0, void 0, function () {
+                return __generator(this, function (_b) {
+                    switch (_b.label) {
+                        case 0: return [4 /*yield*/, this.projectService.SetEditProjectSettings(this.State, projectLookup)];
+                        case 1:
+                            _b.sent();
+                            return [2 /*return*/];
+                    }
+                });
+            });
         };
-        ApplicationsFlowEventsService.prototype.UnpackLowCodeUnit = function (req) {
-            this.UnpackLowCodeUnitEvent.emit(req);
+        EaCService.prototype.UnpackLowCodeUnit = function (req) {
+            return __awaiter(this, void 0, void 0, function () {
+                return __generator(this, function (_b) {
+                    switch (_b.label) {
+                        case 0:
+                            if (!confirm("Are you sure you want to unpack application '" + req.ApplicationName + "' with version '" + req.Version + "'?")) return [3 /*break*/, 2];
+                            return [4 /*yield*/, this.projectService.UnpackLowCodeUnit(this.State, req)];
+                        case 1:
+                            _b.sent();
+                            _b.label = 2;
+                        case 2: return [2 /*return*/];
+                    }
+                });
+            });
         };
-        return ApplicationsFlowEventsService;
+        EaCService.prototype.setServices = function () {
+            // this.appsFlowEventsSvc.ListProjectsEvent.subscribe((withLoading) => {
+            //   this.projectService.ListProjects(this.State, withLoading);
+            // });
+        };
+        //  Helpers
+        EaCService.prototype.handleSaveApplication = function (req) {
+            var _a;
+            return __awaiter(this, void 0, void 0, function () {
+                var saveEaC, existingProj;
+                return __generator(this, function (_b) {
+                    switch (_b.label) {
+                        case 0:
+                            saveEaC = {
+                                EnterpriseLookup: this.State.EaC.EnterpriseLookup,
+                                Applications: {},
+                                Projects: {},
+                            };
+                            existingProj = Object.assign({}, this.State.EaC.Projects[req.ProjectLookup]);
+                            if (((_a = existingProj.ApplicationLookups) === null || _a === void 0 ? void 0 : _a.indexOf(req.ApplicationLookup)) < 0) {
+                                if (!existingProj.ApplicationLookups) {
+                                    existingProj.ApplicationLookups = [];
+                                }
+                                existingProj.ApplicationLookups.push(req.ApplicationLookup);
+                                saveEaC.Projects[req.ProjectLookup] = existingProj;
+                            }
+                            if (req.Application) {
+                                saveEaC.Applications[req.ApplicationLookup] = req.Application;
+                            }
+                            return [4 /*yield*/, this.projectService.SaveEnterpriseAsCode(this.State, saveEaC)];
+                        case 1:
+                            _b.sent();
+                            return [2 /*return*/];
+                    }
+                });
+            });
+        };
+        EaCService.prototype.handleSaveDFSModifier = function (req) {
+            return __awaiter(this, void 0, void 0, function () {
+                var saveEaC;
+                return __generator(this, function (_b) {
+                    switch (_b.label) {
+                        case 0:
+                            saveEaC = {
+                                EnterpriseLookup: this.State.EaC.EnterpriseLookup,
+                                Modifiers: {},
+                                Projects: {},
+                            };
+                            if (req.Modifier) {
+                                saveEaC.Modifiers[req.ModifierLookup] = req.Modifier;
+                            }
+                            if (req.ProjectLookup) {
+                                saveEaC.Projects[req.ProjectLookup] = {
+                                    ModifierLookups: [req.ModifierLookup],
+                                };
+                            }
+                            return [4 /*yield*/, this.projectService.SaveEnterpriseAsCode(this.State, saveEaC)];
+                        case 1:
+                            _b.sent();
+                            return [2 /*return*/];
+                    }
+                });
+            });
+        };
+        EaCService.prototype.handleSaveEnvironment = function (req) {
+            return __awaiter(this, void 0, void 0, function () {
+                var saveEaC;
+                return __generator(this, function (_b) {
+                    switch (_b.label) {
+                        case 0:
+                            saveEaC = {
+                                EnterpriseLookup: this.State.EaC.EnterpriseLookup,
+                                DataTokens: {},
+                                Environments: {},
+                            };
+                            if (req.Environment) {
+                                saveEaC.Environments[req.EnvironmentLookup] = req.Environment;
+                            }
+                            if (req.EnterpriseDataTokens) {
+                                saveEaC.DataTokens = req.EnterpriseDataTokens;
+                            }
+                            return [4 /*yield*/, this.projectService.SaveEnterpriseAsCode(this.State, saveEaC)];
+                        case 1:
+                            _b.sent();
+                            return [2 /*return*/];
+                    }
+                });
+            });
+        };
+        EaCService.prototype.handleSaveProject = function (projectLookup, project) {
+            var _a;
+            return __awaiter(this, void 0, void 0, function () {
+                var projHosts, saveEaC;
+                var _this = this;
+                return __generator(this, function (_b) {
+                    switch (_b.label) {
+                        case 0:
+                            projHosts = {};
+                            (_a = project === null || project === void 0 ? void 0 : project.Hosts) === null || _a === void 0 ? void 0 : _a.forEach(function (host) {
+                                projHosts[host] = _this.State.EaC.Hosts[host];
+                            });
+                            saveEaC = {
+                                EnterpriseLookup: this.State.EaC.EnterpriseLookup,
+                                Enterprise: Object.assign(Object.assign({}, this.State.EaC.Enterprise), { PrimaryHost: project.Hosts[0] }),
+                                Hosts: projHosts,
+                                // Providers: this.State.EaC.Providers,  //  TODO:  Remove after all providers ADB2C's have been upgraded
+                                Projects: {},
+                            };
+                            saveEaC.Projects[projectLookup] = project;
+                            return [4 /*yield*/, this.projectService.SaveEnterpriseAsCode(this.State, saveEaC)];
+                        case 1:
+                            _b.sent();
+                            this.appsFlowEventsSvc.SetEditProjectSettings(projectLookup);
+                            return [2 /*return*/];
+                    }
+                });
+            });
+        };
+        return EaCService;
     }());
-    ApplicationsFlowEventsService.ɵprov = i0.ɵɵdefineInjectable({ factory: function ApplicationsFlowEventsService_Factory() { return new ApplicationsFlowEventsService(); }, token: ApplicationsFlowEventsService, providedIn: "root" });
-    ApplicationsFlowEventsService.decorators = [
+    EaCService.ɵprov = i0.ɵɵdefineInjectable({ factory: function EaCService_Factory() { return new EaCService(i0.ɵɵinject(ApplicationsFlowEventsService), i0.ɵɵinject(ProjectService)); }, token: EaCService, providedIn: "root" });
+    EaCService.decorators = [
         { type: i0.Injectable, args: [{
                     providedIn: 'root',
                 },] }
     ];
-    ApplicationsFlowEventsService.ctorParameters = function () { return []; };
+    EaCService.ctorParameters = function () { return [
+        { type: ApplicationsFlowEventsService },
+        { type: ProjectService }
+    ]; };
 
     var ApplicationsFlowProjectsElementState = /** @class */ (function () {
         function ApplicationsFlowProjectsElementState() {
@@ -1279,14 +1601,12 @@
     var ApplicationsFlowProjectsElementComponent = /** @class */ (function (_super) {
         __extends(ApplicationsFlowProjectsElementComponent, _super);
         //  Constructors
-        function ApplicationsFlowProjectsElementComponent(injector, appsFlowSvc, projectService, appsFlowEventsSvc) {
+        function ApplicationsFlowProjectsElementComponent(injector, appsFlowSvc, projectService, eacSvc) {
             var _this = _super.call(this, injector) || this;
             _this.injector = injector;
             _this.appsFlowSvc = appsFlowSvc;
             _this.projectService = projectService;
-            _this.appsFlowEventsSvc = appsFlowEventsSvc;
-            _this.State = new ApplicationsFlowState();
-            _this.setServices();
+            _this.eacSvc = eacSvc;
             return _this;
         }
         Object.defineProperty(ApplicationsFlowProjectsElementComponent.prototype, "ActiveEnvironment", {
@@ -1338,6 +1658,13 @@
             enumerable: false,
             configurable: true
         });
+        Object.defineProperty(ApplicationsFlowProjectsElementComponent.prototype, "State", {
+            get: function () {
+                return this.eacSvc.State;
+            },
+            enumerable: false,
+            configurable: true
+        });
         //  Life Cycle
         ApplicationsFlowProjectsElementComponent.prototype.ngOnDestroy = function () { };
         ApplicationsFlowProjectsElementComponent.prototype.ngOnInit = function () {
@@ -1399,345 +1726,91 @@
                 });
             });
         };
-        ApplicationsFlowProjectsElementComponent.prototype.handleSaveApplication = function (req) {
-            var _a;
-            return __awaiter(this, void 0, void 0, function () {
-                var saveEaC, existingProj;
-                return __generator(this, function (_e) {
-                    switch (_e.label) {
-                        case 0:
-                            saveEaC = {
-                                EnterpriseLookup: this.State.EaC.EnterpriseLookup,
-                                Applications: {},
-                                Projects: {},
-                            };
-                            existingProj = Object.assign({}, this.State.EaC.Projects[req.ProjectLookup]);
-                            if (((_a = existingProj.ApplicationLookups) === null || _a === void 0 ? void 0 : _a.indexOf(req.ApplicationLookup)) < 0) {
-                                if (!existingProj.ApplicationLookups) {
-                                    existingProj.ApplicationLookups = [];
-                                }
-                                existingProj.ApplicationLookups.push(req.ApplicationLookup);
-                                saveEaC.Projects[req.ProjectLookup] = existingProj;
-                            }
-                            if (req.Application) {
-                                saveEaC.Applications[req.ApplicationLookup] = req.Application;
-                            }
-                            return [4 /*yield*/, this.projectService.SaveEnterpriseAsCode(this.State, saveEaC)];
-                        case 1:
-                            _e.sent();
-                            return [2 /*return*/];
-                    }
-                });
-            });
-        };
-        ApplicationsFlowProjectsElementComponent.prototype.handleSaveDFSModifier = function (req) {
-            return __awaiter(this, void 0, void 0, function () {
-                var saveEaC;
-                return __generator(this, function (_e) {
-                    switch (_e.label) {
-                        case 0:
-                            saveEaC = {
-                                EnterpriseLookup: this.State.EaC.EnterpriseLookup,
-                                Modifiers: {},
-                                Projects: {},
-                            };
-                            if (req.Modifier) {
-                                saveEaC.Modifiers[req.ModifierLookup] = req.Modifier;
-                            }
-                            if (req.ProjectLookup) {
-                                saveEaC.Projects[req.ProjectLookup] = {
-                                    ModifierLookups: [req.ModifierLookup],
-                                };
-                            }
-                            return [4 /*yield*/, this.projectService.SaveEnterpriseAsCode(this.State, saveEaC)];
-                        case 1:
-                            _e.sent();
-                            return [2 /*return*/];
-                    }
-                });
-            });
-        };
-        ApplicationsFlowProjectsElementComponent.prototype.handleSaveEnvironment = function (req) {
-            return __awaiter(this, void 0, void 0, function () {
-                var saveEaC;
-                return __generator(this, function (_e) {
-                    switch (_e.label) {
-                        case 0:
-                            saveEaC = {
-                                EnterpriseLookup: this.State.EaC.EnterpriseLookup,
-                                DataTokens: {},
-                                Environments: {},
-                            };
-                            if (req.Environment) {
-                                saveEaC.Environments[req.EnvironmentLookup] = req.Environment;
-                            }
-                            if (req.EnterpriseDataTokens) {
-                                saveEaC.DataTokens = req.EnterpriseDataTokens;
-                            }
-                            return [4 /*yield*/, this.projectService.SaveEnterpriseAsCode(this.State, saveEaC)];
-                        case 1:
-                            _e.sent();
-                            return [2 /*return*/];
-                    }
-                });
-            });
-        };
-        ApplicationsFlowProjectsElementComponent.prototype.handleSaveProject = function (projectLookup, project) {
-            var _a;
-            return __awaiter(this, void 0, void 0, function () {
-                var projHosts, saveEaC;
-                var _this = this;
-                return __generator(this, function (_e) {
-                    switch (_e.label) {
-                        case 0:
-                            projHosts = {};
-                            (_a = project === null || project === void 0 ? void 0 : project.Hosts) === null || _a === void 0 ? void 0 : _a.forEach(function (host) {
-                                projHosts[host] = _this.State.EaC.Hosts[host];
-                            });
-                            saveEaC = {
-                                EnterpriseLookup: this.State.EaC.EnterpriseLookup,
-                                Enterprise: Object.assign(Object.assign({}, this.State.EaC.Enterprise), { PrimaryHost: project.Hosts[0] }),
-                                Hosts: projHosts,
-                                // Providers: this.State.EaC.Providers,  //  TODO:  Remove after all providers ADB2C's have been upgraded
-                                Projects: {},
-                            };
-                            saveEaC.Projects[projectLookup] = project;
-                            return [4 /*yield*/, this.projectService.SaveEnterpriseAsCode(this.State, saveEaC)];
-                        case 1:
-                            _e.sent();
-                            this.appsFlowEventsSvc.SetEditProjectSettings(projectLookup);
-                            return [2 /*return*/];
-                    }
-                });
-            });
-        };
-        ApplicationsFlowProjectsElementComponent.prototype.setServices = function () {
-            var _this = this;
-            this.appsFlowEventsSvc.DeleteApplicationEvent.subscribe(function (appLookup) { return __awaiter(_this, void 0, void 0, function () {
-                return __generator(this, function (_e) {
-                    switch (_e.label) {
-                        case 0: return [4 /*yield*/, this.projectService.DeleteApplication(this.State, appLookup)];
-                        case 1:
-                            _e.sent();
-                            return [2 /*return*/];
-                    }
-                });
-            }); });
-            this.appsFlowEventsSvc.DeleteDevOpsActionEvent.subscribe(function (doaLookup) { return __awaiter(_this, void 0, void 0, function () {
-                return __generator(this, function (_e) {
-                    switch (_e.label) {
-                        case 0: return [4 /*yield*/, this.projectService.DeleteDevOpsAction(this.State, doaLookup)];
-                        case 1:
-                            _e.sent();
-                            return [2 /*return*/];
-                    }
-                });
-            }); });
-            this.appsFlowEventsSvc.DeleteProjectEvent.subscribe(function (projectLookup) { return __awaiter(_this, void 0, void 0, function () {
-                return __generator(this, function (_e) {
-                    switch (_e.label) {
-                        case 0: return [4 /*yield*/, this.projectService.DeleteProject(this.State, projectLookup)];
-                        case 1:
-                            _e.sent();
-                            return [2 /*return*/];
-                    }
-                });
-            }); });
-            this.appsFlowEventsSvc.DeleteSourceControlEvent.subscribe(function (scLookup) { return __awaiter(_this, void 0, void 0, function () {
-                return __generator(this, function (_e) {
-                    switch (_e.label) {
-                        case 0: return [4 /*yield*/, this.projectService.DeleteSourceControl(this.State, scLookup)];
-                        case 1:
-                            _e.sent();
-                            return [2 /*return*/];
-                    }
-                });
-            }); });
-            this.appsFlowEventsSvc.EnsureUserEnterpriseEvent.subscribe(function () { return __awaiter(_this, void 0, void 0, function () {
-                return __generator(this, function (_e) {
-                    switch (_e.label) {
-                        case 0: return [4 /*yield*/, this.projectService.EnsureUserEnterprise(this.State)];
-                        case 1:
-                            _e.sent();
-                            return [2 /*return*/];
-                    }
-                });
-            }); });
-            // this.appsFlowEventsSvc.ListProjectsEvent.subscribe((withLoading) => {
-            //   this.projectService.ListProjects(this.State, withLoading);
-            // });
-            this.appsFlowEventsSvc.LoadEnterpriseAsCodeEvent.subscribe(function () { return __awaiter(_this, void 0, void 0, function () {
-                return __generator(this, function (_e) {
-                    switch (_e.label) {
-                        case 0: return [4 /*yield*/, this.projectService.LoadEnterpriseAsCode(this.State)];
-                        case 1:
-                            _e.sent();
-                            return [2 /*return*/];
-                    }
-                });
-            }); });
-            this.appsFlowEventsSvc.SaveEnterpriseAsCodeEvent.subscribe(function (eac) { return __awaiter(_this, void 0, void 0, function () {
-                return __generator(this, function (_e) {
-                    switch (_e.label) {
-                        case 0: return [4 /*yield*/, this.projectService.SaveEnterpriseAsCode(this.State, eac)];
-                        case 1:
-                            _e.sent();
-                            return [2 /*return*/];
-                    }
-                });
-            }); });
-            this.appsFlowEventsSvc.SaveApplicationAsCodeEvent.subscribe(function (req) { return __awaiter(_this, void 0, void 0, function () {
-                return __generator(this, function (_e) {
-                    switch (_e.label) {
-                        case 0: return [4 /*yield*/, this.handleSaveApplication(req)];
-                        case 1:
-                            _e.sent();
-                            return [2 /*return*/];
-                    }
-                });
-            }); });
-            this.appsFlowEventsSvc.SaveDFSModifierEvent.subscribe(function (req) { return __awaiter(_this, void 0, void 0, function () {
-                return __generator(this, function (_e) {
-                    switch (_e.label) {
-                        case 0: return [4 /*yield*/, this.handleSaveDFSModifier(req)];
-                        case 1:
-                            _e.sent();
-                            return [2 /*return*/];
-                    }
-                });
-            }); });
-            this.appsFlowEventsSvc.SaveEnvironmentAsCodeEvent.subscribe(function (req) { return __awaiter(_this, void 0, void 0, function () {
-                return __generator(this, function (_e) {
-                    switch (_e.label) {
-                        case 0: return [4 /*yield*/, this.handleSaveEnvironment(req)];
-                        case 1:
-                            _e.sent();
-                            return [2 /*return*/];
-                    }
-                });
-            }); });
-            this.appsFlowEventsSvc.SaveProjectAsCodeEvent.subscribe(function (req) { return __awaiter(_this, void 0, void 0, function () {
-                return __generator(this, function (_e) {
-                    switch (_e.label) {
-                        case 0: return [4 /*yield*/, this.handleSaveProject(req.ProjectLookup, req.Project)];
-                        case 1:
-                            _e.sent();
-                            return [2 /*return*/];
-                    }
-                });
-            }); });
-            this.appsFlowEventsSvc.SetCreatingProjectEvent.subscribe(function (creatingProject) {
-                _this.projectService.SetCreatingProject(creatingProject);
-            });
-            this.appsFlowEventsSvc.SetEditProjectSettingsEvent.subscribe(function (projectLookup) { return __awaiter(_this, void 0, void 0, function () {
-                return __generator(this, function (_e) {
-                    switch (_e.label) {
-                        case 0: return [4 /*yield*/, this.projectService.SetEditProjectSettings(this.State, projectLookup)];
-                        case 1:
-                            _e.sent();
-                            return [2 /*return*/];
-                    }
-                });
-            }); });
-            this.appsFlowEventsSvc.UnpackLowCodeUnitEvent.subscribe(function (req) { return __awaiter(_this, void 0, void 0, function () {
-                return __generator(this, function (_e) {
-                    switch (_e.label) {
-                        case 0:
-                            if (!confirm("Are you sure you want to unpack application '" + req.ApplicationName + "' with version '" + req.Version + "'?")) return [3 /*break*/, 2];
-                            return [4 /*yield*/, this.projectService.UnpackLowCodeUnit(this.State, req)];
-                        case 1:
-                            _e.sent();
-                            _e.label = 2;
-                        case 2: return [2 /*return*/];
-                    }
-                });
-            }); });
-        };
-        return ApplicationsFlowProjectsElementComponent;
-    }(i2.LcuElementComponent));
-    ApplicationsFlowProjectsElementComponent.decorators = [
-        { type: i0.Component, args: [{
-                    selector: SELECTOR_APPLICATIONS_FLOW_PROJECTS_ELEMENT,
-                    template: "<app-host-dashboard-card-element\r\n  [context]=\"{ Title: 'Projects', Icon: 'language' }\"\r\n>\r\n  <nav>\r\n    <mat-form-field\r\n      class=\"mat-full-width\"\r\n      *ngIf=\"State.Enterprises?.length > 1\"\r\n    >\r\n      <mat-select\r\n        placeholder=\"Active Enterprise ({{ State.ActiveEnterpriseLookup }})\"\r\n        [value]=\"State.ActiveEnterpriseLookup\"\r\n        (selectionChange)=\"ActiveEnterpriseChanged($event)\"\r\n      >\r\n        <mat-option [value]=\"ent.Lookup\" *ngFor=\"let ent of State.Enterprises\">\r\n          {{ ent.Name }}\r\n        </mat-option>\r\n      </mat-select>\r\n\r\n      <!-- Toggle between Caged Krakyn and Unleashed Krakyn (Flow Tool) -->\r\n    </mat-form-field>\r\n\r\n    <a\r\n      mat-icon-button\r\n      href=\"/docs/getting-started/projects\"\r\n      target=\"_blank\"\r\n      lcuEvent=\"click\"\r\n      label=\"Projects\"\r\n      category=\"help\"\r\n    >\r\n      <mat-icon matTooltip=\"More info\">help_outline</mat-icon>\r\n    </a>\r\n  </nav>\r\n\r\n  <ng-container *ngIf=\"!State?.Loading\">\r\n    <div\r\n      fxLayout=\"column\"\r\n      fxLayoutAlign=\"center center\"\r\n      class=\"margin-bottom-4\"\r\n    >\r\n      <h2 class=\"mat-display-2 margin-y-2\" *ngIf=\"ProjectLookups?.length <= 0\">\r\n        <span> Thank you for signing up </span>\r\n      </h2>\r\n    </div>\r\n\r\n    <!-- <lcu-git-auth *ngIf=\"!State.GitHub.HasConnection\"></lcu-git-auth> -->\r\n\r\n    <!-- *ngIf=\"State.GitHub.HasConnection\" -->\r\n    <ng-container> \r\n      <!-- <div *ngIf=\"!CreatingProject\">\r\n        Creating\r\n        <lcu-create-project-wizard></lcu-create-project-wizard>\r\n      </div> -->\r\n\r\n      <ng-container *ngIf=\"!State.Unleashed\">\r\n        <ng-container *ngIf=\"State\">\r\n          <lcu-projects-header\r\n            [creating-project]=\"CreatingProject\"\r\n            [projects]=\"State.EaC?.Projects\"\r\n            [selected-project-lookup]=\"EditingProjectLookup\"\r\n          ></lcu-projects-header>\r\n\r\n          <div *ngIf=\"EditingProject\">\r\n            <div class=\"divider margin-bottom-3\"></div>\r\n\r\n            <lcu-project-tabs\r\n              [applications]=\"State.EaC?.Applications\"\r\n              [dfs-modifiers]=\"State.EaC?.Modifiers\"\r\n              [hosts]=\"State.EaC?.Hosts\"\r\n              [project]=\"EditingProject\"\r\n              [project-lookup]=\"EditingProjectLookup\"\r\n              [environment]=\"ActiveEnvironment\"\r\n              [environment-lookup]=\"ActiveEnvironmentLookup\"\r\n              class=\"margin-top-3\"\r\n            >\r\n            </lcu-project-tabs>\r\n          </div>\r\n        </ng-container>\r\n      </ng-container>\r\n\r\n      <ng-container *ngIf=\"State.Unleashed\">\r\n        <!-- Shannon flow tool control implemented -->\r\n      </ng-container>\r\n    </ng-container>\r\n  </ng-container>\r\n\r\n  <div class=\"loading\" *ngIf=\"State?.Loading\">\r\n    <lcu-loader [loading]=\"State?.Loading\"></lcu-loader>\r\n\r\n    <div class=\"margin-3\">\r\n      <!-- <p *ngIf=\"!State.UserEnterpriseLookup\">Loading your projects</p> -->\r\n\r\n      <!-- <p *ngIf=\"State.UserEnterpriseLookup\">Loading your Dashboard.</p> -->\r\n    </div>\r\n  </div>\r\n\r\n  <!-- <div>\r\n    <pre>{{ State | json }}</pre>\r\n  </div> -->\r\n</app-host-dashboard-card-element>\r\n",
-                    styles: ["@import url(\"https://fonts.googleapis.com/icon?family=Material+Icons\");@import url(\"https://fonts.googleapis.com/css?family=Encode+Sans+Condensed:400,900&display=swap\");@import url(\"https://fonts.googleapis.com/css?family=Open+Sans:300,400,700&display=swap\");.disable-autofill-background-default input:-webkit-autofill,.disable-autofill-background-default input:-webkit-autofill:focus,.disable-autofill-background-default input:-webkit-autofill:hover,.disable-autofill-background-default select:-webkit-autofill,.disable-autofill-background-default select:-webkit-autofill:focus,.disable-autofill-background-default select:-webkit-autofill:hover,.disable-autofill-background-default textarea:-webkit-autofill,.disable-autofill-background-default textarea:-webkit-autofill:focus,.disable-autofill-background-default textarea:-webkit-autofill:hover{-webkit-transition:background-color 5000s!important;transition:background-color 5000s!important}.list-item-disabled{cursor:not-allowed!important;filter:alpha(opacity=50);opacity:.5}.filler{display:inline-block!important;flex:1 1 auto}.sticky{position:-webkit-sticky;position:sticky;top:0;z-index:750}.inline{display:inline-block}.contents,.page-element{display:contents}.mat-spinner{margin:auto}.mat-full-width{width:100%}.spread{margin:2rem}.spread-thin{margin:1rem}.overlay{position:-webkit-sticky!important;position:sticky!important}.overlay.top{top:0}.overlay.bottom{bottom:0}.margin-0{margin:0!important}.margin-top-0,.margin-y-0{margin-top:0!important}.margin-right-0,.margin-x-0{margin-right:0!important}.margin-bottom-0,.margin-y-0{margin-bottom:0!important}.margin-left-0,.margin-x-0{margin-left:0!important}.margin-1{margin:.25rem!important}.margin-top-1,.margin-y-1{margin-top:.25rem!important}.margin-right-1,.margin-x-1{margin-right:.25rem!important}.margin-bottom-1,.margin-y-1{margin-bottom:.25rem!important}.margin-left-1,.margin-x-1{margin-left:.25rem!important}.margin-2{margin:.5rem!important}.margin-top-2,.margin-y-2{margin-top:.5rem!important}.margin-right-2,.margin-x-2{margin-right:.5rem!important}.margin-bottom-2,.margin-y-2{margin-bottom:.5rem!important}.margin-left-2,.margin-x-2{margin-left:.5rem!important}.margin-3{margin:1rem!important}.margin-top-3,.margin-y-3{margin-top:1rem!important}.margin-top-bottom-3{margin:1rem 0!important}.margin-right-3,.margin-x-3{margin-right:1rem!important}.margin-bottom-3,.margin-y-3{margin-bottom:1rem!important}.margin-left-3,.margin-x-3{margin-left:1rem!important}.margin-4{margin:2rem!important}.margin-top-4,.margin-y-4{margin-top:2rem!important}.margin-right-4,.margin-x-4{margin-right:2rem!important}.margin-bottom-4,.margin-y-4{margin-bottom:2rem!important}.margin-left-4,.margin-x-4{margin-left:2rem!important}.margin-right-5,.margin-x-5{margin-right:4rem!important}.margin-bottom-5,.margin-y-5{margin-bottom:4rem!important}.margin-left-5,.margin-x-5{margin-left:4rem!important}.margin-5{margin:4rem!important}.margin-top-5,.margin-y-5{margin-top:4rem!important}.margin-right-6,.margin-x-6{margin-right:4.5rem!important}.margin-bottom-6,.margin-y-6{margin-bottom:4.5rem!important}.margin-left-6,.margin-x-6{margin-left:4.5rem!important}.margin-7{margin:6rem!important}.margin-top-7,.margin-y-7{margin-top:6rem!important}.margin-right-7,.margin-x-7{margin-right:6rem!important}.margin-bottom-7,.margin-y-7{margin-bottom:6rem!important}.margin-left-7,.margin-x-7{margin-left:6rem!important}.margin-8{margin:7.5rem!important}.margin-top-8,.margin-y-8{margin-top:7.5rem!important}.margin-right-8,.margin-x-8{margin-right:7.5rem!important}.margin-bottom-8,.margin-y-8{margin-bottom:7.5rem!important}.margin-left-8,.margin-x-8{margin-left:7.5rem!important}.margin-9{margin:9rem!important}.margin-top-9,.margin-y-9{margin-top:9rem!important}.margin-right-9,.margin-x-9{margin-right:9rem!important}.margin-bottom-9,.margin-y-9{margin-bottom:9rem!important}.margin-left-9,.margin-x-9{margin-left:9rem!important}.padding-0{padding:0!important}.padding-top-0,.padding-y-0{padding-top:0!important}.padding-right-0,.padding-x-0{padding-right:0!important}.padding-bottom-0,.padding-y-0{padding-bottom:0!important}.padding-left-0,.padding-x-0{padding-left:0!important}.padding-1{padding:.25rem!important}.padding-top-1,.padding-y-1{padding-top:.25rem!important}.padding-right-1,.padding-x-1{padding-right:.25rem!important}.padding-bottom-1,.padding-y-1{padding-bottom:.25rem!important}.padding-left-1,.padding-x-1{padding-left:.25rem!important}.padding-2{padding:.5rem!important}.padding-top-2,.padding-y-2{padding-top:.5rem!important}.padding-right-2,.padding-x-2{padding-right:.5rem!important}.padding-bottom-2,.padding-y-2{padding-bottom:.5rem!important}.padding-left-2,.padding-x-2{padding-left:.5rem!important}.padding-3{padding:1rem!important}.padding-top-3,.padding-y-3{padding-top:1rem!important}.padding-right-3,.padding-x-3{padding-right:1rem!important}.padding-bottom-3,.padding-y-3{padding-bottom:1rem!important}.padding-left-3,.padding-x-3{padding-left:1rem!important}.padding-4{padding:2rem!important}.padding-top-4,.padding-y-4{padding-top:2rem!important}.padding-right-4,.padding-x-4{padding-right:2rem!important}.padding-bottom-4,.padding-y-4{padding-bottom:2rem!important}.padding-left-4,.padding-x-4{padding-left:2rem!important}.padding-5{padding:4rem!important}.padding-top-5,.padding-y-5{padding-top:4rem!important}.padding-right-5,.padding-x-5{padding-right:4rem!important}.padding-bottom-5,.padding-y-5{padding-bottom:4rem!important}.padding-left-5,.padding-x-5{padding-left:4rem!important}.margin-n1{margin:-.25rem!important}.margin-top-n1,.margin-y-n1{margin-top:-.25rem!important}.margin-right-n1,.margin-x-n1{margin-right:-.25rem!important}.margin-bottom-n1,.margin-y-n1{margin-bottom:-.25rem!important}.margin-left-n1,.margin-x-n1{margin-left:-.25rem!important}.margin-n2{margin:-.5rem!important}.margin-top-n2,.margin-y-n2{margin-top:-.5rem!important}.margin-right-n2,.margin-x-n2{margin-right:-.5rem!important}.margin-bottom-n2,.margin-y-n2{margin-bottom:-.5rem!important}.margin-left-n2,.margin-x-n2{margin-left:-.5rem!important}.margin-n3{margin:-1rem!important}.margin-top-n3,.margin-y-n3{margin-top:-1rem!important}.margin-right-n3,.margin-x-n3{margin-right:-1rem!important}.margin-bottom-n3,.margin-y-n3{margin-bottom:-1rem!important}.margin-left-n3,.margin-x-n3{margin-left:-1rem!important}.margin-n4{margin:-2rem!important}.margin-top-n4,.margin-y-n4{margin-top:-2rem!important}.margin-right-n4,.margin-x-n4{margin-right:-2rem!important}.margin-bottom-n4,.margin-y-n4{margin-bottom:-2rem!important}.margin-left-n4,.margin-x-n4{margin-left:-2rem!important}.margin-n5{margin:-4rem!important}.margin-top-n5,.margin-y-n5{margin-top:-4rem!important}.margin-right-n5,.margin-x-n5{margin-right:-4rem!important}.margin-bottom-n5,.margin-y-n5{margin-bottom:-4rem!important}.margin-left-n5,.margin-x-n5{margin-left:-4rem!important}.margin-auto{margin:auto!important}.margin-top-auto,.margin-y-auto{margin-top:auto!important}.margin-right-auto,.margin-x-auto{margin-right:auto!important}.margin-bottom-auto,.margin-y-auto{margin-bottom:auto!important}.margin-left-auto,.margin-x-auto{margin-left:auto!important}@media (min-width:576px){.margin-sm-0{margin:0!important}.margin-top-sm-0,.margin-y-sm-0{margin-top:0!important}.margin-right-sm-0,.margin-x-sm-0{margin-right:0!important}.margin-bottom-sm-0,.margin-y-sm-0{margin-bottom:0!important}.margin-left-sm-0,.margin-x-sm-0{margin-left:0!important}.margin-sm-1{margin:.25rem!important}.margin-top-sm-1,.margin-y-sm-1{margin-top:.25rem!important}.margin-right-sm-1,.margin-x-sm-1{margin-right:.25rem!important}.margin-bottom-sm-1,.margin-y-sm-1{margin-bottom:.25rem!important}.margin-left-sm-1,.margin-x-sm-1{margin-left:.25rem!important}.margin-sm-2{margin:.5rem!important}.margin-top-sm-2,.margin-y-sm-2{margin-top:.5rem!important}.margin-right-sm-2,.margin-x-sm-2{margin-right:.5rem!important}.margin-bottom-sm-2,.margin-y-sm-2{margin-bottom:.5rem!important}.margin-left-sm-2,.margin-x-sm-2{margin-left:.5rem!important}.margin-sm-3{margin:1rem!important}.margin-top-sm-3,.margin-y-sm-3{margin-top:1rem!important}.margin-right-sm-3,.margin-x-sm-3{margin-right:1rem!important}.margin-bottom-sm-3,.margin-y-sm-3{margin-bottom:1rem!important}.margin-left-sm-3,.margin-x-sm-3{margin-left:1rem!important}.margin-sm-4{margin:2rem!important}.margin-top-sm-4,.margin-y-sm-4{margin-top:2rem!important}.margin-right-sm-4,.margin-x-sm-4{margin-right:2rem!important}.margin-bottom-sm-4,.margin-y-sm-4{margin-bottom:2rem!important}.margin-left-sm-4,.margin-x-sm-4{margin-left:2rem!important}.margin-sm-5{margin:4rem!important}.margin-top-sm-5,.margin-y-sm-5{margin-top:4rem!important}.margin-right-sm-5,.margin-x-sm-5{margin-right:4rem!important}.margin-bottom-sm-5,.margin-y-sm-5{margin-bottom:4rem!important}.margin-left-sm-5,.margin-x-sm-5{margin-left:4rem!important}.padding-sm-0{padding:0!important}.padding-top-sm-0,.padding-y-sm-0{padding-top:0!important}.padding-right-sm-0,.padding-x-sm-0{padding-right:0!important}.padding-bottom-sm-0,.padding-y-sm-0{padding-bottom:0!important}.padding-left-sm-0,.padding-x-sm-0{padding-left:0!important}.padding-sm-1{padding:.25rem!important}.padding-top-sm-1,.padding-y-sm-1{padding-top:.25rem!important}.padding-right-sm-1,.padding-x-sm-1{padding-right:.25rem!important}.padding-bottom-sm-1,.padding-y-sm-1{padding-bottom:.25rem!important}.padding-left-sm-1,.padding-x-sm-1{padding-left:.25rem!important}.padding-sm-2{padding:.5rem!important}.padding-top-sm-2,.padding-y-sm-2{padding-top:.5rem!important}.padding-right-sm-2,.padding-x-sm-2{padding-right:.5rem!important}.padding-bottom-sm-2,.padding-y-sm-2{padding-bottom:.5rem!important}.padding-left-sm-2,.padding-x-sm-2{padding-left:.5rem!important}.padding-sm-3{padding:1rem!important}.padding-top-sm-3,.padding-y-sm-3{padding-top:1rem!important}.padding-right-sm-3,.padding-x-sm-3{padding-right:1rem!important}.padding-bottom-sm-3,.padding-y-sm-3{padding-bottom:1rem!important}.padding-left-sm-3,.padding-x-sm-3{padding-left:1rem!important}.padding-sm-4{padding:2rem!important}.padding-top-sm-4,.padding-y-sm-4{padding-top:2rem!important}.padding-right-sm-4,.padding-x-sm-4{padding-right:2rem!important}.padding-bottom-sm-4,.padding-y-sm-4{padding-bottom:2rem!important}.padding-left-sm-4,.padding-x-sm-4{padding-left:2rem!important}.padding-sm-5{padding:4rem!important}.padding-top-sm-5,.padding-y-sm-5{padding-top:4rem!important}.padding-right-sm-5,.padding-x-sm-5{padding-right:4rem!important}.padding-bottom-sm-5,.padding-y-sm-5{padding-bottom:4rem!important}.padding-left-sm-5,.padding-x-sm-5{padding-left:4rem!important}.margin-sm-n1{margin:-.25rem!important}.margin-top-sm-n1,.margin-y-sm-n1{margin-top:-.25rem!important}.margin-right-sm-n1,.margin-x-sm-n1{margin-right:-.25rem!important}.margin-bottom-sm-n1,.margin-y-sm-n1{margin-bottom:-.25rem!important}.margin-left-sm-n1,.margin-x-sm-n1{margin-left:-.25rem!important}.margin-sm-n2{margin:-.5rem!important}.margin-top-sm-n2,.margin-y-sm-n2{margin-top:-.5rem!important}.margin-right-sm-n2,.margin-x-sm-n2{margin-right:-.5rem!important}.margin-bottom-sm-n2,.margin-y-sm-n2{margin-bottom:-.5rem!important}.margin-left-sm-n2,.margin-x-sm-n2{margin-left:-.5rem!important}.margin-sm-n3{margin:-1rem!important}.margin-top-sm-n3,.margin-y-sm-n3{margin-top:-1rem!important}.margin-right-sm-n3,.margin-x-sm-n3{margin-right:-1rem!important}.margin-bottom-sm-n3,.margin-y-sm-n3{margin-bottom:-1rem!important}.margin-left-sm-n3,.margin-x-sm-n3{margin-left:-1rem!important}.margin-sm-n4{margin:-2rem!important}.margin-top-sm-n4,.margin-y-sm-n4{margin-top:-2rem!important}.margin-right-sm-n4,.margin-x-sm-n4{margin-right:-2rem!important}.margin-bottom-sm-n4,.margin-y-sm-n4{margin-bottom:-2rem!important}.margin-left-sm-n4,.margin-x-sm-n4{margin-left:-2rem!important}.margin-sm-n5{margin:-4rem!important}.margin-top-sm-n5,.margin-y-sm-n5{margin-top:-4rem!important}.margin-right-sm-n5,.margin-x-sm-n5{margin-right:-4rem!important}.margin-bottom-sm-n5,.margin-y-sm-n5{margin-bottom:-4rem!important}.margin-left-sm-n5,.margin-x-sm-n5{margin-left:-4rem!important}.margin-sm-auto{margin:auto!important}.margin-top-sm-auto,.margin-y-sm-auto{margin-top:auto!important}.margin-right-sm-auto,.margin-x-sm-auto{margin-right:auto!important}.margin-bottom-sm-auto,.margin-y-sm-auto{margin-bottom:auto!important}.margin-left-sm-auto,.margin-x-sm-auto{margin-left:auto!important}}@media (min-width:768px){.margin-md-0{margin:0!important}.margin-top-md-0,.margin-y-md-0{margin-top:0!important}.margin-right-md-0,.margin-x-md-0{margin-right:0!important}.margin-bottom-md-0,.margin-y-md-0{margin-bottom:0!important}.margin-left-md-0,.margin-x-md-0{margin-left:0!important}.margin-md-1{margin:.25rem!important}.margin-top-md-1,.margin-y-md-1{margin-top:.25rem!important}.margin-right-md-1,.margin-x-md-1{margin-right:.25rem!important}.margin-bottom-md-1,.margin-y-md-1{margin-bottom:.25rem!important}.margin-left-md-1,.margin-x-md-1{margin-left:.25rem!important}.margin-md-2{margin:.5rem!important}.margin-top-md-2,.margin-y-md-2{margin-top:.5rem!important}.margin-right-md-2,.margin-x-md-2{margin-right:.5rem!important}.margin-bottom-md-2,.margin-y-md-2{margin-bottom:.5rem!important}.margin-left-md-2,.margin-x-md-2{margin-left:.5rem!important}.margin-md-3{margin:1rem!important}.margin-top-md-3,.margin-y-md-3{margin-top:1rem!important}.margin-right-md-3,.margin-x-md-3{margin-right:1rem!important}.margin-bottom-md-3,.margin-y-md-3{margin-bottom:1rem!important}.margin-left-md-3,.margin-x-md-3{margin-left:1rem!important}.margin-md-4{margin:2rem!important}.margin-top-md-4,.margin-y-md-4{margin-top:2rem!important}.margin-right-md-4,.margin-x-md-4{margin-right:2rem!important}.margin-bottom-md-4,.margin-y-md-4{margin-bottom:2rem!important}.margin-left-md-4,.margin-x-md-4{margin-left:2rem!important}.margin-md-5{margin:4rem!important}.margin-top-md-5,.margin-y-md-5{margin-top:4rem!important}.margin-right-md-5,.margin-x-md-5{margin-right:4rem!important}.margin-bottom-md-5,.margin-y-md-5{margin-bottom:4rem!important}.margin-left-md-5,.margin-x-md-5{margin-left:4rem!important}.padding-md-0{padding:0!important}.padding-top-md-0,.padding-y-md-0{padding-top:0!important}.padding-right-md-0,.padding-x-md-0{padding-right:0!important}.padding-bottom-md-0,.padding-y-md-0{padding-bottom:0!important}.padding-left-md-0,.padding-x-md-0{padding-left:0!important}.padding-md-1{padding:.25rem!important}.padding-top-md-1,.padding-y-md-1{padding-top:.25rem!important}.padding-right-md-1,.padding-x-md-1{padding-right:.25rem!important}.padding-bottom-md-1,.padding-y-md-1{padding-bottom:.25rem!important}.padding-left-md-1,.padding-x-md-1{padding-left:.25rem!important}.padding-md-2{padding:.5rem!important}.padding-top-md-2,.padding-y-md-2{padding-top:.5rem!important}.padding-right-md-2,.padding-x-md-2{padding-right:.5rem!important}.padding-bottom-md-2,.padding-y-md-2{padding-bottom:.5rem!important}.padding-left-md-2,.padding-x-md-2{padding-left:.5rem!important}.padding-md-3{padding:1rem!important}.padding-top-md-3,.padding-y-md-3{padding-top:1rem!important}.padding-right-md-3,.padding-x-md-3{padding-right:1rem!important}.padding-bottom-md-3,.padding-y-md-3{padding-bottom:1rem!important}.padding-left-md-3,.padding-x-md-3{padding-left:1rem!important}.padding-md-4{padding:2rem!important}.padding-top-md-4,.padding-y-md-4{padding-top:2rem!important}.padding-right-md-4,.padding-x-md-4{padding-right:2rem!important}.padding-bottom-md-4,.padding-y-md-4{padding-bottom:2rem!important}.padding-left-md-4,.padding-x-md-4{padding-left:2rem!important}.padding-md-5{padding:4rem!important}.padding-top-md-5,.padding-y-md-5{padding-top:4rem!important}.padding-right-md-5,.padding-x-md-5{padding-right:4rem!important}.padding-bottom-md-5,.padding-y-md-5{padding-bottom:4rem!important}.padding-left-md-5,.padding-x-md-5{padding-left:4rem!important}.margin-md-n1{margin:-.25rem!important}.margin-top-md-n1,.margin-y-md-n1{margin-top:-.25rem!important}.margin-right-md-n1,.margin-x-md-n1{margin-right:-.25rem!important}.margin-bottom-md-n1,.margin-y-md-n1{margin-bottom:-.25rem!important}.margin-left-md-n1,.margin-x-md-n1{margin-left:-.25rem!important}.margin-md-n2{margin:-.5rem!important}.margin-top-md-n2,.margin-y-md-n2{margin-top:-.5rem!important}.margin-right-md-n2,.margin-x-md-n2{margin-right:-.5rem!important}.margin-bottom-md-n2,.margin-y-md-n2{margin-bottom:-.5rem!important}.margin-left-md-n2,.margin-x-md-n2{margin-left:-.5rem!important}.margin-md-n3{margin:-1rem!important}.margin-top-md-n3,.margin-y-md-n3{margin-top:-1rem!important}.margin-right-md-n3,.margin-x-md-n3{margin-right:-1rem!important}.margin-bottom-md-n3,.margin-y-md-n3{margin-bottom:-1rem!important}.margin-left-md-n3,.margin-x-md-n3{margin-left:-1rem!important}.margin-md-n4{margin:-2rem!important}.margin-top-md-n4,.margin-y-md-n4{margin-top:-2rem!important}.margin-right-md-n4,.margin-x-md-n4{margin-right:-2rem!important}.margin-bottom-md-n4,.margin-y-md-n4{margin-bottom:-2rem!important}.margin-left-md-n4,.margin-x-md-n4{margin-left:-2rem!important}.margin-md-n5{margin:-4rem!important}.margin-top-md-n5,.margin-y-md-n5{margin-top:-4rem!important}.margin-right-md-n5,.margin-x-md-n5{margin-right:-4rem!important}.margin-bottom-md-n5,.margin-y-md-n5{margin-bottom:-4rem!important}.margin-left-md-n5,.margin-x-md-n5{margin-left:-4rem!important}.margin-md-auto{margin:auto!important}.margin-top-md-auto,.margin-y-md-auto{margin-top:auto!important}.margin-right-md-auto,.margin-x-md-auto{margin-right:auto!important}.margin-bottom-md-auto,.margin-y-md-auto{margin-bottom:auto!important}.margin-left-md-auto,.margin-x-md-auto{margin-left:auto!important}}@media (min-width:992px){.margin-lg-0{margin:0!important}.margin-top-lg-0,.margin-y-lg-0{margin-top:0!important}.margin-right-lg-0,.margin-x-lg-0{margin-right:0!important}.margin-bottom-lg-0,.margin-y-lg-0{margin-bottom:0!important}.margin-left-lg-0,.margin-x-lg-0{margin-left:0!important}.margin-lg-1{margin:.25rem!important}.margin-top-lg-1,.margin-y-lg-1{margin-top:.25rem!important}.margin-right-lg-1,.margin-x-lg-1{margin-right:.25rem!important}.margin-bottom-lg-1,.margin-y-lg-1{margin-bottom:.25rem!important}.margin-left-lg-1,.margin-x-lg-1{margin-left:.25rem!important}.margin-lg-2{margin:.5rem!important}.margin-top-lg-2,.margin-y-lg-2{margin-top:.5rem!important}.margin-right-lg-2,.margin-x-lg-2{margin-right:.5rem!important}.margin-bottom-lg-2,.margin-y-lg-2{margin-bottom:.5rem!important}.margin-left-lg-2,.margin-x-lg-2{margin-left:.5rem!important}.margin-lg-3{margin:1rem!important}.margin-top-lg-3,.margin-y-lg-3{margin-top:1rem!important}.margin-right-lg-3,.margin-x-lg-3{margin-right:1rem!important}.margin-bottom-lg-3,.margin-y-lg-3{margin-bottom:1rem!important}.margin-left-lg-3,.margin-x-lg-3{margin-left:1rem!important}.margin-lg-4{margin:2rem!important}.margin-top-lg-4,.margin-y-lg-4{margin-top:2rem!important}.margin-right-lg-4,.margin-x-lg-4{margin-right:2rem!important}.margin-bottom-lg-4,.margin-y-lg-4{margin-bottom:2rem!important}.margin-left-lg-4,.margin-x-lg-4{margin-left:2rem!important}.margin-lg-5{margin:4rem!important}.margin-top-lg-5,.margin-y-lg-5{margin-top:4rem!important}.margin-right-lg-5,.margin-x-lg-5{margin-right:4rem!important}.margin-bottom-lg-5,.margin-y-lg-5{margin-bottom:4rem!important}.margin-left-lg-5,.margin-x-lg-5{margin-left:4rem!important}.padding-lg-0{padding:0!important}.padding-top-lg-0,.padding-y-lg-0{padding-top:0!important}.padding-right-lg-0,.padding-x-lg-0{padding-right:0!important}.padding-bottom-lg-0,.padding-y-lg-0{padding-bottom:0!important}.padding-left-lg-0,.padding-x-lg-0{padding-left:0!important}.padding-lg-1{padding:.25rem!important}.padding-top-lg-1,.padding-y-lg-1{padding-top:.25rem!important}.padding-right-lg-1,.padding-x-lg-1{padding-right:.25rem!important}.padding-bottom-lg-1,.padding-y-lg-1{padding-bottom:.25rem!important}.padding-left-lg-1,.padding-x-lg-1{padding-left:.25rem!important}.padding-lg-2{padding:.5rem!important}.padding-top-lg-2,.padding-y-lg-2{padding-top:.5rem!important}.padding-right-lg-2,.padding-x-lg-2{padding-right:.5rem!important}.padding-bottom-lg-2,.padding-y-lg-2{padding-bottom:.5rem!important}.padding-left-lg-2,.padding-x-lg-2{padding-left:.5rem!important}.padding-lg-3{padding:1rem!important}.padding-top-lg-3,.padding-y-lg-3{padding-top:1rem!important}.padding-right-lg-3,.padding-x-lg-3{padding-right:1rem!important}.padding-bottom-lg-3,.padding-y-lg-3{padding-bottom:1rem!important}.padding-left-lg-3,.padding-x-lg-3{padding-left:1rem!important}.padding-lg-4{padding:2rem!important}.padding-top-lg-4,.padding-y-lg-4{padding-top:2rem!important}.padding-right-lg-4,.padding-x-lg-4{padding-right:2rem!important}.padding-bottom-lg-4,.padding-y-lg-4{padding-bottom:2rem!important}.padding-left-lg-4,.padding-x-lg-4{padding-left:2rem!important}.padding-lg-5{padding:4rem!important}.padding-top-lg-5,.padding-y-lg-5{padding-top:4rem!important}.padding-right-lg-5,.padding-x-lg-5{padding-right:4rem!important}.padding-bottom-lg-5,.padding-y-lg-5{padding-bottom:4rem!important}.padding-left-lg-5,.padding-x-lg-5{padding-left:4rem!important}.margin-lg-n1{margin:-.25rem!important}.margin-top-lg-n1,.margin-y-lg-n1{margin-top:-.25rem!important}.margin-right-lg-n1,.margin-x-lg-n1{margin-right:-.25rem!important}.margin-bottom-lg-n1,.margin-y-lg-n1{margin-bottom:-.25rem!important}.margin-left-lg-n1,.margin-x-lg-n1{margin-left:-.25rem!important}.margin-lg-n2{margin:-.5rem!important}.margin-top-lg-n2,.margin-y-lg-n2{margin-top:-.5rem!important}.margin-right-lg-n2,.margin-x-lg-n2{margin-right:-.5rem!important}.margin-bottom-lg-n2,.margin-y-lg-n2{margin-bottom:-.5rem!important}.margin-left-lg-n2,.margin-x-lg-n2{margin-left:-.5rem!important}.margin-lg-n3{margin:-1rem!important}.margin-top-lg-n3,.margin-y-lg-n3{margin-top:-1rem!important}.margin-right-lg-n3,.margin-x-lg-n3{margin-right:-1rem!important}.margin-bottom-lg-n3,.margin-y-lg-n3{margin-bottom:-1rem!important}.margin-left-lg-n3,.margin-x-lg-n3{margin-left:-1rem!important}.margin-lg-n4{margin:-2rem!important}.margin-top-lg-n4,.margin-y-lg-n4{margin-top:-2rem!important}.margin-right-lg-n4,.margin-x-lg-n4{margin-right:-2rem!important}.margin-bottom-lg-n4,.margin-y-lg-n4{margin-bottom:-2rem!important}.margin-left-lg-n4,.margin-x-lg-n4{margin-left:-2rem!important}.margin-lg-n5{margin:-4rem!important}.margin-top-lg-n5,.margin-y-lg-n5{margin-top:-4rem!important}.margin-right-lg-n5,.margin-x-lg-n5{margin-right:-4rem!important}.margin-bottom-lg-n5,.margin-y-lg-n5{margin-bottom:-4rem!important}.margin-left-lg-n5,.margin-x-lg-n5{margin-left:-4rem!important}.margin-lg-auto{margin:auto!important}.margin-top-lg-auto,.margin-y-lg-auto{margin-top:auto!important}.margin-right-lg-auto,.margin-x-lg-auto{margin-right:auto!important}.margin-bottom-lg-auto,.margin-y-lg-auto{margin-bottom:auto!important}.margin-left-lg-auto,.margin-x-lg-auto{margin-left:auto!important}}@media (min-width:1200px){.margin-xl-0{margin:0!important}.margin-top-xl-0,.margin-y-xl-0{margin-top:0!important}.margin-right-xl-0,.margin-x-xl-0{margin-right:0!important}.margin-bottom-xl-0,.margin-y-xl-0{margin-bottom:0!important}.margin-left-xl-0,.margin-x-xl-0{margin-left:0!important}.margin-xl-1{margin:.25rem!important}.margin-top-xl-1,.margin-y-xl-1{margin-top:.25rem!important}.margin-right-xl-1,.margin-x-xl-1{margin-right:.25rem!important}.margin-bottom-xl-1,.margin-y-xl-1{margin-bottom:.25rem!important}.margin-left-xl-1,.margin-x-xl-1{margin-left:.25rem!important}.margin-xl-2{margin:.5rem!important}.margin-top-xl-2,.margin-y-xl-2{margin-top:.5rem!important}.margin-right-xl-2,.margin-x-xl-2{margin-right:.5rem!important}.margin-bottom-xl-2,.margin-y-xl-2{margin-bottom:.5rem!important}.margin-left-xl-2,.margin-x-xl-2{margin-left:.5rem!important}.margin-xl-3{margin:1rem!important}.margin-top-xl-3,.margin-y-xl-3{margin-top:1rem!important}.margin-right-xl-3,.margin-x-xl-3{margin-right:1rem!important}.margin-bottom-xl-3,.margin-y-xl-3{margin-bottom:1rem!important}.margin-left-xl-3,.margin-x-xl-3{margin-left:1rem!important}.margin-xl-4{margin:2rem!important}.margin-top-xl-4,.margin-y-xl-4{margin-top:2rem!important}.margin-right-xl-4,.margin-x-xl-4{margin-right:2rem!important}.margin-bottom-xl-4,.margin-y-xl-4{margin-bottom:2rem!important}.margin-left-xl-4,.margin-x-xl-4{margin-left:2rem!important}.margin-xl-5{margin:4rem!important}.margin-top-xl-5,.margin-y-xl-5{margin-top:4rem!important}.margin-right-xl-5,.margin-x-xl-5{margin-right:4rem!important}.margin-bottom-xl-5,.margin-y-xl-5{margin-bottom:4rem!important}.margin-left-xl-5,.margin-x-xl-5{margin-left:4rem!important}.padding-xl-0{padding:0!important}.padding-top-xl-0,.padding-y-xl-0{padding-top:0!important}.padding-right-xl-0,.padding-x-xl-0{padding-right:0!important}.padding-bottom-xl-0,.padding-y-xl-0{padding-bottom:0!important}.padding-left-xl-0,.padding-x-xl-0{padding-left:0!important}.padding-xl-1{padding:.25rem!important}.padding-top-xl-1,.padding-y-xl-1{padding-top:.25rem!important}.padding-right-xl-1,.padding-x-xl-1{padding-right:.25rem!important}.padding-bottom-xl-1,.padding-y-xl-1{padding-bottom:.25rem!important}.padding-left-xl-1,.padding-x-xl-1{padding-left:.25rem!important}.padding-xl-2{padding:.5rem!important}.padding-top-xl-2,.padding-y-xl-2{padding-top:.5rem!important}.padding-right-xl-2,.padding-x-xl-2{padding-right:.5rem!important}.padding-bottom-xl-2,.padding-y-xl-2{padding-bottom:.5rem!important}.padding-left-xl-2,.padding-x-xl-2{padding-left:.5rem!important}.padding-xl-3{padding:1rem!important}.padding-top-xl-3,.padding-y-xl-3{padding-top:1rem!important}.padding-right-xl-3,.padding-x-xl-3{padding-right:1rem!important}.padding-bottom-xl-3,.padding-y-xl-3{padding-bottom:1rem!important}.padding-left-xl-3,.padding-x-xl-3{padding-left:1rem!important}.padding-xl-4{padding:2rem!important}.padding-top-xl-4,.padding-y-xl-4{padding-top:2rem!important}.padding-right-xl-4,.padding-x-xl-4{padding-right:2rem!important}.padding-bottom-xl-4,.padding-y-xl-4{padding-bottom:2rem!important}.padding-left-xl-4,.padding-x-xl-4{padding-left:2rem!important}.padding-xl-5{padding:4rem!important}.padding-top-xl-5,.padding-y-xl-5{padding-top:4rem!important}.padding-right-xl-5,.padding-x-xl-5{padding-right:4rem!important}.padding-bottom-xl-5,.padding-y-xl-5{padding-bottom:4rem!important}.padding-left-xl-5,.padding-x-xl-5{padding-left:4rem!important}.margin-xl-n1{margin:-.25rem!important}.margin-top-xl-n1,.margin-y-xl-n1{margin-top:-.25rem!important}.margin-right-xl-n1,.margin-x-xl-n1{margin-right:-.25rem!important}.margin-bottom-xl-n1,.margin-y-xl-n1{margin-bottom:-.25rem!important}.margin-left-xl-n1,.margin-x-xl-n1{margin-left:-.25rem!important}.margin-xl-n2{margin:-.5rem!important}.margin-top-xl-n2,.margin-y-xl-n2{margin-top:-.5rem!important}.margin-right-xl-n2,.margin-x-xl-n2{margin-right:-.5rem!important}.margin-bottom-xl-n2,.margin-y-xl-n2{margin-bottom:-.5rem!important}.margin-left-xl-n2,.margin-x-xl-n2{margin-left:-.5rem!important}.margin-xl-n3{margin:-1rem!important}.margin-top-xl-n3,.margin-y-xl-n3{margin-top:-1rem!important}.margin-right-xl-n3,.margin-x-xl-n3{margin-right:-1rem!important}.margin-bottom-xl-n3,.margin-y-xl-n3{margin-bottom:-1rem!important}.margin-left-xl-n3,.margin-x-xl-n3{margin-left:-1rem!important}.margin-xl-n4{margin:-2rem!important}.margin-top-xl-n4,.margin-y-xl-n4{margin-top:-2rem!important}.margin-right-xl-n4,.margin-x-xl-n4{margin-right:-2rem!important}.margin-bottom-xl-n4,.margin-y-xl-n4{margin-bottom:-2rem!important}.margin-left-xl-n4,.margin-x-xl-n4{margin-left:-2rem!important}.margin-xl-n5{margin:-4rem!important}.margin-top-xl-n5,.margin-y-xl-n5{margin-top:-4rem!important}.margin-right-xl-n5,.margin-x-xl-n5{margin-right:-4rem!important}.margin-bottom-xl-n5,.margin-y-xl-n5{margin-bottom:-4rem!important}.margin-left-xl-n5,.margin-x-xl-n5{margin-left:-4rem!important}.margin-xl-auto{margin:auto!important}.margin-top-xl-auto,.margin-y-xl-auto{margin-top:auto!important}.margin-right-xl-auto,.margin-x-xl-auto{margin-right:auto!important}.margin-bottom-xl-auto,.margin-y-xl-auto{margin-bottom:auto!important}.margin-left-xl-auto,.margin-x-xl-auto{margin-left:auto!important}}.h1{font-size:2em}.h2{font-size:1.5em}.h3{font-size:1.17em}.h4{font-size:1em}.h5{font-size:.83em}.h6{font-size:.67em}.cursor-alias{cursor:alias}.cursor-all-scroll{cursor:all-scroll}.cursor-auto{cursor:auto}.cursor-cell{cursor:cell}.cursor-context-menu{cursor:context-menu}.cursor-col-resize{cursor:col-resize}.cursor-copy{cursor:copy}.cursor-crosshair{cursor:crosshair}.cursor-default{cursor:default}.cursor-e-resize{cursor:e-resize}.cursor-ew-resize{cursor:ew-resize}.cursor-grab{cursor:-webkit-grab;cursor:grab}.cursor-grabbing{cursor:-webkit-grabbing;cursor:grabbing}.cursor-help{cursor:help}.cursor-move{cursor:move}.cursor-n-resize{cursor:n-resize}.cursor-ne-resize{cursor:ne-resize}.cursor-nesw-resize{cursor:nesw-resize}.cursor-ns-resize{cursor:ns-resize}.cursor-nw-resize{cursor:nw-resize}.cursor-nwse-resize{cursor:nwse-resize}.cursor-no-drop{cursor:no-drop}.cursor-none{cursor:none}.cursor-not-allowed{cursor:not-allowed}.cursor-pointer{cursor:pointer}.cursor-progress{cursor:progress}.cursor-row-resize{cursor:row-resize}.cursor-s-resize{cursor:s-resize}.cursor-se-resize{cursor:se-resize}.cursor-sw-resize{cursor:sw-resize}.cursor-text{cursor:text}.cursor-w-resize{cursor:w-resize}.cursor-wait{cursor:wait}.cursor-zoom-in{cursor:zoom-in}.cursor-zoom-out{cursor:zoom-out}.mat-tooltip{font-size:15px!important}body,html{height:100%}body{font-family:opens sans regular,sans-serif;margin:0;padding:0}iframe{border:none}.mat-badge-content{font-family:Roboto,Helvetica Neue,sans-serif;font-size:12px;font-weight:600}.mat-badge-small .mat-badge-content{font-size:9px}.mat-badge-large .mat-badge-content{font-size:24px}.mat-h1,.mat-headline,.mat-typography h1{font:400 24px/32px Roboto,Helvetica Neue,sans-serif;letter-spacing:normal;margin:0 0 16px}.mat-h2,.mat-title,.mat-typography h2{font:500 20px/32px Roboto,Helvetica Neue,sans-serif;letter-spacing:normal;margin:0 0 16px}.mat-h3,.mat-subheading-2,.mat-typography h3{font:400 16px/28px Roboto,Helvetica Neue,sans-serif;letter-spacing:normal;margin:0 0 16px}.mat-h4,.mat-subheading-1,.mat-typography h4{font:400 15px/24px Roboto,Helvetica Neue,sans-serif;letter-spacing:normal;margin:0 0 16px}.mat-h5,.mat-typography h5{font:400 11.62px/20px Roboto,Helvetica Neue,sans-serif;margin:0 0 12px}.mat-h6,.mat-typography h6{font:400 9.38px/20px Roboto,Helvetica Neue,sans-serif;margin:0 0 12px}.mat-body-2,.mat-body-strong{font:500 14px/24px Roboto,Helvetica Neue,sans-serif;letter-spacing:normal}.mat-body,.mat-body-1,.mat-typography{font:400 14px/20px Roboto,Helvetica Neue,sans-serif;letter-spacing:normal}.mat-body-1 p,.mat-body p,.mat-typography p{margin:0 0 12px}.mat-caption,.mat-small{font:400 12px/20px Roboto,Helvetica Neue,sans-serif;letter-spacing:normal}.mat-display-4,.mat-typography .mat-display-4{font:300 112px/112px Roboto,Helvetica Neue,sans-serif;letter-spacing:-.05em;margin:0 0 56px}.mat-display-3,.mat-typography .mat-display-3{font:400 56px/56px Roboto,Helvetica Neue,sans-serif;letter-spacing:-.02em;margin:0 0 64px}.mat-display-2,.mat-typography .mat-display-2{font:400 45px/48px Roboto,Helvetica Neue,sans-serif;letter-spacing:-.005em;margin:0 0 64px}.mat-display-1,.mat-typography .mat-display-1{font:400 34px/40px Roboto,Helvetica Neue,sans-serif;letter-spacing:normal;margin:0 0 64px}.mat-bottom-sheet-container{font:400 14px/20px Roboto,Helvetica Neue,sans-serif;letter-spacing:normal}.mat-button,.mat-fab,.mat-flat-button,.mat-icon-button,.mat-mini-fab,.mat-raised-button,.mat-stroked-button{font-family:Roboto,Helvetica Neue,sans-serif;font-size:14px;font-weight:500}.mat-button-toggle,.mat-card{font-family:Roboto,Helvetica Neue,sans-serif}.mat-card-title{font-size:24px;font-weight:500}.mat-card-header .mat-card-title{font-size:20px}.mat-card-content,.mat-card-subtitle{font-size:14px}.mat-checkbox{font-family:Roboto,Helvetica Neue,sans-serif}.mat-checkbox-layout .mat-checkbox-label{line-height:24px}.mat-chip{font-size:14px;font-weight:500}.mat-chip .mat-chip-remove.mat-icon,.mat-chip .mat-chip-trailing-icon.mat-icon{font-size:18px}.mat-table{font-family:Roboto,Helvetica Neue,sans-serif}.mat-header-cell{font-size:12px;font-weight:500}.mat-cell,.mat-footer-cell{font-size:14px}.mat-calendar{font-family:Roboto,Helvetica Neue,sans-serif}.mat-calendar-body{font-size:13px}.mat-calendar-body-label,.mat-calendar-period-button{font-size:14px;font-weight:500}.mat-calendar-table-header th{font-size:11px;font-weight:400}.mat-dialog-title{font:500 20px/32px Roboto,Helvetica Neue,sans-serif;letter-spacing:normal}.mat-expansion-panel-header{font-family:Roboto,Helvetica Neue,sans-serif;font-size:15px;font-weight:400}.mat-expansion-panel-content{font:400 14px/20px Roboto,Helvetica Neue,sans-serif;letter-spacing:normal}.mat-form-field{font-family:Roboto,Helvetica Neue,sans-serif;font-size:inherit;font-weight:400;letter-spacing:normal;line-height:1.125}.mat-form-field-wrapper{padding-bottom:1.34375em}.mat-form-field-prefix .mat-icon,.mat-form-field-suffix .mat-icon{font-size:150%;line-height:1.125}.mat-form-field-prefix .mat-icon-button,.mat-form-field-suffix .mat-icon-button{height:1.5em;width:1.5em}.mat-form-field-prefix .mat-icon-button .mat-icon,.mat-form-field-suffix .mat-icon-button .mat-icon{height:1.125em;line-height:1.125}.mat-form-field-infix{border-top:.84375em solid transparent;padding:.5em 0}.mat-form-field-can-float.mat-form-field-should-float .mat-form-field-label,.mat-form-field-can-float .mat-input-server:focus+.mat-form-field-label-wrapper .mat-form-field-label{transform:translateY(-1.34375em) scale(.75);width:133.3333333333%}.mat-form-field-can-float .mat-input-server[label]:not(:label-shown)+.mat-form-field-label-wrapper .mat-form-field-label{transform:translateY(-1.34374em) scale(.75);width:133.3333433333%}.mat-form-field-label-wrapper{padding-top:.84375em;top:-.84375em}.mat-form-field-label{top:1.34375em}.mat-form-field-underline{bottom:1.34375em}.mat-form-field-subscript-wrapper{font-size:75%;margin-top:.6666666667em;top:calc(100% - 1.79167em)}.mat-form-field-appearance-legacy .mat-form-field-wrapper{padding-bottom:1.25em}.mat-form-field-appearance-legacy .mat-form-field-infix{padding:.4375em 0}.mat-form-field-appearance-legacy.mat-form-field-can-float.mat-form-field-should-float .mat-form-field-label,.mat-form-field-appearance-legacy.mat-form-field-can-float .mat-input-server:focus+.mat-form-field-label-wrapper .mat-form-field-label{-ms-transform:translateY(-1.28125em) scale(.75);transform:translateY(-1.28125em) scale(.75) perspective(100px) translateZ(.001px);width:133.3333333333%}.mat-form-field-appearance-legacy.mat-form-field-can-float .mat-form-field-autofill-control:-webkit-autofill+.mat-form-field-label-wrapper .mat-form-field-label{-ms-transform:translateY(-1.28124em) scale(.75);transform:translateY(-1.28125em) scale(.75) perspective(100px) translateZ(.00101px);width:133.3333433333%}.mat-form-field-appearance-legacy.mat-form-field-can-float .mat-input-server[label]:not(:label-shown)+.mat-form-field-label-wrapper .mat-form-field-label{-ms-transform:translateY(-1.28123em) scale(.75);transform:translateY(-1.28125em) scale(.75) perspective(100px) translateZ(.00102px);width:133.3333533333%}.mat-form-field-appearance-legacy .mat-form-field-label{top:1.28125em}.mat-form-field-appearance-legacy .mat-form-field-underline{bottom:1.25em}.mat-form-field-appearance-legacy .mat-form-field-subscript-wrapper{margin-top:.5416666667em;top:calc(100% - 1.66667em)}@media print{.mat-form-field-appearance-legacy.mat-form-field-can-float.mat-form-field-should-float .mat-form-field-label,.mat-form-field-appearance-legacy.mat-form-field-can-float .mat-input-server:focus+.mat-form-field-label-wrapper .mat-form-field-label{transform:translateY(-1.28122em) scale(.75)}.mat-form-field-appearance-legacy.mat-form-field-can-float .mat-form-field-autofill-control:-webkit-autofill+.mat-form-field-label-wrapper .mat-form-field-label{transform:translateY(-1.28121em) scale(.75)}.mat-form-field-appearance-legacy.mat-form-field-can-float .mat-input-server[label]:not(:label-shown)+.mat-form-field-label-wrapper .mat-form-field-label{transform:translateY(-1.2812em) scale(.75)}}.mat-form-field-appearance-fill .mat-form-field-infix{padding:.25em 0 .75em}.mat-form-field-appearance-fill .mat-form-field-label{margin-top:-.5em;top:1.09375em}.mat-form-field-appearance-fill.mat-form-field-can-float.mat-form-field-should-float .mat-form-field-label,.mat-form-field-appearance-fill.mat-form-field-can-float .mat-input-server:focus+.mat-form-field-label-wrapper .mat-form-field-label{transform:translateY(-.59375em) scale(.75);width:133.3333333333%}.mat-form-field-appearance-fill.mat-form-field-can-float .mat-input-server[label]:not(:label-shown)+.mat-form-field-label-wrapper .mat-form-field-label{transform:translateY(-.59374em) scale(.75);width:133.3333433333%}.mat-form-field-appearance-outline .mat-form-field-infix{padding:1em 0}.mat-form-field-appearance-outline .mat-form-field-label{margin-top:-.25em;top:1.84375em}.mat-form-field-appearance-outline.mat-form-field-can-float.mat-form-field-should-float .mat-form-field-label,.mat-form-field-appearance-outline.mat-form-field-can-float .mat-input-server:focus+.mat-form-field-label-wrapper .mat-form-field-label{transform:translateY(-1.59375em) scale(.75);width:133.3333333333%}.mat-form-field-appearance-outline.mat-form-field-can-float .mat-input-server[label]:not(:label-shown)+.mat-form-field-label-wrapper .mat-form-field-label{transform:translateY(-1.59374em) scale(.75);width:133.3333433333%}.mat-grid-tile-footer,.mat-grid-tile-header{font-size:14px}.mat-grid-tile-footer .mat-line,.mat-grid-tile-header .mat-line{box-sizing:border-box;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mat-grid-tile-footer .mat-line:nth-child(n+2),.mat-grid-tile-header .mat-line:nth-child(n+2){font-size:12px}input.mat-input-element{margin-top:-.0625em}.mat-menu-item{font-family:Roboto,Helvetica Neue,sans-serif;font-size:14px;font-weight:400}.mat-paginator,.mat-paginator-page-size .mat-select-trigger{font-family:Roboto,Helvetica Neue,sans-serif;font-size:12px}.mat-radio-button,.mat-select{font-family:Roboto,Helvetica Neue,sans-serif}.mat-select-trigger{height:1.125em}.mat-slide-toggle-content,.mat-slider-thumb-label-text{font-family:Roboto,Helvetica Neue,sans-serif}.mat-slider-thumb-label-text{font-size:12px;font-weight:500}.mat-stepper-horizontal,.mat-stepper-vertical{font-family:Roboto,Helvetica Neue,sans-serif}.mat-step-label{font-size:14px;font-weight:400}.mat-step-sub-label-error{font-weight:400}.mat-step-label-error{font-size:14px}.mat-step-label-selected{font-size:14px;font-weight:500}.mat-tab-group,.mat-tab-label,.mat-tab-link{font-family:Roboto,Helvetica Neue,sans-serif}.mat-tab-label,.mat-tab-link{font-size:14px;font-weight:500}.mat-toolbar,.mat-toolbar h1,.mat-toolbar h2,.mat-toolbar h3,.mat-toolbar h4,.mat-toolbar h5,.mat-toolbar h6{font:500 20px/32px Roboto,Helvetica Neue,sans-serif;letter-spacing:normal;margin:0}.mat-tooltip{font-family:Roboto,Helvetica Neue,sans-serif;font-size:10px;padding-bottom:6px;padding-top:6px}.mat-tooltip-handset{font-size:14px;padding-bottom:8px;padding-top:8px}.mat-list-item,.mat-list-option{font-family:Roboto,Helvetica Neue,sans-serif}.mat-list-base .mat-list-item{font-size:16px}.mat-list-base .mat-list-item .mat-line{box-sizing:border-box;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mat-list-base .mat-list-item .mat-line:nth-child(n+2){font-size:14px}.mat-list-base .mat-list-option{font-size:16px}.mat-list-base .mat-list-option .mat-line{box-sizing:border-box;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mat-list-base .mat-list-option .mat-line:nth-child(n+2){font-size:14px}.mat-list-base .mat-subheader{font-family:Roboto,Helvetica Neue,sans-serif;font-size:14px;font-weight:500}.mat-list-base[dense] .mat-list-item{font-size:12px}.mat-list-base[dense] .mat-list-item .mat-line{box-sizing:border-box;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mat-list-base[dense] .mat-list-item .mat-line:nth-child(n+2),.mat-list-base[dense] .mat-list-option{font-size:12px}.mat-list-base[dense] .mat-list-option .mat-line{box-sizing:border-box;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mat-list-base[dense] .mat-list-option .mat-line:nth-child(n+2){font-size:12px}.mat-list-base[dense] .mat-subheader{font-family:Roboto,Helvetica Neue,sans-serif;font-size:12px;font-weight:500}.mat-option{font-family:Roboto,Helvetica Neue,sans-serif;font-size:16px}.mat-optgroup-label{font:500 14px/24px Roboto,Helvetica Neue,sans-serif;letter-spacing:normal}.mat-simple-snackbar{font-family:Roboto,Helvetica Neue,sans-serif;font-size:14px}.mat-simple-snackbar-action{font-family:inherit;font-size:inherit;font-weight:500;line-height:1}.mat-tree{font-family:Roboto,Helvetica Neue,sans-serif}.mat-nested-tree-node,.mat-tree-node{font-size:14px;font-weight:400}.mat-ripple{overflow:hidden;position:relative}.mat-ripple:not(:empty){transform:translateZ(0)}.mat-ripple.mat-ripple-unbounded{overflow:visible}.mat-ripple-element{border-radius:50%;pointer-events:none;position:absolute;transform:scale(0);transition:opacity,transform 0ms cubic-bezier(0,0,.2,1)}.cdk-high-contrast-active .mat-ripple-element{display:none}.cdk-visually-hidden{-moz-appearance:none;-webkit-appearance:none;border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;outline:0;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.cdk-global-overlay-wrapper,.cdk-overlay-container{height:100%;left:0;pointer-events:none;top:0;width:100%}.cdk-overlay-container{position:fixed;z-index:1000}.cdk-overlay-container:empty{display:none}.cdk-global-overlay-wrapper,.cdk-overlay-pane{display:flex;position:absolute;z-index:1000}.cdk-overlay-pane{box-sizing:border-box;max-height:100%;max-width:100%;pointer-events:auto}.cdk-overlay-backdrop{-webkit-tap-highlight-color:transparent;bottom:0;left:0;opacity:0;pointer-events:auto;position:absolute;right:0;top:0;transition:opacity .4s cubic-bezier(.25,.8,.25,1);z-index:1000}.cdk-overlay-backdrop.cdk-overlay-backdrop-showing{opacity:1}.cdk-high-contrast-active .cdk-overlay-backdrop.cdk-overlay-backdrop-showing{opacity:.6}.cdk-overlay-dark-backdrop{background:rgba(0,0,0,.32)}.cdk-overlay-transparent-backdrop,.cdk-overlay-transparent-backdrop.cdk-overlay-backdrop-showing{opacity:0}.cdk-overlay-connected-position-bounding-box{display:flex;flex-direction:column;min-height:1px;min-width:1px;position:absolute;z-index:1000}.cdk-global-scrollblock{overflow-y:scroll;position:fixed;width:100%}@-webkit-keyframes cdk-text-field-autofill-start{\n  /*!*/}@keyframes cdk-text-field-autofill-start{\n  /*!*/}@-webkit-keyframes cdk-text-field-autofill-end{\n  /*!*/}@keyframes cdk-text-field-autofill-end{\n  /*!*/}.cdk-text-field-autofill-monitored:-webkit-autofill{-webkit-animation:cdk-text-field-autofill-start 0s 1ms;animation:cdk-text-field-autofill-start 0s 1ms}.cdk-text-field-autofill-monitored:not(:-webkit-autofill){-webkit-animation:cdk-text-field-autofill-end 0s 1ms;animation:cdk-text-field-autofill-end 0s 1ms}textarea.cdk-textarea-autosize{resize:none}textarea.cdk-textarea-autosize-measuring{box-sizing:content-box!important;height:auto!important;overflow:hidden!important;padding:2px 0!important}textarea.cdk-textarea-autosize-measuring-firefox{box-sizing:content-box!important;height:0!important;padding:2px 0!important}.mat-focus-indicator,.mat-mdc-focus-indicator{position:relative}.header,.title{font-family:Encode Sans Condensed,sans-serif;font-weight:900}.paragraph-title,.tagline{font-family:Open Sans,sans-serif;font-weight:400}.paragraph-title-bold .tagLine-bold{font-family:Open Sans,sans-serif;font-weight:700}.plain-text,.remarks{font-family:Open Sans,sans-serif;font-weight:300}.plain-text-bold{font-family:Open Sans,sans-serif;font-weight:700}.flex-column{flex-direction:column}.flex-column,.flex-row{box-sizing:border-box;display:flex}.flex-row{flex-direction:row}.flex-row-center{align-items:center;justify-content:center}.mat-button-large{font-size:18px;font-weight:700;line-height:48px;padding:0 24px!important}.mat-round{border-radius:.5em}:root{--background:#050505;--cyan-accent:rgba(132,255,255,0.75);--green-accent:#00e676;--initial-accent:#9cd8d7;--initial-dark-background:#222;--initial-dark-text:hsla(0,0%,100%,0.87);--initial-light-background:#f2f2f2;--initial-light-background:#fff;--initial-light-text:rgba(0,0,0,0.87);--initial-primary:#4a918e;--initial-warn:#ef4351;--orange-accent:#ff9800;--pink-accent:#e91e63;--purple-accent:#9c27b0;--success:#00e676;--yellow-accent:#fdd835}body{background-color:var(--initial-dark-background)}::ng-deep .mat-tooltip{font-size:16px!important}:host .valid-control{color:var(--green-accent)}:host .invalid-control{color:var(--theme-warn-500)}:host .actions .item:not(:last-child){margin-right:0}:host .project-thumbnail img{height:50px;width:auto}:host .active{background-color:var(--theme-accent-400)}:host .active,:host .inactive{transition:background-color 1s linear}:host .inactive{background-color:rgba(242,245,169,0)}:host .expansion-panel{margin-bottom:10px;width:100%}:host .expansion-container{max-height:300px;overflow-y:auto}:host .divider-fill-vert{background-color:var(--theme-accent-500);bottom:10%;min-height:100%;min-width:5px;top:10%}:host .divider-fill-hor{background-color:var(--theme-accent-500);height:5px;width:100%}:host .form-disabled{background-color:#797979;border-radius:4px;opacity:.5}::ng-deep input:-webkit-autofill,input:-webkit-autofill:active,input:-webkit-autofill:focus,input:-webkit-autofill:hover{-webkit-text-fill-color:hsla(0,0%,100%,.8705882352941177);-webkit-transition:background-color 5000s ease-in-out 0s;transition:background-color 5000s ease-in-out 0s}@media (max-width:768px){.spread{margin:1em!important}}@media (max-width:480px){.spread{margin:.5em!important}}.spinner-logo{display:none!important}:host ::ng-deep .project-image img{height:100%;width:100%}:host ::ng-deep .loading{text-align:center}:host ::ng-deep .divider{background-color:var(--theme-accent-500);height:1px;width:100%}:host ::ng-deep .spinner-logo{display:none!important}"]
-                },] }
-    ];
-    ApplicationsFlowProjectsElementComponent.ctorParameters = function () { return [
-        { type: i0.Injector },
-        { type: ApplicationsFlowService },
-        { type: ProjectService },
-        { type: ApplicationsFlowEventsService }
-    ]; };
-
-    var HostingDetailsFormGroupComponent = /** @class */ (function () {
-        //  Constructors
-        function HostingDetailsFormGroupComponent(formBuilder) {
-            this.formBuilder = formBuilder;
-        }
-        Object.defineProperty(HostingDetailsFormGroupComponent.prototype, "BuildPipelineFormControl", {
-            get: function () {
-                return this.FormGroup.get('buildPipeline');
-            },
-            enumerable: false,
-            configurable: true
-        });
-        Object.defineProperty(HostingDetailsFormGroupComponent.prototype, "DevOpsActionNameFormControl", {
-            get: function () {
-                return this.FormGroup.get('devOpsActionName');
-            },
-            enumerable: false,
-            configurable: true
-        });
-        Object.defineProperty(HostingDetailsFormGroupComponent.prototype, "FormGroup", {
-            get: function () {
-                return this.ParentFormGroup.get('hostingDetails');
-            },
-            enumerable: false,
-            configurable: true
-        });
-        Object.defineProperty(HostingDetailsFormGroupComponent.prototype, "NPMTokenFormControl", {
-            get: function () {
-                return this.FormGroup.get('npmToken');
-            },
-            enumerable: false,
-            configurable: true
-        });
-        Object.defineProperty(HostingDetailsFormGroupComponent.prototype, "SelectedHostingOption", {
-            get: function () {
-                var _this = this;
-                var _a, _b;
-                return (_b = (_a = this.Details) === null || _a === void 0 ? void 0 : _a.HostingOptions) === null || _b === void 0 ? void 0 : _b.find(function (ho) { return ho.Lookup === _this.BuildPipeline; });
-            },
-            enumerable: false,
-            configurable: true
-        });
-        Object.defineProperty(HostingDetailsFormGroupComponent.prototype, "SelectedHostingOptionInputControlValues", {
-            get: function () {
-                var _this = this;
-                var _a, _b;
-                return (_b = (_a = this.SelectedHostingOption) === null || _a === void 0 ? void 0 : _a.Inputs) === null || _b === void 0 ? void 0 : _b.reduce(function (prev, cur) {
-                    var res = Object.assign({}, prev);
-                    res[cur.Lookup] = _this.FormGroup.controls[cur.Lookup].value;
-                    return res;
-                }, {});
-            },
-            enumerable: false,
-            configurable: true
-        });
-        //  Life Cycle
-        HostingDetailsFormGroupComponent.prototype.ngOnChanges = function () { };
-        HostingDetailsFormGroupComponent.prototype.ngOnInit = function () {
-            var _a, _b, _c;
-            this.BuildPipeline =
-                this.BuildPipeline || ((_a = this.Details) === null || _a === void 0 ? void 0 : _a.HostingOptions)
-                    ? (_c = (_b = this.Details) === null || _b === void 0 ? void 0 : _b.HostingOptions[0]) === null || _c === void 0 ? void 0 : _c.Lookup : '';
-            if (this.FormGroup != null) {
-                this.ParentFormGroup.removeControl('hostingDetails');
-            }
-            this.ParentFormGroup.addControl('hostingDetails', this.formBuilder.group({
-                buildPipeline: [this.BuildPipeline, [forms.Validators.required]],
-            }));
-            this.setupControlsForForm();
+        return ApplicationsFlowProjectsElementComponent;
+    }(i2.LcuElementComponent));
+    ApplicationsFlowProjectsElementComponent.decorators = [
+        { type: i0.Component, args: [{
+                    selector: SELECTOR_APPLICATIONS_FLOW_PROJECTS_ELEMENT,
+                    template: "<app-host-dashboard-card-element\r\n  [context]=\"{ Title: 'Projects', Icon: 'language' }\"\r\n>\r\n  <nav>\r\n    <mat-form-field\r\n      class=\"mat-full-width\"\r\n      *ngIf=\"State.Enterprises?.length > 1\"\r\n    >\r\n      <mat-select\r\n        placeholder=\"Active Enterprise ({{ State.ActiveEnterpriseLookup }})\"\r\n        [value]=\"State.ActiveEnterpriseLookup\"\r\n        (selectionChange)=\"ActiveEnterpriseChanged($event)\"\r\n      >\r\n        <mat-option [value]=\"ent.Lookup\" *ngFor=\"let ent of State.Enterprises\">\r\n          {{ ent.Name }}\r\n        </mat-option>\r\n      </mat-select>\r\n\r\n      <!-- Toggle between Caged Krakyn and Unleashed Krakyn (Flow Tool) -->\r\n    </mat-form-field>\r\n\r\n    <a\r\n      mat-icon-button\r\n      href=\"/docs/getting-started/projects\"\r\n      target=\"_blank\"\r\n      lcuEvent=\"click\"\r\n      label=\"Projects\"\r\n      category=\"help\"\r\n    >\r\n      <mat-icon matTooltip=\"More info\">help_outline</mat-icon>\r\n    </a>\r\n  </nav>\r\n\r\n  <ng-container *ngIf=\"!State?.Loading\">\r\n    <div\r\n      fxLayout=\"column\"\r\n      fxLayoutAlign=\"center center\"\r\n      class=\"margin-bottom-4\"\r\n    >\r\n      <h2 class=\"mat-display-2 margin-y-2\" *ngIf=\"ProjectLookups?.length <= 0\">\r\n        <span> Thank you for signing up </span>\r\n      </h2>\r\n    </div>\r\n\r\n    <!-- <lcu-git-auth *ngIf=\"!State.GitHub.HasConnection\"></lcu-git-auth> -->\r\n\r\n    <!-- *ngIf=\"State.GitHub.HasConnection\" -->\r\n    <ng-container> \r\n      <!-- <div *ngIf=\"!CreatingProject\">\r\n        Creating\r\n        <lcu-create-project-wizard></lcu-create-project-wizard>\r\n      </div> -->\r\n\r\n      <ng-container *ngIf=\"!State.Unleashed\">\r\n        <ng-container *ngIf=\"State\">\r\n          <lcu-projects-header\r\n            [creating-project]=\"CreatingProject\"\r\n            [projects]=\"State.EaC?.Projects\"\r\n            [selected-project-lookup]=\"EditingProjectLookup\"\r\n          ></lcu-projects-header>\r\n\r\n          <div *ngIf=\"EditingProject\">\r\n            <div class=\"divider margin-bottom-3\"></div>\r\n\r\n            <lcu-project-tabs\r\n              [applications]=\"State.EaC?.Applications\"\r\n              [dfs-modifiers]=\"State.EaC?.Modifiers\"\r\n              [hosts]=\"State.EaC?.Hosts\"\r\n              [project]=\"EditingProject\"\r\n              [project-lookup]=\"EditingProjectLookup\"\r\n              [environment]=\"ActiveEnvironment\"\r\n              [environment-lookup]=\"ActiveEnvironmentLookup\"\r\n              class=\"margin-top-3\"\r\n            >\r\n            </lcu-project-tabs>\r\n          </div>\r\n        </ng-container>\r\n      </ng-container>\r\n\r\n      <ng-container *ngIf=\"State.Unleashed\">\r\n        <!-- Shannon flow tool control implemented -->\r\n      </ng-container>\r\n    </ng-container>\r\n  </ng-container>\r\n\r\n  <div class=\"loading\" *ngIf=\"State?.Loading\">\r\n    <lcu-loader [loading]=\"State?.Loading\"></lcu-loader>\r\n\r\n    <div class=\"margin-3\">\r\n      <!-- <p *ngIf=\"!State.UserEnterpriseLookup\">Loading your projects</p> -->\r\n\r\n      <!-- <p *ngIf=\"State.UserEnterpriseLookup\">Loading your Dashboard.</p> -->\r\n    </div>\r\n  </div>\r\n\r\n  <!-- <div>\r\n    <pre>{{ State | json }}</pre>\r\n  </div> -->\r\n</app-host-dashboard-card-element>\r\n",
+                    styles: ["@import url(\"https://fonts.googleapis.com/icon?family=Material+Icons\");@import url(\"https://fonts.googleapis.com/css?family=Encode+Sans+Condensed:400,900&display=swap\");@import url(\"https://fonts.googleapis.com/css?family=Open+Sans:300,400,700&display=swap\");.disable-autofill-background-default input:-webkit-autofill,.disable-autofill-background-default input:-webkit-autofill:focus,.disable-autofill-background-default input:-webkit-autofill:hover,.disable-autofill-background-default select:-webkit-autofill,.disable-autofill-background-default select:-webkit-autofill:focus,.disable-autofill-background-default select:-webkit-autofill:hover,.disable-autofill-background-default textarea:-webkit-autofill,.disable-autofill-background-default textarea:-webkit-autofill:focus,.disable-autofill-background-default textarea:-webkit-autofill:hover{-webkit-transition:background-color 5000s!important;transition:background-color 5000s!important}.list-item-disabled{cursor:not-allowed!important;filter:alpha(opacity=50);opacity:.5}.filler{display:inline-block!important;flex:1 1 auto}.sticky{position:-webkit-sticky;position:sticky;top:0;z-index:750}.inline{display:inline-block}.contents,.page-element{display:contents}.mat-spinner{margin:auto}.mat-full-width{width:100%}.spread{margin:2rem}.spread-thin{margin:1rem}.overlay{position:-webkit-sticky!important;position:sticky!important}.overlay.top{top:0}.overlay.bottom{bottom:0}.margin-0{margin:0!important}.margin-top-0,.margin-y-0{margin-top:0!important}.margin-right-0,.margin-x-0{margin-right:0!important}.margin-bottom-0,.margin-y-0{margin-bottom:0!important}.margin-left-0,.margin-x-0{margin-left:0!important}.margin-1{margin:.25rem!important}.margin-top-1,.margin-y-1{margin-top:.25rem!important}.margin-right-1,.margin-x-1{margin-right:.25rem!important}.margin-bottom-1,.margin-y-1{margin-bottom:.25rem!important}.margin-left-1,.margin-x-1{margin-left:.25rem!important}.margin-2{margin:.5rem!important}.margin-top-2,.margin-y-2{margin-top:.5rem!important}.margin-right-2,.margin-x-2{margin-right:.5rem!important}.margin-bottom-2,.margin-y-2{margin-bottom:.5rem!important}.margin-left-2,.margin-x-2{margin-left:.5rem!important}.margin-3{margin:1rem!important}.margin-top-3,.margin-y-3{margin-top:1rem!important}.margin-top-bottom-3{margin:1rem 0!important}.margin-right-3,.margin-x-3{margin-right:1rem!important}.margin-bottom-3,.margin-y-3{margin-bottom:1rem!important}.margin-left-3,.margin-x-3{margin-left:1rem!important}.margin-4{margin:2rem!important}.margin-top-4,.margin-y-4{margin-top:2rem!important}.margin-right-4,.margin-x-4{margin-right:2rem!important}.margin-bottom-4,.margin-y-4{margin-bottom:2rem!important}.margin-left-4,.margin-x-4{margin-left:2rem!important}.margin-right-5,.margin-x-5{margin-right:4rem!important}.margin-bottom-5,.margin-y-5{margin-bottom:4rem!important}.margin-left-5,.margin-x-5{margin-left:4rem!important}.margin-5{margin:4rem!important}.margin-top-5,.margin-y-5{margin-top:4rem!important}.margin-right-6,.margin-x-6{margin-right:4.5rem!important}.margin-bottom-6,.margin-y-6{margin-bottom:4.5rem!important}.margin-left-6,.margin-x-6{margin-left:4.5rem!important}.margin-7{margin:6rem!important}.margin-top-7,.margin-y-7{margin-top:6rem!important}.margin-right-7,.margin-x-7{margin-right:6rem!important}.margin-bottom-7,.margin-y-7{margin-bottom:6rem!important}.margin-left-7,.margin-x-7{margin-left:6rem!important}.margin-8{margin:7.5rem!important}.margin-top-8,.margin-y-8{margin-top:7.5rem!important}.margin-right-8,.margin-x-8{margin-right:7.5rem!important}.margin-bottom-8,.margin-y-8{margin-bottom:7.5rem!important}.margin-left-8,.margin-x-8{margin-left:7.5rem!important}.margin-9{margin:9rem!important}.margin-top-9,.margin-y-9{margin-top:9rem!important}.margin-right-9,.margin-x-9{margin-right:9rem!important}.margin-bottom-9,.margin-y-9{margin-bottom:9rem!important}.margin-left-9,.margin-x-9{margin-left:9rem!important}.padding-0{padding:0!important}.padding-top-0,.padding-y-0{padding-top:0!important}.padding-right-0,.padding-x-0{padding-right:0!important}.padding-bottom-0,.padding-y-0{padding-bottom:0!important}.padding-left-0,.padding-x-0{padding-left:0!important}.padding-1{padding:.25rem!important}.padding-top-1,.padding-y-1{padding-top:.25rem!important}.padding-right-1,.padding-x-1{padding-right:.25rem!important}.padding-bottom-1,.padding-y-1{padding-bottom:.25rem!important}.padding-left-1,.padding-x-1{padding-left:.25rem!important}.padding-2{padding:.5rem!important}.padding-top-2,.padding-y-2{padding-top:.5rem!important}.padding-right-2,.padding-x-2{padding-right:.5rem!important}.padding-bottom-2,.padding-y-2{padding-bottom:.5rem!important}.padding-left-2,.padding-x-2{padding-left:.5rem!important}.padding-3{padding:1rem!important}.padding-top-3,.padding-y-3{padding-top:1rem!important}.padding-right-3,.padding-x-3{padding-right:1rem!important}.padding-bottom-3,.padding-y-3{padding-bottom:1rem!important}.padding-left-3,.padding-x-3{padding-left:1rem!important}.padding-4{padding:2rem!important}.padding-top-4,.padding-y-4{padding-top:2rem!important}.padding-right-4,.padding-x-4{padding-right:2rem!important}.padding-bottom-4,.padding-y-4{padding-bottom:2rem!important}.padding-left-4,.padding-x-4{padding-left:2rem!important}.padding-5{padding:4rem!important}.padding-top-5,.padding-y-5{padding-top:4rem!important}.padding-right-5,.padding-x-5{padding-right:4rem!important}.padding-bottom-5,.padding-y-5{padding-bottom:4rem!important}.padding-left-5,.padding-x-5{padding-left:4rem!important}.margin-n1{margin:-.25rem!important}.margin-top-n1,.margin-y-n1{margin-top:-.25rem!important}.margin-right-n1,.margin-x-n1{margin-right:-.25rem!important}.margin-bottom-n1,.margin-y-n1{margin-bottom:-.25rem!important}.margin-left-n1,.margin-x-n1{margin-left:-.25rem!important}.margin-n2{margin:-.5rem!important}.margin-top-n2,.margin-y-n2{margin-top:-.5rem!important}.margin-right-n2,.margin-x-n2{margin-right:-.5rem!important}.margin-bottom-n2,.margin-y-n2{margin-bottom:-.5rem!important}.margin-left-n2,.margin-x-n2{margin-left:-.5rem!important}.margin-n3{margin:-1rem!important}.margin-top-n3,.margin-y-n3{margin-top:-1rem!important}.margin-right-n3,.margin-x-n3{margin-right:-1rem!important}.margin-bottom-n3,.margin-y-n3{margin-bottom:-1rem!important}.margin-left-n3,.margin-x-n3{margin-left:-1rem!important}.margin-n4{margin:-2rem!important}.margin-top-n4,.margin-y-n4{margin-top:-2rem!important}.margin-right-n4,.margin-x-n4{margin-right:-2rem!important}.margin-bottom-n4,.margin-y-n4{margin-bottom:-2rem!important}.margin-left-n4,.margin-x-n4{margin-left:-2rem!important}.margin-n5{margin:-4rem!important}.margin-top-n5,.margin-y-n5{margin-top:-4rem!important}.margin-right-n5,.margin-x-n5{margin-right:-4rem!important}.margin-bottom-n5,.margin-y-n5{margin-bottom:-4rem!important}.margin-left-n5,.margin-x-n5{margin-left:-4rem!important}.margin-auto{margin:auto!important}.margin-top-auto,.margin-y-auto{margin-top:auto!important}.margin-right-auto,.margin-x-auto{margin-right:auto!important}.margin-bottom-auto,.margin-y-auto{margin-bottom:auto!important}.margin-left-auto,.margin-x-auto{margin-left:auto!important}@media (min-width:576px){.margin-sm-0{margin:0!important}.margin-top-sm-0,.margin-y-sm-0{margin-top:0!important}.margin-right-sm-0,.margin-x-sm-0{margin-right:0!important}.margin-bottom-sm-0,.margin-y-sm-0{margin-bottom:0!important}.margin-left-sm-0,.margin-x-sm-0{margin-left:0!important}.margin-sm-1{margin:.25rem!important}.margin-top-sm-1,.margin-y-sm-1{margin-top:.25rem!important}.margin-right-sm-1,.margin-x-sm-1{margin-right:.25rem!important}.margin-bottom-sm-1,.margin-y-sm-1{margin-bottom:.25rem!important}.margin-left-sm-1,.margin-x-sm-1{margin-left:.25rem!important}.margin-sm-2{margin:.5rem!important}.margin-top-sm-2,.margin-y-sm-2{margin-top:.5rem!important}.margin-right-sm-2,.margin-x-sm-2{margin-right:.5rem!important}.margin-bottom-sm-2,.margin-y-sm-2{margin-bottom:.5rem!important}.margin-left-sm-2,.margin-x-sm-2{margin-left:.5rem!important}.margin-sm-3{margin:1rem!important}.margin-top-sm-3,.margin-y-sm-3{margin-top:1rem!important}.margin-right-sm-3,.margin-x-sm-3{margin-right:1rem!important}.margin-bottom-sm-3,.margin-y-sm-3{margin-bottom:1rem!important}.margin-left-sm-3,.margin-x-sm-3{margin-left:1rem!important}.margin-sm-4{margin:2rem!important}.margin-top-sm-4,.margin-y-sm-4{margin-top:2rem!important}.margin-right-sm-4,.margin-x-sm-4{margin-right:2rem!important}.margin-bottom-sm-4,.margin-y-sm-4{margin-bottom:2rem!important}.margin-left-sm-4,.margin-x-sm-4{margin-left:2rem!important}.margin-sm-5{margin:4rem!important}.margin-top-sm-5,.margin-y-sm-5{margin-top:4rem!important}.margin-right-sm-5,.margin-x-sm-5{margin-right:4rem!important}.margin-bottom-sm-5,.margin-y-sm-5{margin-bottom:4rem!important}.margin-left-sm-5,.margin-x-sm-5{margin-left:4rem!important}.padding-sm-0{padding:0!important}.padding-top-sm-0,.padding-y-sm-0{padding-top:0!important}.padding-right-sm-0,.padding-x-sm-0{padding-right:0!important}.padding-bottom-sm-0,.padding-y-sm-0{padding-bottom:0!important}.padding-left-sm-0,.padding-x-sm-0{padding-left:0!important}.padding-sm-1{padding:.25rem!important}.padding-top-sm-1,.padding-y-sm-1{padding-top:.25rem!important}.padding-right-sm-1,.padding-x-sm-1{padding-right:.25rem!important}.padding-bottom-sm-1,.padding-y-sm-1{padding-bottom:.25rem!important}.padding-left-sm-1,.padding-x-sm-1{padding-left:.25rem!important}.padding-sm-2{padding:.5rem!important}.padding-top-sm-2,.padding-y-sm-2{padding-top:.5rem!important}.padding-right-sm-2,.padding-x-sm-2{padding-right:.5rem!important}.padding-bottom-sm-2,.padding-y-sm-2{padding-bottom:.5rem!important}.padding-left-sm-2,.padding-x-sm-2{padding-left:.5rem!important}.padding-sm-3{padding:1rem!important}.padding-top-sm-3,.padding-y-sm-3{padding-top:1rem!important}.padding-right-sm-3,.padding-x-sm-3{padding-right:1rem!important}.padding-bottom-sm-3,.padding-y-sm-3{padding-bottom:1rem!important}.padding-left-sm-3,.padding-x-sm-3{padding-left:1rem!important}.padding-sm-4{padding:2rem!important}.padding-top-sm-4,.padding-y-sm-4{padding-top:2rem!important}.padding-right-sm-4,.padding-x-sm-4{padding-right:2rem!important}.padding-bottom-sm-4,.padding-y-sm-4{padding-bottom:2rem!important}.padding-left-sm-4,.padding-x-sm-4{padding-left:2rem!important}.padding-sm-5{padding:4rem!important}.padding-top-sm-5,.padding-y-sm-5{padding-top:4rem!important}.padding-right-sm-5,.padding-x-sm-5{padding-right:4rem!important}.padding-bottom-sm-5,.padding-y-sm-5{padding-bottom:4rem!important}.padding-left-sm-5,.padding-x-sm-5{padding-left:4rem!important}.margin-sm-n1{margin:-.25rem!important}.margin-top-sm-n1,.margin-y-sm-n1{margin-top:-.25rem!important}.margin-right-sm-n1,.margin-x-sm-n1{margin-right:-.25rem!important}.margin-bottom-sm-n1,.margin-y-sm-n1{margin-bottom:-.25rem!important}.margin-left-sm-n1,.margin-x-sm-n1{margin-left:-.25rem!important}.margin-sm-n2{margin:-.5rem!important}.margin-top-sm-n2,.margin-y-sm-n2{margin-top:-.5rem!important}.margin-right-sm-n2,.margin-x-sm-n2{margin-right:-.5rem!important}.margin-bottom-sm-n2,.margin-y-sm-n2{margin-bottom:-.5rem!important}.margin-left-sm-n2,.margin-x-sm-n2{margin-left:-.5rem!important}.margin-sm-n3{margin:-1rem!important}.margin-top-sm-n3,.margin-y-sm-n3{margin-top:-1rem!important}.margin-right-sm-n3,.margin-x-sm-n3{margin-right:-1rem!important}.margin-bottom-sm-n3,.margin-y-sm-n3{margin-bottom:-1rem!important}.margin-left-sm-n3,.margin-x-sm-n3{margin-left:-1rem!important}.margin-sm-n4{margin:-2rem!important}.margin-top-sm-n4,.margin-y-sm-n4{margin-top:-2rem!important}.margin-right-sm-n4,.margin-x-sm-n4{margin-right:-2rem!important}.margin-bottom-sm-n4,.margin-y-sm-n4{margin-bottom:-2rem!important}.margin-left-sm-n4,.margin-x-sm-n4{margin-left:-2rem!important}.margin-sm-n5{margin:-4rem!important}.margin-top-sm-n5,.margin-y-sm-n5{margin-top:-4rem!important}.margin-right-sm-n5,.margin-x-sm-n5{margin-right:-4rem!important}.margin-bottom-sm-n5,.margin-y-sm-n5{margin-bottom:-4rem!important}.margin-left-sm-n5,.margin-x-sm-n5{margin-left:-4rem!important}.margin-sm-auto{margin:auto!important}.margin-top-sm-auto,.margin-y-sm-auto{margin-top:auto!important}.margin-right-sm-auto,.margin-x-sm-auto{margin-right:auto!important}.margin-bottom-sm-auto,.margin-y-sm-auto{margin-bottom:auto!important}.margin-left-sm-auto,.margin-x-sm-auto{margin-left:auto!important}}@media (min-width:768px){.margin-md-0{margin:0!important}.margin-top-md-0,.margin-y-md-0{margin-top:0!important}.margin-right-md-0,.margin-x-md-0{margin-right:0!important}.margin-bottom-md-0,.margin-y-md-0{margin-bottom:0!important}.margin-left-md-0,.margin-x-md-0{margin-left:0!important}.margin-md-1{margin:.25rem!important}.margin-top-md-1,.margin-y-md-1{margin-top:.25rem!important}.margin-right-md-1,.margin-x-md-1{margin-right:.25rem!important}.margin-bottom-md-1,.margin-y-md-1{margin-bottom:.25rem!important}.margin-left-md-1,.margin-x-md-1{margin-left:.25rem!important}.margin-md-2{margin:.5rem!important}.margin-top-md-2,.margin-y-md-2{margin-top:.5rem!important}.margin-right-md-2,.margin-x-md-2{margin-right:.5rem!important}.margin-bottom-md-2,.margin-y-md-2{margin-bottom:.5rem!important}.margin-left-md-2,.margin-x-md-2{margin-left:.5rem!important}.margin-md-3{margin:1rem!important}.margin-top-md-3,.margin-y-md-3{margin-top:1rem!important}.margin-right-md-3,.margin-x-md-3{margin-right:1rem!important}.margin-bottom-md-3,.margin-y-md-3{margin-bottom:1rem!important}.margin-left-md-3,.margin-x-md-3{margin-left:1rem!important}.margin-md-4{margin:2rem!important}.margin-top-md-4,.margin-y-md-4{margin-top:2rem!important}.margin-right-md-4,.margin-x-md-4{margin-right:2rem!important}.margin-bottom-md-4,.margin-y-md-4{margin-bottom:2rem!important}.margin-left-md-4,.margin-x-md-4{margin-left:2rem!important}.margin-md-5{margin:4rem!important}.margin-top-md-5,.margin-y-md-5{margin-top:4rem!important}.margin-right-md-5,.margin-x-md-5{margin-right:4rem!important}.margin-bottom-md-5,.margin-y-md-5{margin-bottom:4rem!important}.margin-left-md-5,.margin-x-md-5{margin-left:4rem!important}.padding-md-0{padding:0!important}.padding-top-md-0,.padding-y-md-0{padding-top:0!important}.padding-right-md-0,.padding-x-md-0{padding-right:0!important}.padding-bottom-md-0,.padding-y-md-0{padding-bottom:0!important}.padding-left-md-0,.padding-x-md-0{padding-left:0!important}.padding-md-1{padding:.25rem!important}.padding-top-md-1,.padding-y-md-1{padding-top:.25rem!important}.padding-right-md-1,.padding-x-md-1{padding-right:.25rem!important}.padding-bottom-md-1,.padding-y-md-1{padding-bottom:.25rem!important}.padding-left-md-1,.padding-x-md-1{padding-left:.25rem!important}.padding-md-2{padding:.5rem!important}.padding-top-md-2,.padding-y-md-2{padding-top:.5rem!important}.padding-right-md-2,.padding-x-md-2{padding-right:.5rem!important}.padding-bottom-md-2,.padding-y-md-2{padding-bottom:.5rem!important}.padding-left-md-2,.padding-x-md-2{padding-left:.5rem!important}.padding-md-3{padding:1rem!important}.padding-top-md-3,.padding-y-md-3{padding-top:1rem!important}.padding-right-md-3,.padding-x-md-3{padding-right:1rem!important}.padding-bottom-md-3,.padding-y-md-3{padding-bottom:1rem!important}.padding-left-md-3,.padding-x-md-3{padding-left:1rem!important}.padding-md-4{padding:2rem!important}.padding-top-md-4,.padding-y-md-4{padding-top:2rem!important}.padding-right-md-4,.padding-x-md-4{padding-right:2rem!important}.padding-bottom-md-4,.padding-y-md-4{padding-bottom:2rem!important}.padding-left-md-4,.padding-x-md-4{padding-left:2rem!important}.padding-md-5{padding:4rem!important}.padding-top-md-5,.padding-y-md-5{padding-top:4rem!important}.padding-right-md-5,.padding-x-md-5{padding-right:4rem!important}.padding-bottom-md-5,.padding-y-md-5{padding-bottom:4rem!important}.padding-left-md-5,.padding-x-md-5{padding-left:4rem!important}.margin-md-n1{margin:-.25rem!important}.margin-top-md-n1,.margin-y-md-n1{margin-top:-.25rem!important}.margin-right-md-n1,.margin-x-md-n1{margin-right:-.25rem!important}.margin-bottom-md-n1,.margin-y-md-n1{margin-bottom:-.25rem!important}.margin-left-md-n1,.margin-x-md-n1{margin-left:-.25rem!important}.margin-md-n2{margin:-.5rem!important}.margin-top-md-n2,.margin-y-md-n2{margin-top:-.5rem!important}.margin-right-md-n2,.margin-x-md-n2{margin-right:-.5rem!important}.margin-bottom-md-n2,.margin-y-md-n2{margin-bottom:-.5rem!important}.margin-left-md-n2,.margin-x-md-n2{margin-left:-.5rem!important}.margin-md-n3{margin:-1rem!important}.margin-top-md-n3,.margin-y-md-n3{margin-top:-1rem!important}.margin-right-md-n3,.margin-x-md-n3{margin-right:-1rem!important}.margin-bottom-md-n3,.margin-y-md-n3{margin-bottom:-1rem!important}.margin-left-md-n3,.margin-x-md-n3{margin-left:-1rem!important}.margin-md-n4{margin:-2rem!important}.margin-top-md-n4,.margin-y-md-n4{margin-top:-2rem!important}.margin-right-md-n4,.margin-x-md-n4{margin-right:-2rem!important}.margin-bottom-md-n4,.margin-y-md-n4{margin-bottom:-2rem!important}.margin-left-md-n4,.margin-x-md-n4{margin-left:-2rem!important}.margin-md-n5{margin:-4rem!important}.margin-top-md-n5,.margin-y-md-n5{margin-top:-4rem!important}.margin-right-md-n5,.margin-x-md-n5{margin-right:-4rem!important}.margin-bottom-md-n5,.margin-y-md-n5{margin-bottom:-4rem!important}.margin-left-md-n5,.margin-x-md-n5{margin-left:-4rem!important}.margin-md-auto{margin:auto!important}.margin-top-md-auto,.margin-y-md-auto{margin-top:auto!important}.margin-right-md-auto,.margin-x-md-auto{margin-right:auto!important}.margin-bottom-md-auto,.margin-y-md-auto{margin-bottom:auto!important}.margin-left-md-auto,.margin-x-md-auto{margin-left:auto!important}}@media (min-width:992px){.margin-lg-0{margin:0!important}.margin-top-lg-0,.margin-y-lg-0{margin-top:0!important}.margin-right-lg-0,.margin-x-lg-0{margin-right:0!important}.margin-bottom-lg-0,.margin-y-lg-0{margin-bottom:0!important}.margin-left-lg-0,.margin-x-lg-0{margin-left:0!important}.margin-lg-1{margin:.25rem!important}.margin-top-lg-1,.margin-y-lg-1{margin-top:.25rem!important}.margin-right-lg-1,.margin-x-lg-1{margin-right:.25rem!important}.margin-bottom-lg-1,.margin-y-lg-1{margin-bottom:.25rem!important}.margin-left-lg-1,.margin-x-lg-1{margin-left:.25rem!important}.margin-lg-2{margin:.5rem!important}.margin-top-lg-2,.margin-y-lg-2{margin-top:.5rem!important}.margin-right-lg-2,.margin-x-lg-2{margin-right:.5rem!important}.margin-bottom-lg-2,.margin-y-lg-2{margin-bottom:.5rem!important}.margin-left-lg-2,.margin-x-lg-2{margin-left:.5rem!important}.margin-lg-3{margin:1rem!important}.margin-top-lg-3,.margin-y-lg-3{margin-top:1rem!important}.margin-right-lg-3,.margin-x-lg-3{margin-right:1rem!important}.margin-bottom-lg-3,.margin-y-lg-3{margin-bottom:1rem!important}.margin-left-lg-3,.margin-x-lg-3{margin-left:1rem!important}.margin-lg-4{margin:2rem!important}.margin-top-lg-4,.margin-y-lg-4{margin-top:2rem!important}.margin-right-lg-4,.margin-x-lg-4{margin-right:2rem!important}.margin-bottom-lg-4,.margin-y-lg-4{margin-bottom:2rem!important}.margin-left-lg-4,.margin-x-lg-4{margin-left:2rem!important}.margin-lg-5{margin:4rem!important}.margin-top-lg-5,.margin-y-lg-5{margin-top:4rem!important}.margin-right-lg-5,.margin-x-lg-5{margin-right:4rem!important}.margin-bottom-lg-5,.margin-y-lg-5{margin-bottom:4rem!important}.margin-left-lg-5,.margin-x-lg-5{margin-left:4rem!important}.padding-lg-0{padding:0!important}.padding-top-lg-0,.padding-y-lg-0{padding-top:0!important}.padding-right-lg-0,.padding-x-lg-0{padding-right:0!important}.padding-bottom-lg-0,.padding-y-lg-0{padding-bottom:0!important}.padding-left-lg-0,.padding-x-lg-0{padding-left:0!important}.padding-lg-1{padding:.25rem!important}.padding-top-lg-1,.padding-y-lg-1{padding-top:.25rem!important}.padding-right-lg-1,.padding-x-lg-1{padding-right:.25rem!important}.padding-bottom-lg-1,.padding-y-lg-1{padding-bottom:.25rem!important}.padding-left-lg-1,.padding-x-lg-1{padding-left:.25rem!important}.padding-lg-2{padding:.5rem!important}.padding-top-lg-2,.padding-y-lg-2{padding-top:.5rem!important}.padding-right-lg-2,.padding-x-lg-2{padding-right:.5rem!important}.padding-bottom-lg-2,.padding-y-lg-2{padding-bottom:.5rem!important}.padding-left-lg-2,.padding-x-lg-2{padding-left:.5rem!important}.padding-lg-3{padding:1rem!important}.padding-top-lg-3,.padding-y-lg-3{padding-top:1rem!important}.padding-right-lg-3,.padding-x-lg-3{padding-right:1rem!important}.padding-bottom-lg-3,.padding-y-lg-3{padding-bottom:1rem!important}.padding-left-lg-3,.padding-x-lg-3{padding-left:1rem!important}.padding-lg-4{padding:2rem!important}.padding-top-lg-4,.padding-y-lg-4{padding-top:2rem!important}.padding-right-lg-4,.padding-x-lg-4{padding-right:2rem!important}.padding-bottom-lg-4,.padding-y-lg-4{padding-bottom:2rem!important}.padding-left-lg-4,.padding-x-lg-4{padding-left:2rem!important}.padding-lg-5{padding:4rem!important}.padding-top-lg-5,.padding-y-lg-5{padding-top:4rem!important}.padding-right-lg-5,.padding-x-lg-5{padding-right:4rem!important}.padding-bottom-lg-5,.padding-y-lg-5{padding-bottom:4rem!important}.padding-left-lg-5,.padding-x-lg-5{padding-left:4rem!important}.margin-lg-n1{margin:-.25rem!important}.margin-top-lg-n1,.margin-y-lg-n1{margin-top:-.25rem!important}.margin-right-lg-n1,.margin-x-lg-n1{margin-right:-.25rem!important}.margin-bottom-lg-n1,.margin-y-lg-n1{margin-bottom:-.25rem!important}.margin-left-lg-n1,.margin-x-lg-n1{margin-left:-.25rem!important}.margin-lg-n2{margin:-.5rem!important}.margin-top-lg-n2,.margin-y-lg-n2{margin-top:-.5rem!important}.margin-right-lg-n2,.margin-x-lg-n2{margin-right:-.5rem!important}.margin-bottom-lg-n2,.margin-y-lg-n2{margin-bottom:-.5rem!important}.margin-left-lg-n2,.margin-x-lg-n2{margin-left:-.5rem!important}.margin-lg-n3{margin:-1rem!important}.margin-top-lg-n3,.margin-y-lg-n3{margin-top:-1rem!important}.margin-right-lg-n3,.margin-x-lg-n3{margin-right:-1rem!important}.margin-bottom-lg-n3,.margin-y-lg-n3{margin-bottom:-1rem!important}.margin-left-lg-n3,.margin-x-lg-n3{margin-left:-1rem!important}.margin-lg-n4{margin:-2rem!important}.margin-top-lg-n4,.margin-y-lg-n4{margin-top:-2rem!important}.margin-right-lg-n4,.margin-x-lg-n4{margin-right:-2rem!important}.margin-bottom-lg-n4,.margin-y-lg-n4{margin-bottom:-2rem!important}.margin-left-lg-n4,.margin-x-lg-n4{margin-left:-2rem!important}.margin-lg-n5{margin:-4rem!important}.margin-top-lg-n5,.margin-y-lg-n5{margin-top:-4rem!important}.margin-right-lg-n5,.margin-x-lg-n5{margin-right:-4rem!important}.margin-bottom-lg-n5,.margin-y-lg-n5{margin-bottom:-4rem!important}.margin-left-lg-n5,.margin-x-lg-n5{margin-left:-4rem!important}.margin-lg-auto{margin:auto!important}.margin-top-lg-auto,.margin-y-lg-auto{margin-top:auto!important}.margin-right-lg-auto,.margin-x-lg-auto{margin-right:auto!important}.margin-bottom-lg-auto,.margin-y-lg-auto{margin-bottom:auto!important}.margin-left-lg-auto,.margin-x-lg-auto{margin-left:auto!important}}@media (min-width:1200px){.margin-xl-0{margin:0!important}.margin-top-xl-0,.margin-y-xl-0{margin-top:0!important}.margin-right-xl-0,.margin-x-xl-0{margin-right:0!important}.margin-bottom-xl-0,.margin-y-xl-0{margin-bottom:0!important}.margin-left-xl-0,.margin-x-xl-0{margin-left:0!important}.margin-xl-1{margin:.25rem!important}.margin-top-xl-1,.margin-y-xl-1{margin-top:.25rem!important}.margin-right-xl-1,.margin-x-xl-1{margin-right:.25rem!important}.margin-bottom-xl-1,.margin-y-xl-1{margin-bottom:.25rem!important}.margin-left-xl-1,.margin-x-xl-1{margin-left:.25rem!important}.margin-xl-2{margin:.5rem!important}.margin-top-xl-2,.margin-y-xl-2{margin-top:.5rem!important}.margin-right-xl-2,.margin-x-xl-2{margin-right:.5rem!important}.margin-bottom-xl-2,.margin-y-xl-2{margin-bottom:.5rem!important}.margin-left-xl-2,.margin-x-xl-2{margin-left:.5rem!important}.margin-xl-3{margin:1rem!important}.margin-top-xl-3,.margin-y-xl-3{margin-top:1rem!important}.margin-right-xl-3,.margin-x-xl-3{margin-right:1rem!important}.margin-bottom-xl-3,.margin-y-xl-3{margin-bottom:1rem!important}.margin-left-xl-3,.margin-x-xl-3{margin-left:1rem!important}.margin-xl-4{margin:2rem!important}.margin-top-xl-4,.margin-y-xl-4{margin-top:2rem!important}.margin-right-xl-4,.margin-x-xl-4{margin-right:2rem!important}.margin-bottom-xl-4,.margin-y-xl-4{margin-bottom:2rem!important}.margin-left-xl-4,.margin-x-xl-4{margin-left:2rem!important}.margin-xl-5{margin:4rem!important}.margin-top-xl-5,.margin-y-xl-5{margin-top:4rem!important}.margin-right-xl-5,.margin-x-xl-5{margin-right:4rem!important}.margin-bottom-xl-5,.margin-y-xl-5{margin-bottom:4rem!important}.margin-left-xl-5,.margin-x-xl-5{margin-left:4rem!important}.padding-xl-0{padding:0!important}.padding-top-xl-0,.padding-y-xl-0{padding-top:0!important}.padding-right-xl-0,.padding-x-xl-0{padding-right:0!important}.padding-bottom-xl-0,.padding-y-xl-0{padding-bottom:0!important}.padding-left-xl-0,.padding-x-xl-0{padding-left:0!important}.padding-xl-1{padding:.25rem!important}.padding-top-xl-1,.padding-y-xl-1{padding-top:.25rem!important}.padding-right-xl-1,.padding-x-xl-1{padding-right:.25rem!important}.padding-bottom-xl-1,.padding-y-xl-1{padding-bottom:.25rem!important}.padding-left-xl-1,.padding-x-xl-1{padding-left:.25rem!important}.padding-xl-2{padding:.5rem!important}.padding-top-xl-2,.padding-y-xl-2{padding-top:.5rem!important}.padding-right-xl-2,.padding-x-xl-2{padding-right:.5rem!important}.padding-bottom-xl-2,.padding-y-xl-2{padding-bottom:.5rem!important}.padding-left-xl-2,.padding-x-xl-2{padding-left:.5rem!important}.padding-xl-3{padding:1rem!important}.padding-top-xl-3,.padding-y-xl-3{padding-top:1rem!important}.padding-right-xl-3,.padding-x-xl-3{padding-right:1rem!important}.padding-bottom-xl-3,.padding-y-xl-3{padding-bottom:1rem!important}.padding-left-xl-3,.padding-x-xl-3{padding-left:1rem!important}.padding-xl-4{padding:2rem!important}.padding-top-xl-4,.padding-y-xl-4{padding-top:2rem!important}.padding-right-xl-4,.padding-x-xl-4{padding-right:2rem!important}.padding-bottom-xl-4,.padding-y-xl-4{padding-bottom:2rem!important}.padding-left-xl-4,.padding-x-xl-4{padding-left:2rem!important}.padding-xl-5{padding:4rem!important}.padding-top-xl-5,.padding-y-xl-5{padding-top:4rem!important}.padding-right-xl-5,.padding-x-xl-5{padding-right:4rem!important}.padding-bottom-xl-5,.padding-y-xl-5{padding-bottom:4rem!important}.padding-left-xl-5,.padding-x-xl-5{padding-left:4rem!important}.margin-xl-n1{margin:-.25rem!important}.margin-top-xl-n1,.margin-y-xl-n1{margin-top:-.25rem!important}.margin-right-xl-n1,.margin-x-xl-n1{margin-right:-.25rem!important}.margin-bottom-xl-n1,.margin-y-xl-n1{margin-bottom:-.25rem!important}.margin-left-xl-n1,.margin-x-xl-n1{margin-left:-.25rem!important}.margin-xl-n2{margin:-.5rem!important}.margin-top-xl-n2,.margin-y-xl-n2{margin-top:-.5rem!important}.margin-right-xl-n2,.margin-x-xl-n2{margin-right:-.5rem!important}.margin-bottom-xl-n2,.margin-y-xl-n2{margin-bottom:-.5rem!important}.margin-left-xl-n2,.margin-x-xl-n2{margin-left:-.5rem!important}.margin-xl-n3{margin:-1rem!important}.margin-top-xl-n3,.margin-y-xl-n3{margin-top:-1rem!important}.margin-right-xl-n3,.margin-x-xl-n3{margin-right:-1rem!important}.margin-bottom-xl-n3,.margin-y-xl-n3{margin-bottom:-1rem!important}.margin-left-xl-n3,.margin-x-xl-n3{margin-left:-1rem!important}.margin-xl-n4{margin:-2rem!important}.margin-top-xl-n4,.margin-y-xl-n4{margin-top:-2rem!important}.margin-right-xl-n4,.margin-x-xl-n4{margin-right:-2rem!important}.margin-bottom-xl-n4,.margin-y-xl-n4{margin-bottom:-2rem!important}.margin-left-xl-n4,.margin-x-xl-n4{margin-left:-2rem!important}.margin-xl-n5{margin:-4rem!important}.margin-top-xl-n5,.margin-y-xl-n5{margin-top:-4rem!important}.margin-right-xl-n5,.margin-x-xl-n5{margin-right:-4rem!important}.margin-bottom-xl-n5,.margin-y-xl-n5{margin-bottom:-4rem!important}.margin-left-xl-n5,.margin-x-xl-n5{margin-left:-4rem!important}.margin-xl-auto{margin:auto!important}.margin-top-xl-auto,.margin-y-xl-auto{margin-top:auto!important}.margin-right-xl-auto,.margin-x-xl-auto{margin-right:auto!important}.margin-bottom-xl-auto,.margin-y-xl-auto{margin-bottom:auto!important}.margin-left-xl-auto,.margin-x-xl-auto{margin-left:auto!important}}.h1{font-size:2em}.h2{font-size:1.5em}.h3{font-size:1.17em}.h4{font-size:1em}.h5{font-size:.83em}.h6{font-size:.67em}.cursor-alias{cursor:alias}.cursor-all-scroll{cursor:all-scroll}.cursor-auto{cursor:auto}.cursor-cell{cursor:cell}.cursor-context-menu{cursor:context-menu}.cursor-col-resize{cursor:col-resize}.cursor-copy{cursor:copy}.cursor-crosshair{cursor:crosshair}.cursor-default{cursor:default}.cursor-e-resize{cursor:e-resize}.cursor-ew-resize{cursor:ew-resize}.cursor-grab{cursor:-webkit-grab;cursor:grab}.cursor-grabbing{cursor:-webkit-grabbing;cursor:grabbing}.cursor-help{cursor:help}.cursor-move{cursor:move}.cursor-n-resize{cursor:n-resize}.cursor-ne-resize{cursor:ne-resize}.cursor-nesw-resize{cursor:nesw-resize}.cursor-ns-resize{cursor:ns-resize}.cursor-nw-resize{cursor:nw-resize}.cursor-nwse-resize{cursor:nwse-resize}.cursor-no-drop{cursor:no-drop}.cursor-none{cursor:none}.cursor-not-allowed{cursor:not-allowed}.cursor-pointer{cursor:pointer}.cursor-progress{cursor:progress}.cursor-row-resize{cursor:row-resize}.cursor-s-resize{cursor:s-resize}.cursor-se-resize{cursor:se-resize}.cursor-sw-resize{cursor:sw-resize}.cursor-text{cursor:text}.cursor-w-resize{cursor:w-resize}.cursor-wait{cursor:wait}.cursor-zoom-in{cursor:zoom-in}.cursor-zoom-out{cursor:zoom-out}.mat-tooltip{font-size:15px!important}body,html{height:100%}body{font-family:opens sans regular,sans-serif;margin:0;padding:0}iframe{border:none}.mat-badge-content{font-family:Roboto,Helvetica Neue,sans-serif;font-size:12px;font-weight:600}.mat-badge-small .mat-badge-content{font-size:9px}.mat-badge-large .mat-badge-content{font-size:24px}.mat-h1,.mat-headline,.mat-typography h1{font:400 24px/32px Roboto,Helvetica Neue,sans-serif;letter-spacing:normal;margin:0 0 16px}.mat-h2,.mat-title,.mat-typography h2{font:500 20px/32px Roboto,Helvetica Neue,sans-serif;letter-spacing:normal;margin:0 0 16px}.mat-h3,.mat-subheading-2,.mat-typography h3{font:400 16px/28px Roboto,Helvetica Neue,sans-serif;letter-spacing:normal;margin:0 0 16px}.mat-h4,.mat-subheading-1,.mat-typography h4{font:400 15px/24px Roboto,Helvetica Neue,sans-serif;letter-spacing:normal;margin:0 0 16px}.mat-h5,.mat-typography h5{font:400 11.62px/20px Roboto,Helvetica Neue,sans-serif;margin:0 0 12px}.mat-h6,.mat-typography h6{font:400 9.38px/20px Roboto,Helvetica Neue,sans-serif;margin:0 0 12px}.mat-body-2,.mat-body-strong{font:500 14px/24px Roboto,Helvetica Neue,sans-serif;letter-spacing:normal}.mat-body,.mat-body-1,.mat-typography{font:400 14px/20px Roboto,Helvetica Neue,sans-serif;letter-spacing:normal}.mat-body-1 p,.mat-body p,.mat-typography p{margin:0 0 12px}.mat-caption,.mat-small{font:400 12px/20px Roboto,Helvetica Neue,sans-serif;letter-spacing:normal}.mat-display-4,.mat-typography .mat-display-4{font:300 112px/112px Roboto,Helvetica Neue,sans-serif;letter-spacing:-.05em;margin:0 0 56px}.mat-display-3,.mat-typography .mat-display-3{font:400 56px/56px Roboto,Helvetica Neue,sans-serif;letter-spacing:-.02em;margin:0 0 64px}.mat-display-2,.mat-typography .mat-display-2{font:400 45px/48px Roboto,Helvetica Neue,sans-serif;letter-spacing:-.005em;margin:0 0 64px}.mat-display-1,.mat-typography .mat-display-1{font:400 34px/40px Roboto,Helvetica Neue,sans-serif;letter-spacing:normal;margin:0 0 64px}.mat-bottom-sheet-container{font:400 14px/20px Roboto,Helvetica Neue,sans-serif;letter-spacing:normal}.mat-button,.mat-fab,.mat-flat-button,.mat-icon-button,.mat-mini-fab,.mat-raised-button,.mat-stroked-button{font-family:Roboto,Helvetica Neue,sans-serif;font-size:14px;font-weight:500}.mat-button-toggle,.mat-card{font-family:Roboto,Helvetica Neue,sans-serif}.mat-card-title{font-size:24px;font-weight:500}.mat-card-header .mat-card-title{font-size:20px}.mat-card-content,.mat-card-subtitle{font-size:14px}.mat-checkbox{font-family:Roboto,Helvetica Neue,sans-serif}.mat-checkbox-layout .mat-checkbox-label{line-height:24px}.mat-chip{font-size:14px;font-weight:500}.mat-chip .mat-chip-remove.mat-icon,.mat-chip .mat-chip-trailing-icon.mat-icon{font-size:18px}.mat-table{font-family:Roboto,Helvetica Neue,sans-serif}.mat-header-cell{font-size:12px;font-weight:500}.mat-cell,.mat-footer-cell{font-size:14px}.mat-calendar{font-family:Roboto,Helvetica Neue,sans-serif}.mat-calendar-body{font-size:13px}.mat-calendar-body-label,.mat-calendar-period-button{font-size:14px;font-weight:500}.mat-calendar-table-header th{font-size:11px;font-weight:400}.mat-dialog-title{font:500 20px/32px Roboto,Helvetica Neue,sans-serif;letter-spacing:normal}.mat-expansion-panel-header{font-family:Roboto,Helvetica Neue,sans-serif;font-size:15px;font-weight:400}.mat-expansion-panel-content{font:400 14px/20px Roboto,Helvetica Neue,sans-serif;letter-spacing:normal}.mat-form-field{font-family:Roboto,Helvetica Neue,sans-serif;font-size:inherit;font-weight:400;letter-spacing:normal;line-height:1.125}.mat-form-field-wrapper{padding-bottom:1.34375em}.mat-form-field-prefix .mat-icon,.mat-form-field-suffix .mat-icon{font-size:150%;line-height:1.125}.mat-form-field-prefix .mat-icon-button,.mat-form-field-suffix .mat-icon-button{height:1.5em;width:1.5em}.mat-form-field-prefix .mat-icon-button .mat-icon,.mat-form-field-suffix .mat-icon-button .mat-icon{height:1.125em;line-height:1.125}.mat-form-field-infix{border-top:.84375em solid transparent;padding:.5em 0}.mat-form-field-can-float.mat-form-field-should-float .mat-form-field-label,.mat-form-field-can-float .mat-input-server:focus+.mat-form-field-label-wrapper .mat-form-field-label{transform:translateY(-1.34375em) scale(.75);width:133.3333333333%}.mat-form-field-can-float .mat-input-server[label]:not(:label-shown)+.mat-form-field-label-wrapper .mat-form-field-label{transform:translateY(-1.34374em) scale(.75);width:133.3333433333%}.mat-form-field-label-wrapper{padding-top:.84375em;top:-.84375em}.mat-form-field-label{top:1.34375em}.mat-form-field-underline{bottom:1.34375em}.mat-form-field-subscript-wrapper{font-size:75%;margin-top:.6666666667em;top:calc(100% - 1.79167em)}.mat-form-field-appearance-legacy .mat-form-field-wrapper{padding-bottom:1.25em}.mat-form-field-appearance-legacy .mat-form-field-infix{padding:.4375em 0}.mat-form-field-appearance-legacy.mat-form-field-can-float.mat-form-field-should-float .mat-form-field-label,.mat-form-field-appearance-legacy.mat-form-field-can-float .mat-input-server:focus+.mat-form-field-label-wrapper .mat-form-field-label{-ms-transform:translateY(-1.28125em) scale(.75);transform:translateY(-1.28125em) scale(.75) perspective(100px) translateZ(.001px);width:133.3333333333%}.mat-form-field-appearance-legacy.mat-form-field-can-float .mat-form-field-autofill-control:-webkit-autofill+.mat-form-field-label-wrapper .mat-form-field-label{-ms-transform:translateY(-1.28124em) scale(.75);transform:translateY(-1.28125em) scale(.75) perspective(100px) translateZ(.00101px);width:133.3333433333%}.mat-form-field-appearance-legacy.mat-form-field-can-float .mat-input-server[label]:not(:label-shown)+.mat-form-field-label-wrapper .mat-form-field-label{-ms-transform:translateY(-1.28123em) scale(.75);transform:translateY(-1.28125em) scale(.75) perspective(100px) translateZ(.00102px);width:133.3333533333%}.mat-form-field-appearance-legacy .mat-form-field-label{top:1.28125em}.mat-form-field-appearance-legacy .mat-form-field-underline{bottom:1.25em}.mat-form-field-appearance-legacy .mat-form-field-subscript-wrapper{margin-top:.5416666667em;top:calc(100% - 1.66667em)}@media print{.mat-form-field-appearance-legacy.mat-form-field-can-float.mat-form-field-should-float .mat-form-field-label,.mat-form-field-appearance-legacy.mat-form-field-can-float .mat-input-server:focus+.mat-form-field-label-wrapper .mat-form-field-label{transform:translateY(-1.28122em) scale(.75)}.mat-form-field-appearance-legacy.mat-form-field-can-float .mat-form-field-autofill-control:-webkit-autofill+.mat-form-field-label-wrapper .mat-form-field-label{transform:translateY(-1.28121em) scale(.75)}.mat-form-field-appearance-legacy.mat-form-field-can-float .mat-input-server[label]:not(:label-shown)+.mat-form-field-label-wrapper .mat-form-field-label{transform:translateY(-1.2812em) scale(.75)}}.mat-form-field-appearance-fill .mat-form-field-infix{padding:.25em 0 .75em}.mat-form-field-appearance-fill .mat-form-field-label{margin-top:-.5em;top:1.09375em}.mat-form-field-appearance-fill.mat-form-field-can-float.mat-form-field-should-float .mat-form-field-label,.mat-form-field-appearance-fill.mat-form-field-can-float .mat-input-server:focus+.mat-form-field-label-wrapper .mat-form-field-label{transform:translateY(-.59375em) scale(.75);width:133.3333333333%}.mat-form-field-appearance-fill.mat-form-field-can-float .mat-input-server[label]:not(:label-shown)+.mat-form-field-label-wrapper .mat-form-field-label{transform:translateY(-.59374em) scale(.75);width:133.3333433333%}.mat-form-field-appearance-outline .mat-form-field-infix{padding:1em 0}.mat-form-field-appearance-outline .mat-form-field-label{margin-top:-.25em;top:1.84375em}.mat-form-field-appearance-outline.mat-form-field-can-float.mat-form-field-should-float .mat-form-field-label,.mat-form-field-appearance-outline.mat-form-field-can-float .mat-input-server:focus+.mat-form-field-label-wrapper .mat-form-field-label{transform:translateY(-1.59375em) scale(.75);width:133.3333333333%}.mat-form-field-appearance-outline.mat-form-field-can-float .mat-input-server[label]:not(:label-shown)+.mat-form-field-label-wrapper .mat-form-field-label{transform:translateY(-1.59374em) scale(.75);width:133.3333433333%}.mat-grid-tile-footer,.mat-grid-tile-header{font-size:14px}.mat-grid-tile-footer .mat-line,.mat-grid-tile-header .mat-line{box-sizing:border-box;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mat-grid-tile-footer .mat-line:nth-child(n+2),.mat-grid-tile-header .mat-line:nth-child(n+2){font-size:12px}input.mat-input-element{margin-top:-.0625em}.mat-menu-item{font-family:Roboto,Helvetica Neue,sans-serif;font-size:14px;font-weight:400}.mat-paginator,.mat-paginator-page-size .mat-select-trigger{font-family:Roboto,Helvetica Neue,sans-serif;font-size:12px}.mat-radio-button,.mat-select{font-family:Roboto,Helvetica Neue,sans-serif}.mat-select-trigger{height:1.125em}.mat-slide-toggle-content,.mat-slider-thumb-label-text{font-family:Roboto,Helvetica Neue,sans-serif}.mat-slider-thumb-label-text{font-size:12px;font-weight:500}.mat-stepper-horizontal,.mat-stepper-vertical{font-family:Roboto,Helvetica Neue,sans-serif}.mat-step-label{font-size:14px;font-weight:400}.mat-step-sub-label-error{font-weight:400}.mat-step-label-error{font-size:14px}.mat-step-label-selected{font-size:14px;font-weight:500}.mat-tab-group,.mat-tab-label,.mat-tab-link{font-family:Roboto,Helvetica Neue,sans-serif}.mat-tab-label,.mat-tab-link{font-size:14px;font-weight:500}.mat-toolbar,.mat-toolbar h1,.mat-toolbar h2,.mat-toolbar h3,.mat-toolbar h4,.mat-toolbar h5,.mat-toolbar h6{font:500 20px/32px Roboto,Helvetica Neue,sans-serif;letter-spacing:normal;margin:0}.mat-tooltip{font-family:Roboto,Helvetica Neue,sans-serif;font-size:10px;padding-bottom:6px;padding-top:6px}.mat-tooltip-handset{font-size:14px;padding-bottom:8px;padding-top:8px}.mat-list-item,.mat-list-option{font-family:Roboto,Helvetica Neue,sans-serif}.mat-list-base .mat-list-item{font-size:16px}.mat-list-base .mat-list-item .mat-line{box-sizing:border-box;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mat-list-base .mat-list-item .mat-line:nth-child(n+2){font-size:14px}.mat-list-base .mat-list-option{font-size:16px}.mat-list-base .mat-list-option .mat-line{box-sizing:border-box;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mat-list-base .mat-list-option .mat-line:nth-child(n+2){font-size:14px}.mat-list-base .mat-subheader{font-family:Roboto,Helvetica Neue,sans-serif;font-size:14px;font-weight:500}.mat-list-base[dense] .mat-list-item{font-size:12px}.mat-list-base[dense] .mat-list-item .mat-line{box-sizing:border-box;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mat-list-base[dense] .mat-list-item .mat-line:nth-child(n+2),.mat-list-base[dense] .mat-list-option{font-size:12px}.mat-list-base[dense] .mat-list-option .mat-line{box-sizing:border-box;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mat-list-base[dense] .mat-list-option .mat-line:nth-child(n+2){font-size:12px}.mat-list-base[dense] .mat-subheader{font-family:Roboto,Helvetica Neue,sans-serif;font-size:12px;font-weight:500}.mat-option{font-family:Roboto,Helvetica Neue,sans-serif;font-size:16px}.mat-optgroup-label{font:500 14px/24px Roboto,Helvetica Neue,sans-serif;letter-spacing:normal}.mat-simple-snackbar{font-family:Roboto,Helvetica Neue,sans-serif;font-size:14px}.mat-simple-snackbar-action{font-family:inherit;font-size:inherit;font-weight:500;line-height:1}.mat-tree{font-family:Roboto,Helvetica Neue,sans-serif}.mat-nested-tree-node,.mat-tree-node{font-size:14px;font-weight:400}.mat-ripple{overflow:hidden;position:relative}.mat-ripple:not(:empty){transform:translateZ(0)}.mat-ripple.mat-ripple-unbounded{overflow:visible}.mat-ripple-element{border-radius:50%;pointer-events:none;position:absolute;transform:scale(0);transition:opacity,transform 0ms cubic-bezier(0,0,.2,1)}.cdk-high-contrast-active .mat-ripple-element{display:none}.cdk-visually-hidden{-moz-appearance:none;-webkit-appearance:none;border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;outline:0;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.cdk-global-overlay-wrapper,.cdk-overlay-container{height:100%;left:0;pointer-events:none;top:0;width:100%}.cdk-overlay-container{position:fixed;z-index:1000}.cdk-overlay-container:empty{display:none}.cdk-global-overlay-wrapper,.cdk-overlay-pane{display:flex;position:absolute;z-index:1000}.cdk-overlay-pane{box-sizing:border-box;max-height:100%;max-width:100%;pointer-events:auto}.cdk-overlay-backdrop{-webkit-tap-highlight-color:transparent;bottom:0;left:0;opacity:0;pointer-events:auto;position:absolute;right:0;top:0;transition:opacity .4s cubic-bezier(.25,.8,.25,1);z-index:1000}.cdk-overlay-backdrop.cdk-overlay-backdrop-showing{opacity:1}.cdk-high-contrast-active .cdk-overlay-backdrop.cdk-overlay-backdrop-showing{opacity:.6}.cdk-overlay-dark-backdrop{background:rgba(0,0,0,.32)}.cdk-overlay-transparent-backdrop,.cdk-overlay-transparent-backdrop.cdk-overlay-backdrop-showing{opacity:0}.cdk-overlay-connected-position-bounding-box{display:flex;flex-direction:column;min-height:1px;min-width:1px;position:absolute;z-index:1000}.cdk-global-scrollblock{overflow-y:scroll;position:fixed;width:100%}@-webkit-keyframes cdk-text-field-autofill-start{\n  /*!*/}@keyframes cdk-text-field-autofill-start{\n  /*!*/}@-webkit-keyframes cdk-text-field-autofill-end{\n  /*!*/}@keyframes cdk-text-field-autofill-end{\n  /*!*/}.cdk-text-field-autofill-monitored:-webkit-autofill{-webkit-animation:cdk-text-field-autofill-start 0s 1ms;animation:cdk-text-field-autofill-start 0s 1ms}.cdk-text-field-autofill-monitored:not(:-webkit-autofill){-webkit-animation:cdk-text-field-autofill-end 0s 1ms;animation:cdk-text-field-autofill-end 0s 1ms}textarea.cdk-textarea-autosize{resize:none}textarea.cdk-textarea-autosize-measuring{box-sizing:content-box!important;height:auto!important;overflow:hidden!important;padding:2px 0!important}textarea.cdk-textarea-autosize-measuring-firefox{box-sizing:content-box!important;height:0!important;padding:2px 0!important}.mat-focus-indicator,.mat-mdc-focus-indicator{position:relative}.header,.title{font-family:Encode Sans Condensed,sans-serif;font-weight:900}.paragraph-title,.tagline{font-family:Open Sans,sans-serif;font-weight:400}.paragraph-title-bold .tagLine-bold{font-family:Open Sans,sans-serif;font-weight:700}.plain-text,.remarks{font-family:Open Sans,sans-serif;font-weight:300}.plain-text-bold{font-family:Open Sans,sans-serif;font-weight:700}.flex-column{flex-direction:column}.flex-column,.flex-row{box-sizing:border-box;display:flex}.flex-row{flex-direction:row}.flex-row-center{align-items:center;justify-content:center}.mat-button-large{font-size:18px;font-weight:700;line-height:48px;padding:0 24px!important}.mat-round{border-radius:.5em}:root{--background:#050505;--cyan-accent:rgba(132,255,255,0.75);--green-accent:#00e676;--initial-accent:#9cd8d7;--initial-dark-background:#222;--initial-dark-text:hsla(0,0%,100%,0.87);--initial-light-background:#f2f2f2;--initial-light-background:#fff;--initial-light-text:rgba(0,0,0,0.87);--initial-primary:#4a918e;--initial-warn:#ef4351;--orange-accent:#ff9800;--pink-accent:#e91e63;--purple-accent:#9c27b0;--success:#00e676;--yellow-accent:#fdd835}body{background-color:var(--initial-dark-background)}::ng-deep .mat-tooltip{font-size:16px!important}:host .valid-control{color:var(--green-accent)}:host .invalid-control{color:var(--theme-warn-500)}:host .actions .item:not(:last-child){margin-right:0}:host .project-thumbnail img{height:50px;width:auto}:host .active{background-color:var(--theme-accent-400)}:host .active,:host .inactive{transition:background-color 1s linear}:host .inactive{background-color:rgba(242,245,169,0)}:host .expansion-panel{margin-bottom:10px;width:100%}:host .expansion-container{max-height:300px;overflow-y:auto}:host .divider-fill-vert{background-color:var(--theme-accent-500);bottom:10%;min-height:100%;min-width:5px;top:10%}:host .divider-fill-hor{background-color:var(--theme-accent-500);height:5px;width:100%}:host .form-disabled{background-color:#797979;border-radius:4px;opacity:.5}::ng-deep input:-webkit-autofill,input:-webkit-autofill:active,input:-webkit-autofill:focus,input:-webkit-autofill:hover{-webkit-text-fill-color:hsla(0,0%,100%,.8705882352941177);-webkit-transition:background-color 5000s ease-in-out 0s;transition:background-color 5000s ease-in-out 0s}@media (max-width:768px){.spread{margin:1em!important}}@media (max-width:480px){.spread{margin:.5em!important}}.spinner-logo{display:none!important}:host ::ng-deep .project-image img{height:100%;width:100%}:host ::ng-deep .loading{text-align:center}:host ::ng-deep .divider{background-color:var(--theme-accent-500);height:1px;width:100%}:host ::ng-deep .spinner-logo{display:none!important}"]
+                },] }
+    ];
+    ApplicationsFlowProjectsElementComponent.ctorParameters = function () { return [
+        { type: i0.Injector },
+        { type: ApplicationsFlowService },
+        { type: ProjectService },
+        { type: EaCService }
+    ]; };
+
+    var HostingDetailsFormGroupComponent = /** @class */ (function () {
+        //  Constructors
+        function HostingDetailsFormGroupComponent(formBuilder) {
+            this.formBuilder = formBuilder;
+        }
+        Object.defineProperty(HostingDetailsFormGroupComponent.prototype, "BuildPipelineFormControl", {
+            get: function () {
+                return this.FormGroup.get('buildPipeline');
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(HostingDetailsFormGroupComponent.prototype, "DevOpsActionNameFormControl", {
+            get: function () {
+                return this.FormGroup.get('devOpsActionName');
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(HostingDetailsFormGroupComponent.prototype, "FormGroup", {
+            get: function () {
+                return this.ParentFormGroup.get('hostingDetails');
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(HostingDetailsFormGroupComponent.prototype, "NPMTokenFormControl", {
+            get: function () {
+                return this.FormGroup.get('npmToken');
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(HostingDetailsFormGroupComponent.prototype, "SelectedHostingOption", {
+            get: function () {
+                var _this = this;
+                var _a, _b;
+                return (_b = (_a = this.Details) === null || _a === void 0 ? void 0 : _a.HostingOptions) === null || _b === void 0 ? void 0 : _b.find(function (ho) { return ho.Lookup === _this.BuildPipeline; });
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(HostingDetailsFormGroupComponent.prototype, "SelectedHostingOptionInputControlValues", {
+            get: function () {
+                var _this = this;
+                var _a, _b;
+                return (_b = (_a = this.SelectedHostingOption) === null || _a === void 0 ? void 0 : _a.Inputs) === null || _b === void 0 ? void 0 : _b.reduce(function (prev, cur) {
+                    var res = Object.assign({}, prev);
+                    res[cur.Lookup] = _this.FormGroup.controls[cur.Lookup].value;
+                    return res;
+                }, {});
+            },
+            enumerable: false,
+            configurable: true
+        });
+        //  Life Cycle
+        HostingDetailsFormGroupComponent.prototype.ngOnChanges = function () { };
+        HostingDetailsFormGroupComponent.prototype.ngOnInit = function () {
+            var _a, _b, _c;
+            this.BuildPipeline =
+                this.BuildPipeline || ((_a = this.Details) === null || _a === void 0 ? void 0 : _a.HostingOptions)
+                    ? (_c = (_b = this.Details) === null || _b === void 0 ? void 0 : _b.HostingOptions[0]) === null || _c === void 0 ? void 0 : _c.Lookup : '';
+            if (this.FormGroup != null) {
+                this.ParentFormGroup.removeControl('hostingDetails');
+            }
+            this.ParentFormGroup.addControl('hostingDetails', this.formBuilder.group({
+                buildPipeline: [this.BuildPipeline, [forms.Validators.required]],
+            }));
+            this.setupControlsForForm();
         };
         //  API Methods
         HostingDetailsFormGroupComponent.prototype.BuildPipelineChanged = function () {
@@ -2641,10 +2714,10 @@
 
     var AppsFlowComponent = /** @class */ (function () {
         //  Constructors
-        function AppsFlowComponent(formBldr, appsFlowSvc, appsFlowEventsSvc) {
+        function AppsFlowComponent(formBldr, appsFlowSvc, eacSvc) {
             this.formBldr = formBldr;
             this.appsFlowSvc = appsFlowSvc;
-            this.appsFlowEventsSvc = appsFlowEventsSvc;
+            this.eacSvc = eacSvc;
             this.EditingApplicationLookup = null;
             this.redirectTooltip = '';
             // this.IsPermanent = false;
@@ -3011,9 +3084,7 @@
             this.SetEditingApplication(i2.Guid.CreateRaw());
         };
         AppsFlowComponent.prototype.DeleteApplication = function (appLookup, appName) {
-            if (confirm("Are you sure you want to delete application '" + appName + "'?")) {
-                this.appsFlowEventsSvc.DeleteApplication(appLookup);
-            }
+            this.eacSvc.DeleteApplication(appLookup, appName);
         };
         AppsFlowComponent.prototype.LCUTypeChanged = function (event) {
             this.LCUType = event.value;
@@ -3152,7 +3223,7 @@
             else if (app) {
                 app.SourceControlLookup = null;
             }
-            this.appsFlowEventsSvc.SaveApplicationAsCode(saveAppReq);
+            this.eacSvc.SaveApplicationAsCode(saveAppReq);
         };
         AppsFlowComponent.prototype.SetEditingApplication = function (appLookup) {
             this.EditingApplicationLookup = appLookup;
@@ -3172,7 +3243,7 @@
         };
         AppsFlowComponent.prototype.Unpack = function (appLookup, app) {
             var _a, _b, _c;
-            this.appsFlowEventsSvc.UnpackLowCodeUnit({
+            this.eacSvc.UnpackLowCodeUnit({
                 ApplicationLookup: appLookup,
                 ApplicationName: (_a = app.Application) === null || _a === void 0 ? void 0 : _a.Name,
                 Version: ((_b = app.LowCodeUnit) === null || _b === void 0 ? void 0 : _b.Version) || ((_c = app.LowCodeUnit) === null || _c === void 0 ? void 0 : _c.Build),
@@ -3373,7 +3444,7 @@
     AppsFlowComponent.ctorParameters = function () { return [
         { type: forms.FormBuilder },
         { type: ApplicationsFlowService },
-        { type: ApplicationsFlowEventsService }
+        { type: EaCService }
     ]; };
     AppsFlowComponent.propDecorators = {
         Data: [{ type: i0.Input, args: ['data',] }],
@@ -4717,284 +4788,761 @@
     SlottedCardComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: 'lcu-slotted-card',
-                    template: "<mat-card class=\"col-info-card\">\n    <mat-card-header fxLayoutAlign=\"space-between center\">\n      <mat-card-title class=\"card-title\">{{ Title }}</mat-card-title>\n      <mat-icon class=\"header-icon\">{{ Icon }}</mat-icon>\n    </mat-card-header>\n    \n    <mat-card-content>\n\n        <div class=\"slot-main-container\">\n\n            <div class=\"header-description\">{{ MainSlotDescription }}</div>\n\n            <div class=\"slot-main\">\n                <ng-content></ng-content>\n            </div>\n        \n        </div>\n\n        <div *ngIf=\"SecondarySlotDescription\" class=\"slot-secondary-container\">\n\n            <div class=\"header-description\">{{ SecondarySlotDescription }}</div>\n\n            <div class=\"slot-secondary\">\n                <ng-content select=\"[secondary]\"></ng-content>\n            </div>\n        \n        </div>\n      \n    </mat-card-content>\n\n    <mat-card-actions *ngIf=\"ActionText\" fxLayoutAlign=\"center\">\n      <button mat-button class=\"slotted-card-action-btn\" click=\"MainActionClickEvent()\">{{ ActionText }}</button>\n    </mat-card-actions>\n\n  </mat-card>\n\n\n",
-                    styles: [".col-info-card{background-color:#fff;border:2px solid #d3d3d3;margin:20px;padding:0}.header-icon{margin-right:10px}.card-title{font-size:30px;margin-bottom:0}.header-description{background-color:#d3d3d3;margin-left:-2px;padding:10px}mat-card-actions{margin-bottom:0!important;margin-left:-1px!important;margin-right:0!important}.slotted-card-action-btn{border-radius:0 0 2px 2px;border-top:1px solid #d3d3d3;width:100%}"]
+                    template: "<mat-card class=\"col-info-card\">\n    <mat-card-header fxLayoutAlign=\"space-between center\">\n      <mat-card-title class=\"card-title\">{{ Title }}</mat-card-title>\n      <mat-icon class=\"header-icon\">{{ Icon }}</mat-icon>\n    </mat-card-header>\n    \n    <mat-card-content>\n\n        <div class=\"slot-main-container\">\n\n            <div class=\"header-description\">{{ MainSlotDescription }}</div>\n\n            <div class=\"slot-main\">\n                <ng-content></ng-content>\n            </div>\n        \n        </div>\n\n        <div *ngIf=\"SecondarySlotDescription\" class=\"slot-secondary-container\">\n\n            <div class=\"header-description\">{{ SecondarySlotDescription }}</div>\n\n            <div class=\"slot-secondary\">\n                <ng-content select=\"[secondary]\"></ng-content>\n            </div>\n        \n        </div>\n      \n    </mat-card-content>\n\n    <mat-card-actions *ngIf=\"ActionText\" fxLayoutAlign=\"center\">\n      <a mat-button class=\"slotted-card-action-btn\" [href]=\"ActionPath\">{{ ActionText }}</a>\n    </mat-card-actions>\n\n  </mat-card>\n\n\n",
+                    styles: [".col-info-card{border:2px solid #d3d3d3;margin:20px;padding:0}.header-icon{margin-right:10px}.card-title{font-size:30px;margin-bottom:0}.header-description{background-color:#d3d3d3;margin-left:-2px;padding:10px}mat-card-actions{margin-bottom:0!important;margin-left:-1px!important;margin-right:0!important}.slotted-card-action-btn{border-radius:0 0 2px 2px;border-top:1px solid #d3d3d3;width:100%}"]
+                },] }
+    ];
+    SlottedCardComponent.ctorParameters = function () { return []; };
+    SlottedCardComponent.propDecorators = {
+        Title: [{ type: i0.Input, args: ['title',] }],
+        Icon: [{ type: i0.Input, args: ['icon',] }],
+        MainSlotDescription: [{ type: i0.Input, args: ['main-slot-description',] }],
+        SecondarySlotDescription: [{ type: i0.Input, args: ['secondary-slot-description',] }],
+        ActionText: [{ type: i0.Input, args: ['action-text',] }],
+        ActionPath: [{ type: i0.Input, args: ['action-path',] }],
+        MainActionClicked: [{ type: i0.Output, args: ['main-action-clicked',] }]
+    };
+
+    var ProjectInfoCardComponent = /** @class */ (function () {
+        function ProjectInfoCardComponent() {
+            this.LeftClickEvent = new i0.EventEmitter();
+            this.RightClickEvent = new i0.EventEmitter();
+        }
+        ProjectInfoCardComponent.prototype.ngOnInit = function () {
+        };
+        ProjectInfoCardComponent.prototype.LeftIconClicked = function () {
+            this.LeftClickEvent.emit({});
+        };
+        ProjectInfoCardComponent.prototype.RightIconClicked = function () {
+            this.RightClickEvent.emit({});
+        };
+        return ProjectInfoCardComponent;
+    }());
+    ProjectInfoCardComponent.decorators = [
+        { type: i0.Component, args: [{
+                    selector: 'lcu-project-info-card',
+                    template: "<mat-card class=\"project-info-card\">\n\n    <div class=\"header-img-container\" fxLayout=\"row\" >\n        <div class=\"round-project-img\" fxLayoutAlign=\"center center\">\n            <mat-icon class=\"temp-icon\">flutter_dash</mat-icon>\n        </div>\n    </div>\n\n    <div class=\"icon-btn-container\" fxLayout=\"row\" fxLayoutAlign=\"space-between center\" >\n      <button mat-icon-button id=\"left-icon\" (click)=\"LeftIconClicked()\">\n        <mat-icon>settings</mat-icon>\n      </button>\n      <button mat-icon-button id=\"right-icon\" (click)=\"RightIconClicked()\">\n        <mat-icon>share</mat-icon>\n      </button>\n    </div>\n\n    <mat-card-header class=\"project-card-header\" fxLayoutAlign=\"center center\">\n\n      <mat-card-title class=\"project-card-name\" *ngIf=\"Name\">{{Name}}</mat-card-title>\n\n      <mat-card-subtitle class=\"project-card-description\" *ngIf=\"Description\">{{Description}}</mat-card-subtitle>\n\n      <mat-card-subtitle class=\"project-card-host\">\n          <a class=\"host-anchor\" *ngIf=\"Subtext\" [href]=\"Subtext\" target=\"_blank\">{{Subtext}}</a>\n      </mat-card-subtitle>\n\n    </mat-card-header>\n    <mat-card-content class=\"card-content-container\">\n      <div class=\"stats-container\">\n        <ng-content  select=\"[stats]\"></ng-content>\n      </div>\n\n      <div class=\"promo-container\">\n        <ng-content  select=\"[promo]\"></ng-content>\n      </div>\n\n    </mat-card-content>\n    <mat-card-actions class=\"actions-container\">\n      <ng-content select=\"[action]\"></ng-content>\n      \n    </mat-card-actions>\n  </mat-card>\n  \n",
+                    styles: [".project-info-card{border:2px solid #d3d3d3;margin:20px;padding:0}.round-project-img{background-color:#dfeff2;border:2px solid #fff;border-radius:40px;height:75px;margin-top:20px;text-align:center;width:75px}.temp-icon{font-size:50px;height:50px;width:50px}.icon-btn-container{margin:5px}.project-card-header{margin-top:50px;text-align:center}.host-anchor{color:#4a918e;text-decoration:none}.header-img-container{background-color:#a4bab3;border-radius:2px 2px 0 0;height:60px;justify-content:center;margin-right:-.5px;margin-top:-.5px!important}.project-card-name{font-size:30px;font-weight:600}.card-content-container{margin-bottom:0!important}.stats-container{border-bottom:1px solid #d3d3d3;border-top:1px solid #d3d3d3}mat-card-actions{margin-bottom:-1px!important;margin-left:0!important;margin-right:-.5px!important}.actions-container{padding:0!important}.info-card-btn{border-radius:0 0 2px 2px;border-top:1px solid #d3d3d3;width:100%}"]
+                },] }
+    ];
+    ProjectInfoCardComponent.ctorParameters = function () { return []; };
+    ProjectInfoCardComponent.propDecorators = {
+        Description: [{ type: i0.Input, args: ['description',] }],
+        Image: [{ type: i0.Input, args: ['image',] }],
+        Name: [{ type: i0.Input, args: ['name',] }],
+        Subtext: [{ type: i0.Input, args: ['subtext',] }],
+        LeftClickEvent: [{ type: i0.Output, args: ['left-click-event',] }],
+        RightClickEvent: [{ type: i0.Output, args: ['right-click-event',] }]
+    };
+
+    var AnalyticsCardComponent = /** @class */ (function () {
+        function AnalyticsCardComponent() {
+        }
+        AnalyticsCardComponent.prototype.ngOnInit = function () {
+        };
+        return AnalyticsCardComponent;
+    }());
+    AnalyticsCardComponent.decorators = [
+        { type: i0.Component, args: [{
+                    selector: 'lcu-analytics-card',
+                    template: "<mat-card class=\"analytics-card\">\n    <mat-card-header>\n      <mat-card-title *ngIf=\"Title\">{{Title}}</mat-card-title>\n      <mat-card-subtitle *ngIf=\"Subtext\">{{Subtext}}</mat-card-subtitle>\n    </mat-card-header>\n    <mat-card-content>\n      <!-- <ng-container *ngFor=\"let atics of analytics \"> -->\n          \n        <div class=\"analytic-container\" fxLayout=\"row\" fxLayoutAlign=\"space-between center\">\n            <div fxLayout=\"column\">\n                <div class=\"analytic-number\">57</div>\n                <div class=\"analytic-name\">Unique Visitors</div>\n            </div>\n\n            <div class=\"percent-change increase\" fxLayout=\"row\" fxLayoutAlign=\"space-around center\">\n                <mat-icon>arrow_drop_up</mat-icon>\n                <div>{{ .16 | percent}}</div>\n            </div>\n\n            <!-- <div class=\"percent-change decrease\" fxLayout=\"row\" fxLayoutAlign=\"space-around center\">\n                <mat-icon>arrow_drop_down</mat-icon>\n                <div>16</div>\n            </div> -->\n        </div>\n\n      <!-- </ng-container> -->\n    </mat-card-content>\n    <!-- <mat-card-actions>\n      <button mat-button>LIKE</button>\n      <button mat-button>SHARE</button>\n    </mat-card-actions> -->\n  </mat-card>\n",
+                    styles: [".analytics-card{border:2px solid #d3d3d3;margin:20px;padding:10px}.increase{color:green}.decrease{color:red}"]
+                },] }
+    ];
+    AnalyticsCardComponent.ctorParameters = function () { return []; };
+    AnalyticsCardComponent.propDecorators = {
+        Title: [{ type: i0.Input, args: ['title',] }],
+        Subtext: [{ type: i0.Input, args: ['subtext',] }],
+        Analytics: [{ type: i0.Input, args: ['analytics',] }]
+    };
+
+    var FeedCardSmComponent = /** @class */ (function () {
+        function FeedCardSmComponent() {
+        }
+        FeedCardSmComponent.prototype.ngOnInit = function () {
+            this.determineIconColor();
+        };
+        //HELPERS
+        FeedCardSmComponent.prototype.determineIconColor = function () {
+            if (this.Icon === "check_circle") {
+                this.IconColor = "green";
+            }
+            else if (this.Icon === "cancel") {
+                this.IconColor = "red";
+            }
+        };
+        return FeedCardSmComponent;
+    }());
+    FeedCardSmComponent.decorators = [
+        { type: i0.Component, args: [{
+                    selector: 'lcu-feed-card-sm',
+                    template: "<mat-card class=\"social-card\">\n    <div class=\"feed-card-container\" fxLayout=\"row\">\n        <mat-icon *ngIf=\"Icon\" [style.color]=\"IconColor\">{{Icon}}</mat-icon>\n        <div class=\"feed-card-main-content\">\n            <mat-card-title *ngIf=\"Title\">{{Title}}</mat-card-title>\n            <div *ngIf=\"Subtext\">{{Subtext}}</div>\n            <div *ngIf=\"Description\">{{Description}}</div>\n            <ng-content select=\"[more-details]\"></ng-content>\n        </div>\n    </div>\n\n    <mat-card-actions fxLayout=\"row\" fxLayoutAlign=\"end\">\n      <ng-content select=\"[actions]\"></ng-content>\n    </mat-card-actions>\n  </mat-card>\n",
+                    styles: [".social-card{border:2px solid #d3d3d3;margin:20px;padding:15px 5px}mat-card-actions{margin-bottom:-1px!important;margin-left:0!important;margin-right:-.5px!important}.main-slot-container{padding:10px}.slot-header{align-items:center}.slot-content{width:100%}.slot-name{font-size:22px;font-weight:600;padding-left:5px}.slot-description{font-size:12px;margin-right:10px}.slot-action-anchor{color:#000;font-size:10px;text-decoration:none}.action-icon{font-size:25px;height:25px;width:25px}.gold-icon{color:#d4af37}.upgrade-text{cursor:pointer;font-weight:700;margin-left:10px}"]
+                },] }
+    ];
+    FeedCardSmComponent.ctorParameters = function () { return []; };
+    FeedCardSmComponent.propDecorators = {
+        Icon: [{ type: i0.Input, args: ["icon",] }],
+        Title: [{ type: i0.Input, args: ["title",] }],
+        Subtext: [{ type: i0.Input, args: ["subtext",] }],
+        Description: [{ type: i0.Input, args: ["description",] }]
+    };
+
+    var GhControlComponent = /** @class */ (function () {
+        function GhControlComponent() {
+            this.InputLabel = "Create Pull Request";
+            this.selectedBtn = "pr-btn";
+        }
+        GhControlComponent.prototype.ngOnInit = function () {
+        };
+        GhControlComponent.prototype.ngAfterViewInit = function () {
+            this.addSelectBtn();
+        };
+        GhControlComponent.prototype.CreateFeatureBranch = function () {
+            this.removeSelectedBtn();
+            this.InputLabel = "Create Feature Branch";
+            this.selectedBtn = "fb-btn";
+            this.addSelectBtn();
+            console.log("create feature branch selected");
+        };
+        GhControlComponent.prototype.OpenIssue = function () {
+            this.removeSelectedBtn();
+            this.InputLabel = "Open Issue";
+            this.selectedBtn = "oi-btn";
+            this.addSelectBtn();
+            console.log("open issue selected");
+        };
+        GhControlComponent.prototype.CreatePullRequest = function () {
+            this.removeSelectedBtn();
+            this.InputLabel = "Create Pull Request";
+            this.selectedBtn = "pr-btn";
+            this.addSelectBtn();
+            console.log("create pull request selected");
+        };
+        GhControlComponent.prototype.OpenMoreInfo = function () {
+            console.log("more info selected");
+        };
+        GhControlComponent.prototype.Submit = function () {
+            console.log("submitting: ", this.value);
+            switch (this.selectedBtn) {
+                case "pr-btn":
+                    //Pull request
+                    console.log("creating pull request: ", this.value);
+                    break;
+                case "oi-btn":
+                    //Open Issue
+                    console.log("Open issue: ", this.value);
+                    break;
+                case "fb-btn":
+                    //Feature Branch
+                    console.log("creating feature branch: ", this.value);
+                    break;
+                default:
+                    console.log("hmm");
+                    break;
+            }
+        };
+        //HELPERS
+        GhControlComponent.prototype.addSelectBtn = function () {
+            document.getElementById(this.selectedBtn).classList.add('selected');
+        };
+        GhControlComponent.prototype.removeSelectedBtn = function () {
+            document.getElementById(this.selectedBtn).classList.remove('selected');
+        };
+        return GhControlComponent;
+    }());
+    GhControlComponent.decorators = [
+        { type: i0.Component, args: [{
+                    selector: 'lcu-gh-control',
+                    template: "<mat-card class=\"social-card\">\n    <div class=\"gh-card-container\" fxLayout=\"row\" fxLayoutAlign=\"center center\">\n        <mat-icon fxFlex=\"15%\" class=\"gh-icon\">error_outline</mat-icon>\n        <div fxFlex=\"70%\"class=\"gh-card-main-content\">\n            <mat-form-field appearance=\"fill\" class=\"gh-input\">\n                <mat-label>{{InputLabel}}</mat-label>\n                <input matInput type=\"text\" [(ngModel)]=\"value\">\n                <!-- <button *ngIf=\"value\" matSuffix mat-icon-button aria-label=\"Clear\" (click)=\"value=''\">\n                  <mat-icon>close</mat-icon>\n                </button> -->\n              </mat-form-field>\n        </div>\n        <button fxFlex=\"15%\" mat-button (click)=\"Submit()\" id=\"submit-btn\">Submit</button>\n    </div>\n\n    <mat-card-actions fxLayout=\"row\" fxLayoutAlign=\"space-around center\">\n        <button mat-button (click)=\"CreatePullRequest()\" id=\"pr-btn\">Pull Request</button>\n        <button mat-button (click)=\"OpenIssue()\" id=\"oi-btn\">Open Issue</button>\n        <button mat-button (click)=\"CreateFeatureBranch()\" id=\"fb-btn\">Feature Branch</button>\n        <button mat-icon-button (click)=\"OpenMoreInfo()\">\n            <mat-icon>more_horiz</mat-icon>\n        </button>\n    </mat-card-actions>\n  </mat-card>",
+                    styles: [".social-card{border:2px solid #d3d3d3;margin:20px;padding:15px 5px}mat-card-actions{margin-bottom:-1px!important;margin-left:0!important;margin-right:-.5px!important}.main-slot-container{padding:10px}.slot-header{align-items:center}.slot-content{width:100%}.slot-name{font-size:22px;font-weight:600;padding-left:5px}.slot-description{font-size:12px;margin-right:10px}.slot-action-anchor{color:#000;font-size:10px;text-decoration:none}.action-icon{font-size:25px;height:25px;width:25px}.gold-icon{color:#d4af37}.upgrade-text{cursor:pointer;font-weight:700;margin-left:10px}.gh-icon{font-size:60px;height:60px;text-align:center;width:60px}.gh-input{width:90%}.selected{border:1px solid green}::ng-deep .mat-form-field-flex{border:1px solid;border-radius:30px!important}::ng-deep .mat-form-field-wrapper{padding-bottom:0!important}"]
+                },] }
+    ];
+    GhControlComponent.ctorParameters = function () { return []; };
+
+    var MainFeedCardComponent = /** @class */ (function () {
+        function MainFeedCardComponent() {
+        }
+        MainFeedCardComponent.prototype.ngOnInit = function () {
+        };
+        MainFeedCardComponent.prototype.MoreClicked = function () {
+            console.log("More clicked");
+        };
+        return MainFeedCardComponent;
+    }());
+    MainFeedCardComponent.decorators = [
+        { type: i0.Component, args: [{
+                    selector: 'lcu-main-feed-card',
+                    template: "<mat-card class=\"social-card\">\n    <mat-card-header fxLayout=\"row\">\n        <div *ngIf=\"Avatar\" mat-card-avatar class=\"example-header-image\" [style.backgroundImage]=\"Avatar\" fxFlex=\"10%\"></div>\n        <div class=\"header-main-content-container\" fxFlex=\"80%\">\n            <mat-card-title *ngIf=\"Title\">{{Title}}</mat-card-title>\n            <div *ngIf=\"Subtext\">{{Subtext}}</div>\n            <div *ngIf=\"TimeAgo\">{{TimeAgo}}</div>\n        </div>\n        <div fxFlex=\"10%\">\n            <button mat-icon-button (click)=\"MoreClicked()\" >\n                <mat-icon>more_horiz</mat-icon>\n            </button>\n        </div>\n\n      </mat-card-header>\n    \n    <div class=\"feed-card-container\" fxLayout=\"row\">\n        <div class=\"feed-card-main-content\">\n            <ng-content select=\"[tabs]\"></ng-content>\n        </div>\n    </div>\n\n    <mat-card-actions fxLayout=\"row\" fxLayoutAlign=\"space-around center\">\n      <ng-content select=\"[actions]\"></ng-content>\n        \n\n    </mat-card-actions>\n  </mat-card>\n",
+                    styles: [".social-card{border:2px solid #d3d3d3;margin:20px;padding:15px 5px}mat-card-actions{margin-bottom:-1px!important;margin-left:0!important;margin-right:-.5px!important}.main-slot-container{padding:10px}.slot-header{align-items:center}.slot-content{width:100%}.slot-name{font-size:22px;font-weight:600;padding-left:5px}.slot-description{font-size:12px;margin-right:10px}.slot-action-anchor{color:#000;font-size:10px;text-decoration:none}.action-icon{font-size:25px;height:25px;width:25px}.gold-icon{color:#d4af37}.upgrade-text{cursor:pointer;font-weight:700;margin-left:10px}.example-header-image{background-size:cover}"]
+                },] }
+    ];
+    MainFeedCardComponent.ctorParameters = function () { return []; };
+    MainFeedCardComponent.propDecorators = {
+        Avatar: [{ type: i0.Input, args: ['avatar',] }],
+        Title: [{ type: i0.Input, args: ['title',] }],
+        Subtext: [{ type: i0.Input, args: ['subtext',] }],
+        TimeAgo: [{ type: i0.Input, args: ['time-ago',] }]
+    };
+
+    var TwoColumnHeaderComponent = /** @class */ (function () {
+        function TwoColumnHeaderComponent() {
+        }
+        TwoColumnHeaderComponent.prototype.ngOnInit = function () {
+        };
+        return TwoColumnHeaderComponent;
+    }());
+    TwoColumnHeaderComponent.decorators = [
+        { type: i0.Component, args: [{
+                    selector: 'lcu-two-column-header',
+                    template: "<div class=\"col-container\" fxLayout=\"row\">\n\n    <div class=\"col-left\"  fxFlex=\"15%\" >\n        <ng-content select=\"[left]\"></ng-content>\n    </div>\n\n    <div class=\"col-center\" fxFlex=\"85%\">\n        <ng-content></ng-content>\n    </div>\n\n</div>\n",
+                    styles: [".col-container{background-color:#ebecf0}.col-left{min-width:210px}"]
                 },] }
     ];
-    SlottedCardComponent.ctorParameters = function () { return []; };
-    SlottedCardComponent.propDecorators = {
-        Title: [{ type: i0.Input, args: ['title',] }],
-        Icon: [{ type: i0.Input, args: ['icon',] }],
-        MainSlotDescription: [{ type: i0.Input, args: ['main-slot-description',] }],
-        SecondarySlotDescription: [{ type: i0.Input, args: ['secondary-slot-description',] }],
-        ActionText: [{ type: i0.Input, args: ['action-text',] }],
-        MainActionClicked: [{ type: i0.Output, args: ['main-action-clicked',] }]
-    };
+    TwoColumnHeaderComponent.ctorParameters = function () { return []; };
 
-    var ProjectInfoCardComponent = /** @class */ (function () {
-        function ProjectInfoCardComponent() {
-            this.LeftClickEvent = new i0.EventEmitter();
-            this.RightClickEvent = new i0.EventEmitter();
+    var CardCarouselComponent = /** @class */ (function () {
+        function CardCarouselComponent() {
+            this.carouselIndex = 0;
         }
-        ProjectInfoCardComponent.prototype.ngOnInit = function () {
+        CardCarouselComponent.prototype.ngOnInit = function () {
         };
-        ProjectInfoCardComponent.prototype.LeftIconClicked = function () {
-            this.LeftClickEvent.emit({});
+        CardCarouselComponent.prototype.ngAfterViewInit = function () {
+            this.assignCarouselClass();
         };
-        ProjectInfoCardComponent.prototype.RightIconClicked = function () {
-            this.RightClickEvent.emit({});
+        CardCarouselComponent.prototype.LeftChevronClicked = function () {
+            this.removeCarouselClasses();
+            if (this.carouselIndex === 0) {
+                this.carouselIndex = this.Stats.length - 1;
+            }
+            else {
+                this.carouselIndex--;
+            }
+            this.assignCarouselClass();
         };
-        return ProjectInfoCardComponent;
+        CardCarouselComponent.prototype.MoreDetailsClicked = function () {
+            console.log("More details clicked on carousel item", this.Stats[this.carouselIndex]);
+        };
+        CardCarouselComponent.prototype.RightChevronClicked = function () {
+            this.removeCarouselClasses();
+            if (this.carouselIndex === this.Stats.length - 1) {
+                this.carouselIndex = 0;
+            }
+            else {
+                this.carouselIndex++;
+            }
+            this.assignCarouselClass();
+        };
+        //HELPERS
+        CardCarouselComponent.prototype.removeCarouselClasses = function () {
+            for (var i = 0; i < this.Stats.length; i++) {
+                if (i === this.carouselIndex) {
+                    document.getElementById("carousel-" + this.carouselIndex).classList.remove('active');
+                }
+                else {
+                    document.getElementById("carousel-" + i).classList.remove('hidden');
+                }
+            }
+        };
+        CardCarouselComponent.prototype.assignCarouselClass = function () {
+            for (var i = 0; i < this.Stats.length; i++) {
+                if (i === this.carouselIndex) {
+                    document.getElementById("carousel-" + this.carouselIndex).classList.add('active');
+                }
+                else {
+                    document.getElementById("carousel-" + i).classList.add('hidden');
+                }
+            }
+        };
+        return CardCarouselComponent;
     }());
-    ProjectInfoCardComponent.decorators = [
+    CardCarouselComponent.decorators = [
         { type: i0.Component, args: [{
-                    selector: 'lcu-project-info-card',
-                    template: "<mat-card class=\"project-info-card\">\n\n    <div class=\"header-img-container\" fxLayout=\"row\" >\n        <div class=\"round-project-img\" fxLayoutAlign=\"center center\">\n            <mat-icon class=\"temp-icon\">flutter_dash</mat-icon>\n        </div>\n    </div>\n\n    <div class=\"icon-btn-container\" fxLayout=\"row\" fxLayoutAlign=\"space-between center\" >\n      <button mat-icon-button id=\"left-icon\" (click)=\"LeftIconClicked()\">\n        <mat-icon>settings</mat-icon>\n      </button>\n      <button mat-icon-button id=\"right-icon\" (click)=\"RightIconClicked()\">\n        <mat-icon>share</mat-icon>\n      </button>\n    </div>\n\n    <mat-card-header class=\"project-card-header\" fxLayoutAlign=\"center center\">\n\n      <mat-card-title class=\"project-card-name\" *ngIf=\"Name\">{{Name}}</mat-card-title>\n\n      <mat-card-subtitle class=\"project-card-description\" *ngIf=\"Description\">{{Description}}</mat-card-subtitle>\n\n      <mat-card-subtitle class=\"project-card-host\">\n          <a class=\"host-anchor\" *ngIf=\"Subtext\" [href]=\"Subtext\" target=\"_blank\">{{Subtext}}</a>\n      </mat-card-subtitle>\n\n    </mat-card-header>\n    <mat-card-content class=\"card-content-container\">\n      <div class=\"stats-container\">\n        <ng-content  select=\"[stats]\"></ng-content>\n      </div>\n\n      <div class=\"promo-container\">\n        <ng-content  select=\"[promo]\"></ng-content>\n      </div>\n\n    </mat-card-content>\n    <mat-card-actions class=\"actions-container\">\n      <ng-content select=\"[action]\"></ng-content>\n      \n    </mat-card-actions>\n  </mat-card>\n  \n",
-                    styles: [".project-info-card{background-color:#fff;border:2px solid #d3d3d3;margin:20px;padding:0}.round-project-img{background-color:#dfeff2;border:2px solid #fff;border-radius:40px;height:75px;margin-top:20px;text-align:center;width:75px}.temp-icon{font-size:50px;height:50px;width:50px}.icon-btn-container{margin:5px}.project-card-header{margin-top:50px;text-align:center}.host-anchor{color:#4a918e;text-decoration:none}.header-img-container{background-color:#a4bab3;border-radius:2px 2px 0 0;height:60px;justify-content:center;margin-right:-.5px;margin-top:-.5px!important}.project-card-name{font-size:30px;font-weight:600}.card-content-container{margin-bottom:0!important}.stats-container{border-bottom:1px solid #d3d3d3;border-top:1px solid #d3d3d3}mat-card-actions{margin-bottom:-1px!important;margin-left:0!important;margin-right:-.5px!important}.actions-container{padding:0!important}.info-card-btn{border-radius:0 0 2px 2px;border-top:1px solid #d3d3d3;width:100%}"]
+                    selector: 'lcu-card-carousel',
+                    template: "<div stats class=\"carousel-container\">\n    <div class=\"chevron-container\" fxLayout=\"row\">\n        <button mat-icon-button class=\"chevron-button\" id=\"left-chevron\" (click)=\"LeftChevronClicked()\">\n            <mat-icon>chevron_left</mat-icon>\n        </button>\n        <button mat-icon-button class=\"chevron-button\" id=\"right-chevron\" (click)=\"RightChevronClicked()\">\n            <mat-icon>chevron_right</mat-icon>\n        </button>\n    </div>\n    <ng-container *ngFor=\"let stat of Stats; let i = index\">\n            <div class=\"carousel-item\" [id]=\"'carousel-'+i\">\n                <div class=\"carousel-title\">{{stat.Name}}</div>\n                <div class=\"carousel-stat\">{{stat.Stat}}</div>\n            </div>\n    </ng-container>\n    <div (click)=\"MoreDetailsClicked()\">More details</div>\n</div>\n",
+                    styles: [".carousel-container{height:75px;padding-top:20px;text-align:center}.carousel-item.hidden{display:none}.carousel-item.active{visibility:visible}.chevron-button{position:absolute}#right-chevron{right:5px}#left-chevron{left:5px}"]
                 },] }
     ];
-    ProjectInfoCardComponent.ctorParameters = function () { return []; };
-    ProjectInfoCardComponent.propDecorators = {
-        Description: [{ type: i0.Input, args: ['description',] }],
-        Image: [{ type: i0.Input, args: ['image',] }],
-        Name: [{ type: i0.Input, args: ['name',] }],
-        Subtext: [{ type: i0.Input, args: ['subtext',] }],
-        LeftClickEvent: [{ type: i0.Output, args: ['left-click-event',] }],
-        RightClickEvent: [{ type: i0.Output, args: ['right-click-event',] }]
+    CardCarouselComponent.ctorParameters = function () { return []; };
+    CardCarouselComponent.propDecorators = {
+        Stats: [{ type: i0.Input, args: ['stats',] }]
     };
 
-    var AnalyticsCardComponent = /** @class */ (function () {
-        function AnalyticsCardComponent() {
+    var SecurityToggleComponent = /** @class */ (function () {
+        function SecurityToggleComponent(formBldr) {
+            this.formBldr = formBldr;
         }
-        AnalyticsCardComponent.prototype.ngOnInit = function () {
+        Object.defineProperty(SecurityToggleComponent.prototype, "IsPrivateFormControl", {
+            get: function () {
+                var _a;
+                return (_a = this.SecurityFormGroup) === null || _a === void 0 ? void 0 : _a.controls.isPrivate;
+            },
+            enumerable: false,
+            configurable: true
+        });
+        SecurityToggleComponent.prototype.ngOnInit = function () {
+            this.setupSecurityFormGroup();
         };
-        return AnalyticsCardComponent;
+        SecurityToggleComponent.prototype.SecuritySubmit = function () {
+            console.log("submitting values");
+        };
+        SecurityToggleComponent.prototype.setupSecurityFormGroup = function () {
+            var _a, _b;
+            this.ProcessorType = ((_b = (_a = this.EditingApplication) === null || _a === void 0 ? void 0 : _a.Processor) === null || _b === void 0 ? void 0 : _b.Type) || '';
+            if (this.EditingApplication != null) {
+                // this.SecurityFormGroup = this.formBldr.group({
+                //   name: [this.EditingApplication.Application?.Name, Validators.required],
+                //   description: [
+                //     this.EditingApplication.Application?.Description,
+                //     Validators.required,
+                //   ],
+                //   route: [
+                //     this.EditingApplication.LookupConfig?.PathRegex.replace('.*', '') ||
+                //       '/',
+                //     Validators.required,
+                //   ],
+                //   // priority: [
+                //   //   this.EditingApplication.Application?.Priority || 10000,
+                //   //   Validators.required,
+                //   // ],
+                //   procType: [this.ProcessorType, [Validators.required]],
+                // });
+            }
+            this.setupSecurityForm();
+        };
+        SecurityToggleComponent.prototype.setupSecurityForm = function () {
+            var _a, _b;
+            this.SecurityFormGroup.addControl('isPrivate', this.formBldr.control(((_a = this.EditingApplication.LookupConfig) === null || _a === void 0 ? void 0 : _a.IsPrivate) || false, [forms.Validators.required]));
+            this.SecurityFormGroup.addControl('isTriggerSignIn', this.formBldr.control(((_b = this.EditingApplication.LookupConfig) === null || _b === void 0 ? void 0 : _b.IsTriggerSignIn) || false, [forms.Validators.required]));
+        };
+        return SecurityToggleComponent;
     }());
-    AnalyticsCardComponent.decorators = [
+    SecurityToggleComponent.decorators = [
         { type: i0.Component, args: [{
-                    selector: 'lcu-analytics-card',
-                    template: "<mat-card class=\"analytics-card\">\n    <mat-card-header>\n      <mat-card-title *ngIf=\"Title\">{{Title}}</mat-card-title>\n      <mat-card-subtitle *ngIf=\"Subtext\">{{Subtext}}</mat-card-subtitle>\n    </mat-card-header>\n    <mat-card-content>\n      <!-- <ng-container *ngFor=\"let atics of analytics \"> -->\n          \n        <div class=\"analytic-container\" fxLayout=\"row\" fxLayoutAlign=\"space-between center\">\n            <div fxLayout=\"column\">\n                <div class=\"analytic-number\">57</div>\n                <div class=\"analytic-name\">Unique Visitors</div>\n            </div>\n\n            <div class=\"percent-change increase\" fxLayout=\"row\" fxLayoutAlign=\"space-around center\">\n                <mat-icon>arrow_drop_up</mat-icon>\n                <div>{{ .16 | percent}}</div>\n            </div>\n\n            <!-- <div class=\"percent-change decrease\" fxLayout=\"row\" fxLayoutAlign=\"space-around center\">\n                <mat-icon>arrow_drop_down</mat-icon>\n                <div>16</div>\n            </div> -->\n        </div>\n\n      <!-- </ng-container> -->\n    </mat-card-content>\n    <!-- <mat-card-actions>\n      <button mat-button>LIKE</button>\n      <button mat-button>SHARE</button>\n    </mat-card-actions> -->\n  </mat-card>\n",
-                    styles: [".analytics-card{background-color:#fff;border:2px solid #d3d3d3;margin:20px;padding:10px}.increase{color:green}.decrease{color:red}"]
+                    selector: 'lcu-security-toggle',
+                    template: "<form class=\"security-form\" [formGroup]=\"SecurityFormGroup\" (ngSubmit)=\"SecuritySubmit()\">\n    <mat-card class=\"spread flow-card\">\n        <mat-card-header>\n          <mat-card-title> Security Settings </mat-card-title>\n\n        <div fxFlex></div>\n\n        <mat-slide-toggle\n              formControlName=\"isPrivate\"\n              matTooltip=\"Is Secure Application?\"\n            >\n        </mat-slide-toggle>\n\n            <mat-icon\n              matSuffix\n              matTooltip=\"A Secured Application is one that requires the user to be authenticated to use the application. The application is hosted behind an identity wall.\"\n            >\n              info_outline\n            </mat-icon>\n          </mat-card-header>\n\n          <mat-card-content>\n            <div>\n              <div *ngIf=\"IsPrivateFormControl.value\">\n                <div>\n                  <mat-slide-toggle formControlName=\"isTriggerSignIn\">\n                    Is Trigger Sign In Application?\n                  </mat-slide-toggle>\n\n                  <mat-icon\n                    matSuffix\n                    matTooltip=\"A Trigger Sign In Application will direct the user to sign in if they are not already.\"\n                  >\n                    info_outline\n                  </mat-icon>\n                </div>\n              </div>\n            </div>\n          </mat-card-content>\n        \n        <mat-card-actions>\n            <!-- [disabled]=\"!SecurityFormGroup.valid || !SecurityFormGroup.dirty\" -->\n            <button mat-raised-button type=\"submit\" >Save Security Settings</button>\n        </mat-card-actions>\n    </mat-card>\n</form>\n",
+                    styles: ["::ng-deep .mat-tooltip{color:#000!important}"]
                 },] }
     ];
-    AnalyticsCardComponent.ctorParameters = function () { return []; };
-    AnalyticsCardComponent.propDecorators = {
-        Title: [{ type: i0.Input, args: ['title',] }],
-        Subtext: [{ type: i0.Input, args: ['subtext',] }],
-        Analytics: [{ type: i0.Input, args: ['analytics',] }]
+    SecurityToggleComponent.ctorParameters = function () { return [
+        { type: forms.FormBuilder }
+    ]; };
+    SecurityToggleComponent.propDecorators = {
+        EditingApplication: [{ type: i0.Input, args: ['editing-application',] }]
     };
 
-    var FeedCardSmComponent = /** @class */ (function () {
-        function FeedCardSmComponent() {
+    var ProcessorDetailsFormComponent = /** @class */ (function () {
+        function ProcessorDetailsFormComponent(formBldr) {
+            this.formBldr = formBldr;
+            // this.EditingApplicationLookup = null;
+            this.redirectTooltip = '';
         }
-        FeedCardSmComponent.prototype.ngOnInit = function () {
-            this.determineIconColor();
+        Object.defineProperty(ProcessorDetailsFormComponent.prototype, "BuildFormControl", {
+            get: function () {
+                var _a;
+                return (_a = this.ProcessorDetailsFormGroup) === null || _a === void 0 ? void 0 : _a.controls.build;
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(ProcessorDetailsFormComponent.prototype, "ClientIDFormControl", {
+            get: function () {
+                var _a;
+                return (_a = this.ProcessorDetailsFormGroup) === null || _a === void 0 ? void 0 : _a.controls.clientId;
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(ProcessorDetailsFormComponent.prototype, "DefaultFileFormControl", {
+            get: function () {
+                var _a;
+                return (_a = this.ProcessorDetailsFormGroup) === null || _a === void 0 ? void 0 : _a.controls.defaultFile;
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(ProcessorDetailsFormComponent.prototype, "InboundPathFormControl", {
+            get: function () {
+                var _a;
+                return (_a = this.ProcessorDetailsFormGroup) === null || _a === void 0 ? void 0 : _a.controls.inboundPath;
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(ProcessorDetailsFormComponent.prototype, "TokenLookupFormControl", {
+            get: function () {
+                var _a;
+                return (_a = this.ProcessorDetailsFormGroup) === null || _a === void 0 ? void 0 : _a.controls.tokenLookup;
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(ProcessorDetailsFormComponent.prototype, "RedirectFormControl", {
+            get: function () {
+                var _a;
+                return (_a = this.ProcessorDetailsFormGroup) === null || _a === void 0 ? void 0 : _a.controls.redirect;
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(ProcessorDetailsFormComponent.prototype, "ScopesFormControl", {
+            get: function () {
+                var _a;
+                return (_a = this.ProcessorDetailsFormGroup) === null || _a === void 0 ? void 0 : _a.controls.scopes;
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(ProcessorDetailsFormComponent.prototype, "SecurityFormControl", {
+            get: function () {
+                var _a;
+                return (_a = this.ProcessorDetailsFormGroup) === null || _a === void 0 ? void 0 : _a.controls.security;
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(ProcessorDetailsFormComponent.prototype, "SPARootFormControl", {
+            get: function () {
+                var _a;
+                return (_a = this.ProcessorDetailsFormGroup) === null || _a === void 0 ? void 0 : _a.controls.spaRoot;
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(ProcessorDetailsFormComponent.prototype, "PermanentFormControl", {
+            get: function () {
+                var _a;
+                return (_a = this.ProcessorDetailsFormGroup) === null || _a === void 0 ? void 0 : _a.controls.permanent;
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(ProcessorDetailsFormComponent.prototype, "PreserveMethodFormControl", {
+            get: function () {
+                var _a;
+                return (_a = this.ProcessorDetailsFormGroup) === null || _a === void 0 ? void 0 : _a.controls.preserveMethod;
+            },
+            enumerable: false,
+            configurable: true
+        });
+        ProcessorDetailsFormComponent.prototype.ngOnInit = function () {
+            this.setupProcessorDetailsForm();
+        };
+        ProcessorDetailsFormComponent.prototype.DetermineTooltipText = function () {
+            var permanentValue = this.PermanentFormControl.value;
+            var preserveValue = this.PreserveMethodFormControl.value;
+            if (permanentValue === true && preserveValue === false) {
+                this.redirectTooltip = '301 – Permanent and Not Preserve';
+            }
+            else if (permanentValue === false && preserveValue === false) {
+                this.redirectTooltip = '302 – Not Permanent and Not Preserve';
+            }
+            else if (permanentValue === false && preserveValue === true) {
+                this.redirectTooltip = '307 – Not Permanent and Preserve';
+            }
+            else if (permanentValue === true && preserveValue === true) {
+                this.redirectTooltip = '308 – Permanent and Preserve';
+            }
+        };
+        ProcessorDetailsFormComponent.prototype.SubmitProcessorDetails = function () {
+        };
+        ProcessorDetailsFormComponent.prototype.ProcessorTypeChanged = function (event) {
+            this.ProcessorType = event.value;
+            this.setupProcessorTypeSubForm();
+        };
+        ProcessorDetailsFormComponent.prototype.LCUTypeChanged = function (event) {
+            this.LCUType = event.value;
+            this.setupLcuTypeSubForm();
         };
         //HELPERS
-        FeedCardSmComponent.prototype.determineIconColor = function () {
-            if (this.Icon === "check_circle") {
-                this.IconColor = "green";
+        ProcessorDetailsFormComponent.prototype.cleanupLcuTypeSubForm = function () {
+            this.ProcessorDetailsFormGroup.removeControl('methods');
+            this.ProcessorDetailsFormGroup.removeControl('apiRoot');
+            this.ProcessorDetailsFormGroup.removeControl('security');
+            this.ProcessorDetailsFormGroup.removeControl('spaRoot');
+            this.ProcessorDetailsFormGroup.removeControl('applicationId');
+            this.ProcessorDetailsFormGroup.removeControl('build');
+            this.ProcessorDetailsFormGroup.removeControl('clientId');
+            this.ProcessorDetailsFormGroup.removeControl('clientSecret');
+            this.ProcessorDetailsFormGroup.removeControl('zipFile');
+        };
+        ProcessorDetailsFormComponent.prototype.cleanupProcessorTypeSubForm = function () {
+            this.ProcessorDetailsFormGroup.removeControl('defaultFile');
+            // this.ApplicationFormGroup.removeControl('dfsLcuType');
+            // this.ApplicationFormGroup.removeControl('oauthLcuType');
+            this.ProcessorDetailsFormGroup.removeControl('scopes');
+            this.ProcessorDetailsFormGroup.removeControl('tokenLookup');
+            this.ProcessorDetailsFormGroup.removeControl('inboundPath');
+            this.ProcessorDetailsFormGroup.removeControl('proxyLcuType');
+            this.ProcessorDetailsFormGroup.removeControl('redirect');
+            this.ProcessorDetailsFormGroup.removeControl('permanent');
+            this.ProcessorDetailsFormGroup.removeControl('preserveMethod');
+            this.cleanupLcuTypeSubForm();
+        };
+        ProcessorDetailsFormComponent.prototype.setupLcuTypeSubForm = function () {
+            this.cleanupLcuTypeSubForm();
+            // this.ApplicationFormGroup.removeControl('package');
+            // this.ApplicationFormGroup.removeControl('version');
+            if (this.LCUType) {
+                switch (this.LCUType) {
+                    case 'API':
+                        this.setupLCUAPIForm();
+                        break;
+                    case 'ApplicationPointer':
+                        this.setupLCUApplicationPointerForm();
+                        break;
+                    case 'GitHub':
+                        this.setupLCUGitHubForm();
+                        break;
+                    case 'GitHubOAuth':
+                        this.setupLCUGitHubOAuthForm();
+                        break;
+                    // case 'NPM':
+                    //   this.setupLCUNPMForm();
+                    //   break;
+                    case 'SPA':
+                        this.setupLCUSPAForm();
+                        break;
+                    case 'Zip':
+                        this.setupLCUZipForm();
+                        break;
+                }
             }
-            else if (this.Icon === "cancel") {
-                this.IconColor = "red";
+        };
+        ProcessorDetailsFormComponent.prototype.setupProcessorDetailsForm = function () {
+            var _a, _b, _c, _d, _e;
+            this.ProcessorType = ((_b = (_a = this.EditingApplication) === null || _a === void 0 ? void 0 : _a.Processor) === null || _b === void 0 ? void 0 : _b.Type) || '';
+            if (this.EditingApplication != null) {
+                this.ProcessorDetailsFormGroup = this.formBldr.group({
+                    name: [(_c = this.EditingApplication.Application) === null || _c === void 0 ? void 0 : _c.Name, forms.Validators.required],
+                    description: [
+                        (_d = this.EditingApplication.Application) === null || _d === void 0 ? void 0 : _d.Description,
+                        forms.Validators.required,
+                    ],
+                    route: [
+                        ((_e = this.EditingApplication.LookupConfig) === null || _e === void 0 ? void 0 : _e.PathRegex.replace('.*', '')) ||
+                            '/',
+                        forms.Validators.required,
+                    ],
+                    // priority: [
+                    //   this.EditingApplication.Application?.Priority || 10000,
+                    //   Validators.required,
+                    // ],
+                    procType: [this.ProcessorType, [forms.Validators.required]],
+                });
             }
         };
-        return FeedCardSmComponent;
-    }());
-    FeedCardSmComponent.decorators = [
-        { type: i0.Component, args: [{
-                    selector: 'lcu-feed-card-sm',
-                    template: "<mat-card class=\"social-card\">\n    <div class=\"feed-card-container\" fxLayout=\"row\">\n        <mat-icon *ngIf=\"Icon\" [style.color]=\"IconColor\">{{Icon}}</mat-icon>\n        <div class=\"feed-card-main-content\">\n            <mat-card-title *ngIf=\"Title\">{{Title}}</mat-card-title>\n            <div *ngIf=\"Subtext\">{{Subtext}}</div>\n            <div *ngIf=\"Description\">{{Description}}</div>\n            <ng-content select=\"[more-details]\"></ng-content>\n        </div>\n    </div>\n\n    <mat-card-actions fxLayout=\"row\" fxLayoutAlign=\"end\">\n      <ng-content select=\"[actions]\"></ng-content>\n    </mat-card-actions>\n  </mat-card>\n",
-                    styles: [".social-card{background-color:#fff;border:2px solid #d3d3d3;margin:20px;padding:15px 5px}mat-card-actions{margin-bottom:-1px!important;margin-left:0!important;margin-right:-.5px!important}.main-slot-container{padding:10px}.slot-header{align-items:center}.slot-content{width:100%}.slot-name{font-size:22px;font-weight:600;padding-left:5px}.slot-description{font-size:12px;margin-right:10px}.slot-action-anchor{color:#000;font-size:10px;text-decoration:none}.action-icon{font-size:25px;height:25px;width:25px}.gold-icon{color:#d4af37}.upgrade-text{cursor:pointer;font-weight:700;margin-left:10px}"]
-                },] }
-    ];
-    FeedCardSmComponent.ctorParameters = function () { return []; };
-    FeedCardSmComponent.propDecorators = {
-        Icon: [{ type: i0.Input, args: ["icon",] }],
-        Title: [{ type: i0.Input, args: ["title",] }],
-        Subtext: [{ type: i0.Input, args: ["subtext",] }],
-        Description: [{ type: i0.Input, args: ["description",] }]
-    };
-
-    var GhControlComponent = /** @class */ (function () {
-        function GhControlComponent() {
-            this.InputLabel = "Create Pull Request";
-            this.selectedBtn = "pr-btn";
-        }
-        GhControlComponent.prototype.ngOnInit = function () {
+        ProcessorDetailsFormComponent.prototype.setupLCUGitHubForm = function () {
+            var _a;
+            this.ProcessorDetailsFormGroup.addControl('build', this.formBldr.control(((_a = this.EditingApplication.LowCodeUnit) === null || _a === void 0 ? void 0 : _a.Build) || 'latest', [forms.Validators.required]));
         };
-        GhControlComponent.prototype.ngAfterViewInit = function () {
-            this.addSelectBtn();
+        ProcessorDetailsFormComponent.prototype.setupLCUApplicationPointerForm = function () {
+            var _a;
+            this.ProcessorDetailsFormGroup.addControl('applicationId', this.formBldr.control(((_a = this.EditingApplication.LowCodeUnit) === null || _a === void 0 ? void 0 : _a.ApplicationID) || '', [forms.Validators.required]));
         };
-        GhControlComponent.prototype.CreateFeatureBranch = function () {
-            this.removeSelectedBtn();
-            this.InputLabel = "Create Feature Branch";
-            this.selectedBtn = "fb-btn";
-            this.addSelectBtn();
-            console.log("create feature branch selected");
+        ProcessorDetailsFormComponent.prototype.setupLCUNPMForm = function () {
+            // this.ApplicationFormGroup.addControl(
+            //   'package',
+            //   this.formBldr.control(
+            //     this.EditingApplication.LowCodeUnit?.Package || '',
+            //     [Validators.required]
+            //   )
+            // );
+            // this.ApplicationFormGroup.addControl(
+            //   'version',
+            //   this.formBldr.control(
+            //     this.EditingApplication.LowCodeUnit?.Version || '',
+            //     [Validators.required]
+            //   )
+            // );
         };
-        GhControlComponent.prototype.OpenIssue = function () {
-            this.removeSelectedBtn();
-            this.InputLabel = "Open Issue";
-            this.selectedBtn = "oi-btn";
-            this.addSelectBtn();
-            console.log("open issue selected");
+        ProcessorDetailsFormComponent.prototype.setupLCUSPAForm = function () {
+            var _a;
+            this.ProcessorDetailsFormGroup.addControl('spaRoot', this.formBldr.control(((_a = this.EditingApplication.LowCodeUnit) === null || _a === void 0 ? void 0 : _a.SPARoot) || '', [forms.Validators.required]));
         };
-        GhControlComponent.prototype.CreatePullRequest = function () {
-            this.removeSelectedBtn();
-            this.InputLabel = "Create Pull Request";
-            this.selectedBtn = "pr-btn";
-            this.addSelectBtn();
-            console.log("create pull request selected");
+        ProcessorDetailsFormComponent.prototype.setupLCUAPIForm = function () {
+            var _a, _b, _c, _d;
+            this.ProcessorDetailsFormGroup.addControl('methods', this.formBldr.control(((_b = (_a = this.EditingApplication.LookupConfig) === null || _a === void 0 ? void 0 : _a.AllowedMethods) === null || _b === void 0 ? void 0 : _b.join(' ')) || '', []));
+            this.ProcessorDetailsFormGroup.addControl('apiRoot', this.formBldr.control(((_c = this.EditingApplication.LowCodeUnit) === null || _c === void 0 ? void 0 : _c.APIRoot) || '', [forms.Validators.required]));
+            this.ProcessorDetailsFormGroup.addControl('security', this.formBldr.control(((_d = this.EditingApplication.LowCodeUnit) === null || _d === void 0 ? void 0 : _d.Security) || '', [forms.Validators.required]));
         };
-        GhControlComponent.prototype.OpenMoreInfo = function () {
-            console.log("more info selected");
+        ProcessorDetailsFormComponent.prototype.setupLCUGitHubOAuthForm = function () {
+            var _a, _b;
+            this.ProcessorDetailsFormGroup.addControl('clientId', this.formBldr.control(((_a = this.EditingApplication.LowCodeUnit) === null || _a === void 0 ? void 0 : _a.ClientID) || '', [forms.Validators.required]));
+            this.ProcessorDetailsFormGroup.addControl('clientSecret', this.formBldr.control(((_b = this.EditingApplication.LowCodeUnit) === null || _b === void 0 ? void 0 : _b.ClientSecret) || '', [forms.Validators.required]));
         };
-        GhControlComponent.prototype.Submit = function () {
-            console.log("submitting: ", this.value);
-            switch (this.selectedBtn) {
-                case "pr-btn":
-                    //Pull request
-                    console.log("creating pull request: ", this.value);
-                    break;
-                case "oi-btn":
-                    //Open Issue
-                    console.log("Open issue: ", this.value);
-                    break;
-                case "fb-btn":
-                    //Feature Branch
-                    console.log("creating feature branch: ", this.value);
-                    break;
-                default:
-                    console.log("hmm");
-                    break;
-            }
+        ProcessorDetailsFormComponent.prototype.setupProxyForm = function () {
+            var _a, _b;
+            this.LCUType = ((_a = this.EditingApplication.LowCodeUnit) === null || _a === void 0 ? void 0 : _a.Type) || '';
+            this.ProcessorDetailsFormGroup.addControl('inboundPath', this.formBldr.control(((_b = this.EditingApplication.Processor) === null || _b === void 0 ? void 0 : _b.InboundPath) || '', [forms.Validators.required]));
+            this.ProcessorDetailsFormGroup.addControl('lcuType', this.formBldr.control(this.LCUType, [forms.Validators.required]));
         };
-        //HELPERS
-        GhControlComponent.prototype.addSelectBtn = function () {
-            document.getElementById(this.selectedBtn).classList.add('selected');
+        ProcessorDetailsFormComponent.prototype.setupRedirectForm = function () {
+            var _a, _b, _c;
+            this.ProcessorDetailsFormGroup.addControl('redirect', this.formBldr.control(((_a = this.EditingApplication.Processor) === null || _a === void 0 ? void 0 : _a.Redirect) || '', [
+                forms.Validators.required,
+            ]));
+            this.ProcessorDetailsFormGroup.addControl('permanent', this.formBldr.control(((_b = this.EditingApplication.Processor) === null || _b === void 0 ? void 0 : _b.Permanent) || false, []));
+            this.ProcessorDetailsFormGroup.addControl('preserveMethod', this.formBldr.control(((_c = this.EditingApplication.Processor) === null || _c === void 0 ? void 0 : _c.PreserveMethod) || false, []));
+            this.DetermineTooltipText();
         };
-        GhControlComponent.prototype.removeSelectedBtn = function () {
-            document.getElementById(this.selectedBtn).classList.remove('selected');
+        ProcessorDetailsFormComponent.prototype.setupOAuthForm = function () {
+            var _a, _b, _c, _d;
+            this.LCUType = ((_a = this.EditingApplication.LowCodeUnit) === null || _a === void 0 ? void 0 : _a.Type) || '';
+            this.ProcessorDetailsFormGroup.addControl('scopes', this.formBldr.control(((_c = (_b = this.EditingApplication.Processor) === null || _b === void 0 ? void 0 : _b.Scopes) === null || _c === void 0 ? void 0 : _c.Join(' ')) || '', [forms.Validators.required]));
+            this.ProcessorDetailsFormGroup.addControl('tokenLookup', this.formBldr.control(((_d = this.EditingApplication.Processor) === null || _d === void 0 ? void 0 : _d.TokenLookup) || '', [forms.Validators.required]));
+            this.ProcessorDetailsFormGroup.addControl('lcuType', this.formBldr.control(this.LCUType, [forms.Validators.required]));
         };
-        return GhControlComponent;
+        ProcessorDetailsFormComponent.prototype.setupLCUZipForm = function () {
+            var _a;
+            this.ProcessorDetailsFormGroup.addControl('zipFile', this.formBldr.control(((_a = this.EditingApplication.LowCodeUnit) === null || _a === void 0 ? void 0 : _a.ZipFile) || '', [forms.Validators.required]));
+        };
+        ProcessorDetailsFormComponent.prototype.setupDfsForm = function () {
+            var _a, _b;
+            this.LCUType = ((_a = this.EditingApplication.LowCodeUnit) === null || _a === void 0 ? void 0 : _a.Type) || '';
+            this.ProcessorDetailsFormGroup.addControl('defaultFile', this.formBldr.control(((_b = this.EditingApplication.Processor) === null || _b === void 0 ? void 0 : _b.DefaultFile) || 'index.html', [forms.Validators.required]));
+            this.ProcessorDetailsFormGroup.addControl('lcuType', this.formBldr.control(this.LCUType, [forms.Validators.required]));
+        };
+        ProcessorDetailsFormComponent.prototype.setupProcessorTypeSubForm = function () {
+            this.cleanupProcessorTypeSubForm();
+            if (this.ProcessorType) {
+                switch (this.ProcessorType) {
+                    case 'DFS':
+                        this.setupDfsForm();
+                        break;
+                    case 'OAuth':
+                        this.setupOAuthForm();
+                        break;
+                    case 'Proxy':
+                        this.setupProxyForm();
+                        break;
+                    case 'Redirect':
+                        this.setupRedirectForm();
+                        break;
+                }
+            }
+            this.setupLcuTypeSubForm();
+        };
+        return ProcessorDetailsFormComponent;
     }());
-    GhControlComponent.decorators = [
+    ProcessorDetailsFormComponent.decorators = [
         { type: i0.Component, args: [{
-                    selector: 'lcu-gh-control',
-                    template: "<mat-card class=\"social-card\">\n    <div class=\"gh-card-container\" fxLayout=\"row\" fxLayoutAlign=\"center center\">\n        <mat-icon fxFlex=\"15%\" class=\"gh-icon\">error_outline</mat-icon>\n        <div fxFlex=\"70%\"class=\"gh-card-main-content\">\n            <mat-form-field appearance=\"fill\" class=\"gh-input\">\n                <mat-label>{{InputLabel}}</mat-label>\n                <input matInput type=\"text\" [(ngModel)]=\"value\">\n                <!-- <button *ngIf=\"value\" matSuffix mat-icon-button aria-label=\"Clear\" (click)=\"value=''\">\n                  <mat-icon>close</mat-icon>\n                </button> -->\n              </mat-form-field>\n        </div>\n        <button fxFlex=\"15%\" mat-button (click)=\"Submit()\" id=\"submit-btn\">Submit</button>\n    </div>\n\n    <mat-card-actions fxLayout=\"row\" fxLayoutAlign=\"space-around center\">\n        <button mat-button (click)=\"CreatePullRequest()\" id=\"pr-btn\">Pull Request</button>\n        <button mat-button (click)=\"OpenIssue()\" id=\"oi-btn\">Open Issue</button>\n        <button mat-button (click)=\"CreateFeatureBranch()\" id=\"fb-btn\">Feature Branch</button>\n        <button mat-icon-button (click)=\"OpenMoreInfo()\">\n            <mat-icon>more_horiz</mat-icon>\n        </button>\n    </mat-card-actions>\n  </mat-card>",
-                    styles: [".social-card{background-color:#fff;border:2px solid #d3d3d3;margin:20px;padding:15px 5px}mat-card-actions{margin-bottom:-1px!important;margin-left:0!important;margin-right:-.5px!important}.main-slot-container{padding:10px}.slot-header{align-items:center}.slot-content{width:100%}.slot-name{font-size:22px;font-weight:600;padding-left:5px}.slot-description{font-size:12px;margin-right:10px}.slot-action-anchor{color:#000;font-size:10px;text-decoration:none}.action-icon{font-size:25px;height:25px;width:25px}.gold-icon{color:#d4af37}.upgrade-text{cursor:pointer;font-weight:700;margin-left:10px}.gh-icon{font-size:60px;height:60px;text-align:center;width:60px}.gh-input{width:90%}.selected{border:1px solid green}::ng-deep .mat-form-field-flex{border:1px solid;border-radius:30px!important}::ng-deep .mat-form-field-wrapper{padding-bottom:0!important}"]
+                    selector: 'lcu-processor-details-form',
+                    template: "<form class=\"processor-details-form\" [formGroup]=\"ProcessorDetailsFormGroup\" (ngSubmit)=\"SubmitProcessorDetails()\">\n<mat-card class=\"spread flow-card\">\n    <mat-card-header>\n      <mat-card-title> Processor Details </mat-card-title>\n    </mat-card-header>\n\n    <mat-card-content>\n      <mat-form-field class=\"mat-full-width\">\n        <mat-select\n          placeholder=\"Type\"\n          formControlName=\"procType\"\n          (selectionChange)=\"ProcessorTypeChanged($event)\"\n          required\n        >\n          <mat-option value=\"DFS\">View Package</mat-option>\n\n          <mat-option value=\"Redirect\">Redirect</mat-option>\n\n          <mat-option value=\"Proxy\">Proxy</mat-option>\n\n          <mat-option value=\"OAuth\">OAuth</mat-option>\n        </mat-select>\n      </mat-form-field>\n\n      <div [ngSwitch]=\"ProcessorType\">\n        <div *ngSwitchCase=\"'DFS'\">\n          <mat-form-field class=\"mat-full-width\">\n            <input\n              matInput\n              placeholder=\"Default File\"\n              formControlName=\"defaultFile\"\n              required\n            />\n          </mat-form-field>\n\n          <mat-form-field class=\"mat-full-width\">\n            <mat-select\n              placeholder=\"Type\"\n              formControlName=\"lcuType\"\n              (selectionChange)=\"LCUTypeChanged($event)\"\n              required\n            >\n              <mat-option value=\"NPM\">NPM</mat-option>\n\n              <mat-option value=\"GitHub\">GitHub</mat-option>\n\n              <!-- <mat-option value=\"Zip\">Zip</mat-option> -->\n            </mat-select>\n          </mat-form-field>\n\n          <div [ngSwitch]=\"LCUType\">\n            <div *ngSwitchCase=\"'GitHub'\">\n              <lcu-source-control-form-controls\n                [build-path]=\"EditingApplication?.LowCodeUnit?.Path\"\n                [form-group]=\"ProcessorDetailsFormGroup\"\n                [source-control]=\"DefaultSourceControl\"\n                [use-branches]=\"false\"\n                [use-build-path]=\"true\"\n              ></lcu-source-control-form-controls>\n\n              <mat-form-field\n                class=\"mat-full-width\"\n                *ngIf=\"\n                  SourceControlFormControls?.RepositoryFormControl?.valid\n                \"\n              >\n                <input\n                  matInput\n                  placeholder=\"Build\"\n                  formControlName=\"build\"\n                  required\n                />\n\n                <mat-hint>\n                  Current Build:\n                  {{ EditingApplication?.LowCodeUnit?.CurrentBuild }}\n                </mat-hint>\n              </mat-form-field>\n            </div>\n\n            <div *ngSwitchCase=\"'NPM'\">\n              <lcu-npm-package-select\n                [npm-package]=\"EditingApplication?.LowCodeUnit?.Package\"\n                [npm-package-version]=\"\n                  EditingApplication?.LowCodeUnit?.Version\n                \"\n                [form-group]=\"ProcessorDetailsFormGroup\"\n              ></lcu-npm-package-select>\n\n              <mat-hint>\n                Current Version:\n                {{ EditingApplication?.LowCodeUnit?.CurrentVersion }}\n              </mat-hint>\n            </div>\n          </div>\n        </div>\n\n        <div *ngSwitchCase=\"'OAuth'\">\n          <mat-form-field class=\"mat-full-width\">\n            <input\n              matInput\n              placeholder=\"Scopes (space separated)\"\n              formControlName=\"scopes\"\n              required\n            />\n          </mat-form-field>\n\n          <mat-form-field class=\"mat-full-width\">\n            <input\n              matInput\n              placeholder=\"Token Lookup\"\n              formControlName=\"tokenLookup\"\n              required\n            />\n          </mat-form-field>\n\n          <mat-form-field class=\"mat-full-width\">\n            <mat-select\n              placeholder=\"Type\"\n              formControlName=\"lcuType\"\n              (selectionChange)=\"LCUTypeChanged($event)\"\n              required\n            >\n              <mat-option value=\"GitHubOAuth\">GitHub</mat-option>\n            </mat-select>\n          </mat-form-field>\n\n          <div [ngSwitch]=\"LCUType\">\n            <div *ngSwitchCase=\"'GitHubOAuth'\">\n              <mat-form-field class=\"mat-full-width\">\n                <input\n                  matInput\n                  placeholder=\"Client ID\"\n                  formControlName=\"clientId\"\n                  required\n                />\n              </mat-form-field>\n\n              <mat-form-field class=\"mat-full-width\">\n                <input\n                  matInput\n                  placeholder=\"Client Secret\"\n                  formControlName=\"clientSecret\"\n                  required\n                />\n              </mat-form-field>\n            </div>\n          </div>\n        </div>\n\n        <div *ngSwitchCase=\"'Proxy'\">\n          <mat-form-field class=\"mat-full-width\">\n            <input\n              matInput\n              placeholder=\"Inbound Path\"\n              formControlName=\"inboundPath\"\n              required\n            />\n          </mat-form-field>\n\n          <mat-form-field class=\"mat-full-width\">\n            <mat-select\n              placeholder=\"Type\"\n              formControlName=\"lcuType\"\n              (selectionChange)=\"LCUTypeChanged($event)\"\n              required\n            >\n              <mat-option value=\"API\">API</mat-option>\n\n              <mat-option value=\"SPA\">Single Page Application</mat-option>\n            </mat-select>\n          </mat-form-field>\n\n          <div [ngSwitch]=\"LCUType\">\n            <div *ngSwitchCase=\"'API'\">\n              <mat-form-field class=\"mat-full-width\">\n                <input\n                  matInput\n                  placeholder=\"API Root\"\n                  formControlName=\"apiRoot\"\n                  required\n                />\n              </mat-form-field>\n\n              <mat-form-field class=\"mat-full-width\">\n                <input\n                  matInput\n                  placeholder=\"Allowed Methods (separate with spaces)\"\n                  formControlName=\"methods\"\n                />\n              </mat-form-field>\n\n              <mat-form-field class=\"mat-full-width\">\n                <input\n                  matInput\n                  placeholder=\"Security ({header}~{value})\"\n                  formControlName=\"security\"\n                  required\n                />\n              </mat-form-field>\n            </div>\n\n            <div *ngSwitchCase=\"'SPA'\">\n              <mat-form-field class=\"mat-full-width\">\n                <input\n                  matInput\n                  placeholder=\"SPA Root\"\n                  formControlName=\"spaRoot\"\n                  required\n                />\n              </mat-form-field>\n            </div>\n          </div>\n        </div>\n\n        <div *ngSwitchCase=\"'Redirect'\">\n          <mat-form-field class=\"mat-full-width\">\n            <input\n              matInput\n              placeholder=\"Redirect URL\"\n              formControlName=\"redirect\"\n              required\n            />\n          </mat-form-field>\n\n          <div>\n            <mat-slide-toggle \n              class=\"spread\" \n              formControlName=\"permanent\">\n              Is Permanent?\n            </mat-slide-toggle>\n\n            <mat-slide-toggle\n              class=\"spread\"\n              formControlName=\"preserveMethod\"\n            >\n              Preserve Method?\n            </mat-slide-toggle>\n\n            <mat-icon\n              class=\"spread\"\n              matSuffix\n              (mouseenter)=\"DetermineTooltipText()\"\n              matTooltip={{redirectTooltip}}\n            >\n              info_outline\n            </mat-icon>\n\n            <!-- <mat-icon\n            *ngIf=\"!IsPermanent && !IsPreserve\"\n\n              class=\"spread\"\n              matSuffix\n              matTooltip=\"302 \u2013 Not Permanent and Not Preserve\"\n            >\n              info_outline\n            </mat-icon> -->\n\n            <!-- <mat-icon\n            *ngIf=\"!IsPermanent && IsPreserve\"\n              class=\"spread\"\n              matSuffix\n              matTooltip=\"307 \u2013 Not Permanent and Preserve\"\n            >\n              info_outline\n            </mat-icon> -->\n\n            <!-- <mat-icon\n            *ngIf=\"IsPermanent && IsPreserve\"\n              class=\"spread\"\n              matSuffix\n              matTooltip=\"308 \u2013 Permanent and Preserve\"\n            >\n              info_outline\n            </mat-icon> -->\n\n            \n\n            <!-- <mat-icon\n              class=\"spread\"\n              matSuffix\n              matTooltip=\"Values used to control the redirect type.  Permanent and Not Preserve = 301; Not Permanent and Not Preserve = 302; Permanent and Preserve = 308; Not Permanent and Not Preserve = 307;\"\n            >\n              info_outline\n            </mat-icon> -->\n          </div>\n        </div>\n      </div>\n    </mat-card-content>\n    <mat-card-actions>\n        <!-- [disabled]=\"!SecurityFormGroup.valid || !SecurityFormGroup.dirty\" -->\n        <button mat-raised-button type=\"submit\" >Save Security Settings</button>\n    </mat-card-actions>\n</mat-card>\n</form>\n  \n",
+                    styles: [""]
                 },] }
     ];
-    GhControlComponent.ctorParameters = function () { return []; };
+    ProcessorDetailsFormComponent.ctorParameters = function () { return [
+        { type: forms.FormBuilder }
+    ]; };
+    ProcessorDetailsFormComponent.propDecorators = {
+        EditingApplication: [{ type: i0.Input, args: ['editing-application',] }]
+    };
 
-    var MainFeedCardComponent = /** @class */ (function () {
-        function MainFeedCardComponent() {
+    var SourceControlFormComponent = /** @class */ (function () {
+        function SourceControlFormComponent(formBldr) {
+            this.formBldr = formBldr;
         }
-        MainFeedCardComponent.prototype.ngOnInit = function () {
+        Object.defineProperty(SourceControlFormComponent.prototype, "HasBuildFormControl", {
+            get: function () {
+                var _a;
+                return (_a = this.SourceControlFormGroup) === null || _a === void 0 ? void 0 : _a.controls.hasBuild;
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(SourceControlFormComponent.prototype, "SourceControlLookupFormControl", {
+            get: function () {
+                var _a;
+                return (_a = this.SourceControlFormGroup) === null || _a === void 0 ? void 0 : _a.controls.sourceControlLookup;
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(SourceControlFormComponent.prototype, "SourceControlLookups", {
+            get: function () {
+                return Object.keys(this.SourceControls || {});
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(SourceControlFormComponent.prototype, "SourceControls", {
+            get: function () {
+                console.log("Environment: ", this.Environment);
+                return this.Environment.Sources || {};
+            },
+            enumerable: false,
+            configurable: true
+        });
+        SourceControlFormComponent.prototype.ngOnInit = function () {
+            this.setupSourceControlForm();
         };
-        MainFeedCardComponent.prototype.MoreClicked = function () {
-            console.log("More clicked");
+        SourceControlFormComponent.prototype.SourceControlLookupChanged = function (event) {
+            //  TODO:  Anything to do here on change?
+            console.log("sourceControlLookupChanged: ", event);
         };
-        return MainFeedCardComponent;
+        SourceControlFormComponent.prototype.SubmitSourceControl = function () {
+        };
+        //HELPER
+        SourceControlFormComponent.prototype.setupSourceControlForm = function () {
+            var _a, _b;
+            this.ProcessorType = ((_b = (_a = this.EditingApplication) === null || _a === void 0 ? void 0 : _a.Processor) === null || _b === void 0 ? void 0 : _b.Type) || '';
+            this.setupBuildForm();
+        };
+        SourceControlFormComponent.prototype.setupBuildForm = function () {
+            var _a, _b;
+            this.SourceControlFormGroup.addControl('hasBuild', this.formBldr.control(!!((_a = this.EditingApplication.LowCodeUnit) === null || _a === void 0 ? void 0 : _a.SourceControlLookup) || false, [forms.Validators.required]));
+            this.SourceControlFormGroup.addControl('sourceControlLookup', this.formBldr.control(((_b = this.EditingApplication.LowCodeUnit) === null || _b === void 0 ? void 0 : _b.SourceControlLookup) || '', []));
+        };
+        return SourceControlFormComponent;
     }());
-    MainFeedCardComponent.decorators = [
+    SourceControlFormComponent.decorators = [
         { type: i0.Component, args: [{
-                    selector: 'lcu-main-feed-card',
-                    template: "<mat-card class=\"social-card\">\n    <mat-card-header fxLayout=\"row\">\n        <div *ngIf=\"Avatar\" mat-card-avatar class=\"example-header-image\" [style.backgroundImage]=\"Avatar\" fxFlex=\"10%\"></div>\n        <div class=\"header-main-content-container\" fxFlex=\"80%\">\n            <mat-card-title *ngIf=\"Title\">{{Title}}</mat-card-title>\n            <div *ngIf=\"Subtext\">{{Subtext}}</div>\n            <div *ngIf=\"TimeAgo\">{{TimeAgo}}</div>\n        </div>\n        <div fxFlex=\"10%\">\n            <button mat-icon-button (click)=\"MoreClicked()\" >\n                <mat-icon>more_horiz</mat-icon>\n            </button>\n        </div>\n\n      </mat-card-header>\n    \n    <div class=\"feed-card-container\" fxLayout=\"row\">\n        <div class=\"feed-card-main-content\">\n            <ng-content select=\"[tabs]\"></ng-content>\n        </div>\n    </div>\n\n    <mat-card-actions fxLayout=\"row\" fxLayoutAlign=\"space-around center\">\n      <ng-content select=\"[actions]\"></ng-content>\n        \n\n    </mat-card-actions>\n  </mat-card>\n",
-                    styles: [".social-card{background-color:#fff;border:2px solid #d3d3d3;margin:20px;padding:15px 5px}mat-card-actions{margin-bottom:-1px!important;margin-left:0!important;margin-right:-.5px!important}.main-slot-container{padding:10px}.slot-header{align-items:center}.slot-content{width:100%}.slot-name{font-size:22px;font-weight:600;padding-left:5px}.slot-description{font-size:12px;margin-right:10px}.slot-action-anchor{color:#000;font-size:10px;text-decoration:none}.action-icon{font-size:25px;height:25px;width:25px}.gold-icon{color:#d4af37}.upgrade-text{cursor:pointer;font-weight:700;margin-left:10px}.example-header-image{background-size:cover}"]
+                    selector: 'lcu-source-control-form',
+                    template: "<form class=\"source-control-form\" [formGroup]=\"SourceControlFormGroup\" (ngSubmit)=\"SubmitSourceControl()\">\n\n<mat-card class=\"spread flow-card\" *ngIf=\"ProcessorType != 'Redirect'\">\n    <mat-card-header>\n      <mat-card-title *ngIf=\"!HasBuildFormControl.value\">\n        Build & Source\n      </mat-card-title>\n\n      <mat-card-title *ngIf=\"HasBuildFormControl.value\">\n        Source Control\n      </mat-card-title>\n\n      <div fxFlex></div>\n\n      <mat-slide-toggle\n        formControlName=\"hasBuild\"\n        matTooltip=\"Has Build?\"\n      >\n      </mat-slide-toggle>\n\n      <mat-icon\n        matSuffix\n        matTooltip=\"Configure source control, DevOps CI/CD, and artifacts.\"\n      >\n        info_outline\n      </mat-icon>\n    </mat-card-header>\n\n    <mat-card-content>\n      <mat-form-field\n        class=\"mat-full-width\"\n        *ngIf=\"\n          HasBuildFormControl.value && SourceControlLookups?.length > 0\n        \"\n      >\n        <mat-select\n          formControlName=\"sourceControlLookup\"\n          placeholder=\"Source Control\"\n          (selectionChange)=\"SourceControlLookupChanged($event)\"\n          [disabled]=\"\n            SourceControlFormControls?.Loading || HostingDetails?.Loading\n          \"\n        >\n          <ng-container\n            *ngFor=\"let srcCtrlLookup of SourceControlLookups\"\n          >\n            <mat-option\n              [value]=\"srcCtrlLookup\"\n              *ngIf=\"SourceControls[srcCtrlLookup]; let srcCtrl\"\n            >\n              {{ srcCtrl.Name }}\n            </mat-option>\n          </ng-container>\n        </mat-select>\n\n        <div *ngIf=\"HasBuildFormControl?.value\">\n          <h3>\n            @{{\n              SourceControlFormControls?.OrganizationFormControl?.value ||\n                SourceControl?.Organization\n            }}/{{\n              SourceControlFormControls?.RepositoryFormControl?.value ||\n                SourceControl?.Repository\n            }}\n          </h3>\n\n          <p>Organization and Repository pulled from build settings</p>\n\n          <mat-hint>\n            CurrentBuild:\n            {{ EditingApplication?.LowCodeUnit?.CurrentBuild }}\n          </mat-hint>\n        </div>\n      </mat-form-field>\n\n      <div *ngIf=\"SourceControlLookups?.length < 0\">\n        <h3>\n          Create source control locations under the DevOps tab above.\n        </h3>\n      </div>\n    </mat-card-content>\n    <mat-card-actions>\n        <!-- [disabled]=\"!SourceControlFormGroup.valid || !SourceControlFormGroup.dirty\" -->\n        <button mat-raised-button type=\"submit\" >Save</button>\n    </mat-card-actions>\n  </mat-card>\n</form>\n",
+                    styles: [""]
                 },] }
     ];
-    MainFeedCardComponent.ctorParameters = function () { return []; };
-    MainFeedCardComponent.propDecorators = {
-        Avatar: [{ type: i0.Input, args: ['avatar',] }],
-        Title: [{ type: i0.Input, args: ['title',] }],
-        Subtext: [{ type: i0.Input, args: ['subtext',] }],
-        TimeAgo: [{ type: i0.Input, args: ['time-ago',] }]
+    SourceControlFormComponent.ctorParameters = function () { return [
+        { type: forms.FormBuilder }
+    ]; };
+    SourceControlFormComponent.propDecorators = {
+        EditingApplication: [{ type: i0.Input, args: ['editing-application',] }],
+        Environment: [{ type: i0.Input, args: ['environment',] }],
+        SourceControlFormControls: [{ type: i0.ViewChild, args: [SourceControlFormControlsComponent,] }]
     };
 
-    var TwoColumnHeaderComponent = /** @class */ (function () {
-        function TwoColumnHeaderComponent() {
+    var BuildPipelineFormComponent = /** @class */ (function () {
+        function BuildPipelineFormComponent() {
         }
-        TwoColumnHeaderComponent.prototype.ngOnInit = function () {
+        BuildPipelineFormComponent.prototype.ngOnInit = function () {
         };
-        return TwoColumnHeaderComponent;
+        return BuildPipelineFormComponent;
     }());
-    TwoColumnHeaderComponent.decorators = [
+    BuildPipelineFormComponent.decorators = [
         { type: i0.Component, args: [{
-                    selector: 'lcu-two-column-header',
-                    template: "<div class=\"col-container\" fxLayout=\"row\">\n\n    <div class=\"col-left\"  fxFlex=\"15%\" >\n        <ng-content select=\"[left]\"></ng-content>\n    </div>\n\n    <div class=\"col-center\" fxFlex=\"85%\">\n        <ng-content></ng-content>\n    </div>\n\n</div>\n",
-                    styles: [".col-container{background-color:#ebecf0}.col-left{min-width:210px}"]
+                    selector: 'lcu-build-pipeline-form',
+                    template: "<p>build-pipeline-form works!</p>\n",
+                    styles: [""]
                 },] }
     ];
-    TwoColumnHeaderComponent.ctorParameters = function () { return []; };
+    BuildPipelineFormComponent.ctorParameters = function () { return []; };
 
-    var CardCarouselComponent = /** @class */ (function () {
-        function CardCarouselComponent() {
-            this.carouselIndex = 0;
+    var DevopsSourceControlFormComponent = /** @class */ (function () {
+        function DevopsSourceControlFormComponent() {
         }
-        CardCarouselComponent.prototype.ngOnInit = function () {
-        };
-        CardCarouselComponent.prototype.ngAfterViewInit = function () {
-            this.assignCarouselClass();
-        };
-        CardCarouselComponent.prototype.LeftChevronClicked = function () {
-            this.removeCarouselClasses();
-            if (this.carouselIndex === 0) {
-                this.carouselIndex = this.Stats.length - 1;
-            }
-            else {
-                this.carouselIndex--;
-            }
-            this.assignCarouselClass();
-        };
-        CardCarouselComponent.prototype.MoreDetailsClicked = function () {
-            console.log("More details clicked on carousel item", this.Stats[this.carouselIndex]);
-        };
-        CardCarouselComponent.prototype.RightChevronClicked = function () {
-            this.removeCarouselClasses();
-            if (this.carouselIndex === this.Stats.length - 1) {
-                this.carouselIndex = 0;
-            }
-            else {
-                this.carouselIndex++;
-            }
-            this.assignCarouselClass();
-        };
-        //HELPERS
-        CardCarouselComponent.prototype.removeCarouselClasses = function () {
-            for (var i = 0; i < this.Stats.length; i++) {
-                if (i === this.carouselIndex) {
-                    document.getElementById("carousel-" + this.carouselIndex).classList.remove('active');
-                }
-                else {
-                    document.getElementById("carousel-" + i).classList.remove('hidden');
-                }
-            }
-        };
-        CardCarouselComponent.prototype.assignCarouselClass = function () {
-            for (var i = 0; i < this.Stats.length; i++) {
-                if (i === this.carouselIndex) {
-                    document.getElementById("carousel-" + this.carouselIndex).classList.add('active');
-                }
-                else {
-                    document.getElementById("carousel-" + i).classList.add('hidden');
-                }
-            }
+        DevopsSourceControlFormComponent.prototype.ngOnInit = function () {
         };
-        return CardCarouselComponent;
+        return DevopsSourceControlFormComponent;
     }());
-    CardCarouselComponent.decorators = [
+    DevopsSourceControlFormComponent.decorators = [
         { type: i0.Component, args: [{
-                    selector: 'lcu-card-carousel',
-                    template: "<div stats class=\"carousel-container\">\n    <div class=\"chevron-container\" fxLayout=\"row\">\n        <button mat-icon-button class=\"chevron-button\" id=\"left-chevron\" (click)=\"LeftChevronClicked()\">\n            <mat-icon>chevron_left</mat-icon>\n        </button>\n        <button mat-icon-button class=\"chevron-button\" id=\"right-chevron\" (click)=\"RightChevronClicked()\">\n            <mat-icon>chevron_right</mat-icon>\n        </button>\n    </div>\n    <ng-container *ngFor=\"let stat of Stats; let i = index\">\n            <div class=\"carousel-item\" [id]=\"'carousel-'+i\">\n                <div class=\"carousel-title\">{{stat.Name}}</div>\n                <div class=\"carousel-stat\">{{stat.Stat}}</div>\n            </div>\n    </ng-container>\n    <div (click)=\"MoreDetailsClicked()\">More details</div>\n</div>\n",
-                    styles: [".carousel-container{height:75px;padding-top:20px;text-align:center}.carousel-item.hidden{display:none}.carousel-item.active{visibility:visible}.chevron-button{position:absolute}#right-chevron{right:5px}#left-chevron{left:5px}"]
+                    selector: 'lcu-devops-source-control-form',
+                    template: "<p>devops-source-control-form works!</p>\n",
+                    styles: [""]
                 },] }
     ];
-    CardCarouselComponent.ctorParameters = function () { return []; };
-    CardCarouselComponent.propDecorators = {
-        Stats: [{ type: i0.Input, args: ['stats',] }]
-    };
+    DevopsSourceControlFormComponent.ctorParameters = function () { return []; };
 
     var ApplicationsFlowModule = /** @class */ (function () {
         function ApplicationsFlowModule() {
@@ -5009,6 +5557,7 @@
                     NPMService,
                     FormsService,
                     ApplicationsFlowEventsService,
+                    EaCService
                 ],
             };
         };
@@ -5048,7 +5597,12 @@
                         GhControlComponent,
                         MainFeedCardComponent,
                         TwoColumnHeaderComponent,
-                        CardCarouselComponent
+                        CardCarouselComponent,
+                        SecurityToggleComponent,
+                        ProcessorDetailsFormComponent,
+                        SourceControlFormComponent,
+                        BuildPipelineFormComponent,
+                        DevopsSourceControlFormComponent
                     ],
                     imports: [
                         i2.FathymSharedModule,
@@ -5057,6 +5611,9 @@
                         flexLayout.FlexLayoutModule,
                         i2.MaterialModule,
                         appHostCommon.AppHostModule,
+                        tooltip.MatTooltipModule,
+                        slideToggle.MatSlideToggleModule
+                        // LazyElementModule,
                     ],
                     exports: [
                         ApplicationsFlowProjectsElementComponent,
@@ -5090,7 +5647,12 @@
                         GhControlComponent,
                         MainFeedCardComponent,
                         TwoColumnHeaderComponent,
-                        CardCarouselComponent
+                        CardCarouselComponent,
+                        SecurityToggleComponent,
+                        ProcessorDetailsFormComponent,
+                        SourceControlFormComponent,
+                        BuildPipelineFormComponent,
+                        DevopsSourceControlFormComponent
                     ],
                     entryComponents: [
                         ApplicationsFlowProjectsElementComponent,
@@ -5122,7 +5684,12 @@
                         GhControlComponent,
                         MainFeedCardComponent,
                         TwoColumnHeaderComponent,
-                        CardCarouselComponent
+                        CardCarouselComponent,
+                        SecurityToggleComponent,
+                        ProcessorDetailsFormComponent,
+                        SourceControlFormComponent,
+                        BuildPipelineFormComponent,
+                        DevopsSourceControlFormComponent
                     ],
                 },] }
     ];
@@ -5183,6 +5750,7 @@
     exports.DevSettingsPresetModel = DevSettingsPresetModel;
     exports.DomainModel = DomainModel;
     exports.DynamicTabsModel = DynamicTabsModel;
+    exports.EaCService = EaCService;
     exports.FormActionsModel = FormActionsModel;
     exports.FormModel = FormModel;
     exports.FormValuesModel = FormValuesModel;
@@ -5208,6 +5776,10 @@
     exports.UnpackLowCodeUnitRequest = UnpackLowCodeUnitRequest;
     exports.ɵa = ApplicationsFlowEventsService;
     exports.ɵb = DynamicTabsComponent;
+    exports.ɵba = ProcessorDetailsFormComponent;
+    exports.ɵbb = SourceControlFormComponent;
+    exports.ɵbc = BuildPipelineFormComponent;
+    exports.ɵbd = DevopsSourceControlFormComponent;
     exports.ɵc = HeaderComponent;
     exports.ɵd = ProjectTabsComponent;
     exports.ɵe = GeneralComponent;
@@ -5231,6 +5803,7 @@
     exports.ɵw = MainFeedCardComponent;
     exports.ɵx = TwoColumnHeaderComponent;
     exports.ɵy = CardCarouselComponent;
+    exports.ɵz = SecurityToggleComponent;
 
     Object.defineProperty(exports, '__esModule', { value: true });