@lowcodeunit/applications-flow-common 1.33.274-lets-get-social-ish → 1.33.275-lets-get-social-ish

package/fesm2020/lowcodeunit-applications-flow-common.mjs

@@ -4173,10 +4173,10 @@ class DevopsSourceControlFormComponent {
     }
 }
 DevopsSourceControlFormComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.2", ngImport: i0, type: DevopsSourceControlFormComponent, deps: [{ token: ApplicationsFlowService }, { token: EaCService }, { token: i1$1.FormBuilder }], target: i0.ɵɵFactoryTarget.Component });
-DevopsSourceControlFormComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.2", type: DevopsSourceControlFormComponent, selector: "lcu-devops-source-control-form", inputs: { EditingSourceControlLookup: ["editing-source-control-lookup", "EditingSourceControlLookup"], Environment: ["environment", "Environment"], EnvironmentLookup: ["environment-lookup", "EnvironmentLookup"] }, outputs: { SaveStatusEvent: "save-status-event" }, viewQueries: [{ propertyName: "BranchesInput", first: true, predicate: ["branches"], descendants: true }], ngImport: i0, template: "<form class=\"form-card\" [formGroup]=\"DevOpsSourceControlFormGroup\" (ngSubmit)=\"SubmitSourceControl()\">\n\n  <mat-card class=\"spread\" class=\"sc-card\">\n    <mat-card-header>\n      <mat-card-title> Source Control </mat-card-title>\n\n      <div fxFlex></div>\n\n      <mat-icon matSuffix matTooltip=\"Configure source control, DevOps CI/CD, and artifacts.\">\n        info_outline\n      </mat-icon>\n    </mat-card-header>\n\n    <mat-card-content>\n      <div class=\"card\">\n        <mat-form-field class=\"mat-full-width\">\n          <mat-select \n            formControlName=\"devOpsActionLookup\" \n            placeholder=\"DevOps Action\"\n            [disabled]=\"HostingDetails?.Loading\" \n            (selectionChange)=\"DevOpsActionLookupChanged($event)\"\n          >\n            <ng-container *ngFor=\"let devOpsActionLookup of DevOpsActionLookups\">\n              <mat-option \n                [value]=\"devOpsActionLookup\" \n                *ngIf=\"DevOpsActions[devOpsActionLookup]; let devOpsAction\">\n                {{ devOpsAction.Name }}\n              </mat-option>\n            </ng-container>\n\n            <mat-option value=\"\">-- Create New --</mat-option>\n          </mat-select>\n        </mat-form-field>\n      </div>\n      <div class=\"card\" *ngIf=\"OrganizationFormControl?.valid || !Loading\">\n        <mat-form-field \n          class=\"mat-full-width with-hint margin-bottom\" \n          *ngIf=\"OrganizationOptions?.length > 0\"\n        >\n          <mat-icon class=\"org-icon\" matPrefix>corporate_fare</mat-icon>\n\n          <mat-select \n            [formControlName]=\"SourceControlRoot + 'organization'\" \n            placeholder=\"Organization\"\n            (selectionChange)=\"OrganizationChanged($event)\" \n            [disabled]=\"Loading || HostingDetails?.Loading\" \n            required\n          >\n            <ng-container *ngFor=\"let orgOpt of OrganizationOptions\">\n              <mat-option [value]=\"orgOpt.Name\">\n                {{ orgOpt.Name }}\n              </mat-option>\n            </ng-container>\n          </mat-select>\n\n          <mat-icon matSuffix (click)=\"RefreshOrganizations()\" matTooltip=\"Refresh Organization\" color=\"accent\"> refresh </mat-icon>\n\n          <a matSuffix href=\"/.oauth/github?oauth-force-edit=true\" target=\"_blank\" color=\"accent\">\n            <mat-icon color=\"accent\" matTooltip=\"Re-authorize Organizations\"> launch </mat-icon>\n          </a>\n\n          <mat-hint>\n            If you don't have an organization or would like to create a new one,\n            <a href=\"https://github.com/account/organizations/new\" class=\"primary-link\" target=\"_blank\">\n              start here\n            </a>\n          </mat-hint>\n        </mat-form-field>\n      </div>\n\n      <div class=\"card\" *ngIf=\"\n                RepositoryFormControl?.valid ||\n                (OrganizationFormControl?.valid && !Loading)\n              \">\n        <mat-form-field class=\"mat-full-width\">\n          <mat-icon class=\"org-icon\" matPrefix>description</mat-icon>\n\n          <mat-select [formControlName]=\"SourceControlRoot + 'repository'\" [placeholder]=\"\n                    OrganizationFormControl?.valid\n                      ? 'Repository'\n                      : 'Repository (select organization first)'\n                  \" [disabled]=\"\n                    !OrganizationFormControl?.valid || Loading || HostingDetails?.Loading\n                  \" (selectionChange)=\"RepositoryChanged($event)\" *ngIf=\"!CreatingRepository\" required>\n            <ng-container *ngFor=\"let repoOpt of RepositoryOptions\">\n              <mat-option [value]=\"repoOpt.Name\">\n                {{ repoOpt.Name }}\n              </mat-option>\n            </ng-container>\n          </mat-select>\n\n          <input matInput placeholder=\"Repository (creates new if does not exist)\"\n            [formControlName]=\"SourceControlRoot + 'repository'\" *ngIf=\"CreatingRepository\"\n            [fxHide]=\"Loading || HostingDetails?.Loading\" required />\n\n          <mat-icon matSuffix (click)=\"CreateRepository()\" [fxHide]=\"Loading || HostingDetails?.Loading\"\n            *ngIf=\"!CreatingRepository && OrganizationFormControl?.valid\">\n            add_circle\n          </mat-icon>\n\n          <button mat-button type=\"button\" (click)=\"SaveRepository()\"\n            *ngIf=\"CreatingRepository && RepositoryFormControl?.valid\">\n\n            <mat-icon matSuffix color=\"primary\">\n              save\n            </mat-icon>\n          </button>\n\n          <button mat-button type=\"button\" (click)=\"CancelCreateRepository()\" *ngIf=\"CreatingRepository\">\n\n            <mat-icon matSuffix>\n              cancel\n            </mat-icon>\n          </button>\n        </mat-form-field>\n      </div>\n\n      <div class=\"card\" *ngIf=\"\n                (BranchesFormControl?.valid ||\n                  (OrganizationFormControl?.valid &&\n                    RepositoryFormControl?.valid &&\n                    !Loading)) &&\n                !CreatingRepository &&\n                UseBranches\n              \">\n        <mat-form-field class=\"mat-full-width\">\n          <mat-icon class=\"org-icon\" matPrefix>account_tree</mat-icon>\n\n          <mat-label>Selected Branches</mat-label>\n\n          <mat-autocomplete (optionSelected)=\"BranchOptionSelected($event)\" #branchOptions=\"matAutocomplete\">\n            <ng-container *ngFor=\"let branchOpt of BranchOptions\">\n              <mat-option [value]=\"branchOpt.Name\">\n                {{ branchOpt.Name }}\n              </mat-option>\n            </ng-container>\n          </mat-autocomplete>\n\n          <mat-chip-list #selectedBranches>\n            <mat-chip [removable]=\"true\" (removed)=\"RemoveBranchOption(selBranch)\"\n              *ngFor=\"let selBranch of SelectedBranches\">\n              {{ selBranch }}\n              <mat-icon matChipRemove>cancel</mat-icon>\n            </mat-chip>\n\n            <input matInput placeholder=\"New Branch...\" [formControlName]=\"SourceControlRoot + 'branches'\" #branches\n              [matAutocomplete]=\"branchOptions\" [matChipInputFor]=\"selectedBranches\"\n              [matChipInputSeparatorKeyCodes]=\"SeparatorKeysCodes\" [matChipInputAddOnBlur]=\"true\"\n              (matChipInputTokenEnd)=\"AddBranchOption($event)\" [disabled]=\"Loading || HostingDetails?.Loading\"\n              required />\n          </mat-chip-list>\n        </mat-form-field>\n\n        <mat-form-field class=\"mat-full-width with-hint\" [fxShow]=\"SelectedBranches?.length > 1\">\n          <mat-icon class=\"org-icon\" matPrefix>account_tree</mat-icon>\n\n          <mat-select [formControlName]=\"SourceControlRoot + 'mainBranch'\" placeholder=\"Main Branch\"\n            [disabled]=\"Loading || HostingDetails?.Loading\" (selectionChange)=\"MainBranchChanged($event)\" required>\n            <ng-container *ngFor=\"let branch of SelectedBranches\">\n              <mat-option [value]=\"branch\">\n                {{ branch }}\n              </mat-option>\n            </ng-container>\n          </mat-select>\n\n          <mat-icon matSuffix (click)=\"RefreshOrganizations()\" color=\"accent\"> refresh </mat-icon>\n\n          <a matSuffix mat-icon-button href=\"/.oauth/github?oauth-force-edit=true\" target=\"_blank\" color=\"accent\">\n            <mat-icon matTooltip=\"Re-authorize Organizations\" color=\"accent\"> launch </mat-icon>\n          </a>\n\n          <mat-hint>\n            If you don't have an organization or would like to create a new one,\n            <a href=\"https://github.com/account/organizations/new\" target=\"_blank\"class=\"primary-link\">\n              start here\n            </a>\n          </mat-hint>\n        </mat-form-field>\n      </div>\n\n      <div class=\"card\" *ngIf=\"\n                (BuildPathFormControl?.valid ||\n                  (OrganizationFormControl?.valid &&\n                    RepositoryFormControl?.valid &&\n                    !Loading)) &&\n                !CreatingRepository &&\n                UseBuildPath\n              \">\n        <mat-form-field class=\"mat-full-width with-hint\">\n          <mat-icon class=\"org-icon\" matPrefix>build</mat-icon>\n\n          <mat-select [formControlName]=\"SourceControlRoot + 'buildPath'\" placeholder=\"Build Path\"\n            [disabled]=\"Loading || BuildPathDisabled\" (selectionChange)=\"BuildPathChanged($event)\" required>\n            <ng-container *ngFor=\"let buildPath of BuildPathOptions\">\n              <mat-option [value]=\"buildPath\">\n                {{ buildPath }}\n              </mat-option>\n            </ng-container>\n          </mat-select>\n\n          <mat-hint>\n            The build path identifies which build action to use for your\n            configuration.\n          </mat-hint>\n        </mat-form-field>\n      </div>\n\n      <div *ngIf=\"Loading\">\n        <div class=\"spread\">\n          <lcu-loader style=\"margin: auto\" [loading]=\"true\"></lcu-loader>\n\n          <div class=\"margin-3\">\n            <h4 class=\"mat-title\" *ngIf=\"!OrganizationFormControl?.valid\">\n              Loading organizations\n            </h4>\n\n            <h4 class=\"mat-title\" *ngIf=\"\n                      OrganizationFormControl?.valid && !RepositoryFormControl?.valid\n                    \">\n              Loading repositories\n            </h4>\n\n            <h4 class=\"mat-title\" *ngIf=\"RepositoryFormControl?.valid && !BranchesFormControl?.valid\">\n              Loading branches\n            </h4>\n\n            <h4 class=\"mat-title\" *ngIf=\"\n                      (RepositoryFormControl?.valid || BranchesFormControl?.valid) &&\n                      !BuildPathFormControl?.valid\n                    \">\n              Loading build paths\n            </h4>\n          </div>\n        </div>\n      </div>\n      <!-- </div> -->\n\n    </mat-card-content>\n    <mat-card-actions fxLayoutAlign=\"center center\">\n\n      <button \n        mat-raised-button \n        *ngIf=\"!State?.Loading\"\n        type=\"submit\" \n        fxFlex=\"100%\" \n        color=\"primary\" \n        [disabled]=\"!DevOpsSourceControlFormGroup.valid || !DevOpsSourceControlFormGroup.dirty\">\n        <mat-icon>save</mat-icon>\n        Save Source Control\n      </button>\n      <lcu-loader [loading]=\"State?.Loading\"></lcu-loader>\n      \n  </mat-card-actions>\n  </mat-card>\n</form>", styles: [".form-card,.sc-card{width:100%}.margin-bottom{margin-bottom:15px}.primary-link{color:#4a918e}\n"], components: [{ type: i4.MatCard, selector: "mat-card", exportAs: ["matCard"] }, { type: i4.MatCardHeader, selector: "mat-card-header" }, { type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i4$3.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { type: i8.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { type: i9$1.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { type: i4$1.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { type: i8$1.MatAutocomplete, selector: "mat-autocomplete", inputs: ["disableRipple"], exportAs: ["matAutocomplete"] }, { type: i9$2.MatChipList, selector: "mat-chip-list", inputs: ["errorStateMatcher", "multiple", "compareWith", "value", "required", "placeholder", "disabled", "aria-orientation", "selectable", "tabIndex"], outputs: ["change", "valueChange"], exportAs: ["matChipList"] }, { type: i4$1.MatAnchor, selector: "a[mat-button], a[mat-raised-button], a[mat-icon-button], a[mat-fab],             a[mat-mini-fab], a[mat-stroked-button], a[mat-flat-button]", inputs: ["disabled", "disableRipple", "color", "tabIndex"], exportAs: ["matButton", "matAnchor"] }, { type: i3.LoaderComponent, selector: "lcu-loader", inputs: ["diameter", "hide-inner", "loading"] }], directives: [{ type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i4.MatCardTitle, selector: "mat-card-title, [mat-card-title], [matCardTitle]" }, { type: i5$1.DefaultFlexDirective, selector: "  [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md],  [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md],  [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm],  [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { type: i4$3.MatSuffix, selector: "[matSuffix]" }, { type: i12.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { type: i4.MatCardContent, selector: "mat-card-content, [mat-card-content], [matCardContent]" }, { type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { type: i4$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i4$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4$3.MatPrefix, selector: "[matPrefix]" }, { type: i1$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i4$3.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { type: i11.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i9.DefaultShowHideDirective, selector: "  [fxShow], [fxShow.print],  [fxShow.xs], [fxShow.sm], [fxShow.md], [fxShow.lg], [fxShow.xl],  [fxShow.lt-sm], [fxShow.lt-md], [fxShow.lt-lg], [fxShow.lt-xl],  [fxShow.gt-xs], [fxShow.gt-sm], [fxShow.gt-md], [fxShow.gt-lg],  [fxHide], [fxHide.print],  [fxHide.xs], [fxHide.sm], [fxHide.md], [fxHide.lg], [fxHide.xl],  [fxHide.lt-sm], [fxHide.lt-md], [fxHide.lt-lg], [fxHide.lt-xl],  [fxHide.gt-xs], [fxHide.gt-sm], [fxHide.gt-md], [fxHide.gt-lg]", inputs: ["fxShow", "fxShow.print", "fxShow.xs", "fxShow.sm", "fxShow.md", "fxShow.lg", "fxShow.xl", "fxShow.lt-sm", "fxShow.lt-md", "fxShow.lt-lg", "fxShow.lt-xl", "fxShow.gt-xs", "fxShow.gt-sm", "fxShow.gt-md", "fxShow.gt-lg", "fxHide", "fxHide.print", "fxHide.xs", "fxHide.sm", "fxHide.md", "fxHide.lg", "fxHide.xl", "fxHide.lt-sm", "fxHide.lt-md", "fxHide.lt-lg", "fxHide.lt-xl", "fxHide.gt-xs", "fxHide.gt-sm", "fxHide.gt-md", "fxHide.gt-lg"] }, { type: i4$3.MatLabel, selector: "mat-label" }, { type: i9$2.MatChip, selector: "mat-basic-chip, [mat-basic-chip], mat-chip, [mat-chip]", inputs: ["color", "disableRipple", "tabIndex", "selected", "value", "selectable", "disabled", "removable"], outputs: ["selectionChange", "destroyed", "removed"], exportAs: ["matChip"] }, { type: i9$2.MatChipRemove, selector: "[matChipRemove]" }, { type: i8$1.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", exportAs: ["matAutocompleteTrigger"] }, { type: i9$2.MatChipInput, selector: "input[matChipInputFor]", inputs: ["matChipInputFor", "matChipInputAddOnBlur", "matChipInputSeparatorKeyCodes", "placeholder", "id", "disabled"], outputs: ["matChipInputTokenEnd"], exportAs: ["matChipInput", "matChipInputFor"] }, { type: i4.MatCardActions, selector: "mat-card-actions", inputs: ["align"], exportAs: ["matCardActions"] }, { type: i5$1.DefaultLayoutAlignDirective, selector: "  [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md],  [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md],  [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm],  [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }] });
+DevopsSourceControlFormComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.2", type: DevopsSourceControlFormComponent, selector: "lcu-devops-source-control-form", inputs: { EditingSourceControlLookup: ["editing-source-control-lookup", "EditingSourceControlLookup"], Environment: ["environment", "Environment"], EnvironmentLookup: ["environment-lookup", "EnvironmentLookup"] }, outputs: { SaveStatusEvent: "save-status-event" }, viewQueries: [{ propertyName: "BranchesInput", first: true, predicate: ["branches"], descendants: true }], ngImport: i0, template: "<form \n  class=\"form-card\" \n  [formGroup]=\"DevOpsSourceControlFormGroup\" \n  (ngSubmit)=\"SubmitSourceControl()\"\n>\n\n  <mat-card class=\"spread\" class=\"sc-card\">\n    <mat-card-header>\n      <mat-card-title> Source Control </mat-card-title>\n\n      <div fxFlex></div>\n\n      <mat-icon matSuffix matTooltip=\"Configure source control, DevOps CI/CD, and artifacts.\">\n        info_outline\n      </mat-icon>\n    </mat-card-header>\n\n    <mat-card-content>\n\n      <ng-container *ngIf=\"State?.Loading\">\n\n        <skeleton-block \n          class=\"s-block\"\n          effect=\"wave\" \n        ></skeleton-block>\n\n        <skeleton-block \n          class=\"s-block\"\n          effect=\"wave\" \n        ></skeleton-block>\n\n        <skeleton-block \n          class=\"s-block\"\n          effect=\"wave\" \n        ></skeleton-block>\n\n        <skeleton-block \n          class=\"s-block\"\n          effect=\"wave\" \n        ></skeleton-block>\n\n      </ng-container>\n\n      <ng-container *ngIf=\"!State?.Loading\">\n\n        <div class=\"card\">\n\n          <mat-form-field class=\"mat-full-width\">\n            <mat-select \n              formControlName=\"devOpsActionLookup\" \n              placeholder=\"DevOps Action\"\n              [disabled]=\"HostingDetails?.Loading\" \n              (selectionChange)=\"DevOpsActionLookupChanged($event)\"\n            >\n              <ng-container *ngFor=\"let devOpsActionLookup of DevOpsActionLookups\">\n                <mat-option \n                  [value]=\"devOpsActionLookup\" \n                  *ngIf=\"DevOpsActions[devOpsActionLookup]; let devOpsAction\">\n                  {{ devOpsAction.Name }}\n                </mat-option>\n              </ng-container>\n\n              <mat-option value=\"\">-- Create New --</mat-option>\n            </mat-select>\n          </mat-form-field>\n        </div>\n        <div class=\"card\" *ngIf=\"OrganizationFormControl?.valid || !Loading\">\n          <mat-form-field \n            class=\"mat-full-width with-hint margin-bottom\" \n            *ngIf=\"OrganizationOptions?.length > 0\"\n          >\n            <mat-icon class=\"org-icon\" matPrefix>corporate_fare</mat-icon>\n\n            <mat-select \n              [formControlName]=\"SourceControlRoot + 'organization'\" \n              placeholder=\"Organization\"\n              (selectionChange)=\"OrganizationChanged($event)\" \n              [disabled]=\"Loading || HostingDetails?.Loading\" \n              required\n            >\n              <ng-container *ngFor=\"let orgOpt of OrganizationOptions\">\n                <mat-option [value]=\"orgOpt.Name\">\n                  {{ orgOpt.Name }}\n                </mat-option>\n              </ng-container>\n            </mat-select>\n\n            <mat-icon matSuffix (click)=\"RefreshOrganizations()\" matTooltip=\"Refresh Organization\" color=\"accent\"> refresh </mat-icon>\n\n            <a matSuffix href=\"/.oauth/github?oauth-force-edit=true\" target=\"_blank\" color=\"accent\">\n              <mat-icon color=\"accent\" matTooltip=\"Re-authorize Organizations\"> launch </mat-icon>\n            </a>\n\n            <mat-hint>\n              If you don't have an organization or would like to create a new one,\n              <a href=\"https://github.com/account/organizations/new\" class=\"primary-link\" target=\"_blank\">\n                start here\n              </a>\n            </mat-hint>\n          </mat-form-field>\n        </div>\n\n        <div class=\"card\" *ngIf=\"\n                  RepositoryFormControl?.valid ||\n                  (OrganizationFormControl?.valid && !Loading)\n                \">\n          <mat-form-field class=\"mat-full-width\">\n            <mat-icon class=\"org-icon\" matPrefix>description</mat-icon>\n\n            <mat-select [formControlName]=\"SourceControlRoot + 'repository'\" [placeholder]=\"\n                      OrganizationFormControl?.valid\n                        ? 'Repository'\n                        : 'Repository (select organization first)'\n                    \" [disabled]=\"\n                      !OrganizationFormControl?.valid || Loading || HostingDetails?.Loading\n                    \" (selectionChange)=\"RepositoryChanged($event)\" *ngIf=\"!CreatingRepository\" required>\n              <ng-container *ngFor=\"let repoOpt of RepositoryOptions\">\n                <mat-option [value]=\"repoOpt.Name\">\n                  {{ repoOpt.Name }}\n                </mat-option>\n              </ng-container>\n            </mat-select>\n\n            <input matInput placeholder=\"Repository (creates new if does not exist)\"\n              [formControlName]=\"SourceControlRoot + 'repository'\" *ngIf=\"CreatingRepository\"\n              [fxHide]=\"Loading || HostingDetails?.Loading\" required />\n\n            <mat-icon matSuffix (click)=\"CreateRepository()\" [fxHide]=\"Loading || HostingDetails?.Loading\"\n              *ngIf=\"!CreatingRepository && OrganizationFormControl?.valid\">\n              add_circle\n            </mat-icon>\n\n            <button mat-button type=\"button\" (click)=\"SaveRepository()\"\n              *ngIf=\"CreatingRepository && RepositoryFormControl?.valid\">\n\n              <mat-icon matSuffix color=\"primary\">\n                save\n              </mat-icon>\n            </button>\n\n            <button mat-button type=\"button\" (click)=\"CancelCreateRepository()\" *ngIf=\"CreatingRepository\">\n\n              <mat-icon matSuffix>\n                cancel\n              </mat-icon>\n            </button>\n          </mat-form-field>\n        </div>\n\n        <div class=\"card\" *ngIf=\"\n                  (BranchesFormControl?.valid ||\n                    (OrganizationFormControl?.valid &&\n                      RepositoryFormControl?.valid &&\n                      !Loading)) &&\n                  !CreatingRepository &&\n                  UseBranches\n                \">\n          <mat-form-field class=\"mat-full-width\">\n            <mat-icon class=\"org-icon\" matPrefix>account_tree</mat-icon>\n\n            <mat-label>Selected Branches</mat-label>\n\n            <mat-autocomplete (optionSelected)=\"BranchOptionSelected($event)\" #branchOptions=\"matAutocomplete\">\n              <ng-container *ngFor=\"let branchOpt of BranchOptions\">\n                <mat-option [value]=\"branchOpt.Name\">\n                  {{ branchOpt.Name }}\n                </mat-option>\n              </ng-container>\n            </mat-autocomplete>\n\n            <mat-chip-list #selectedBranches>\n              <mat-chip [removable]=\"true\" (removed)=\"RemoveBranchOption(selBranch)\"\n                *ngFor=\"let selBranch of SelectedBranches\">\n                {{ selBranch }}\n                <mat-icon matChipRemove>cancel</mat-icon>\n              </mat-chip>\n\n              <input matInput placeholder=\"New Branch...\" [formControlName]=\"SourceControlRoot + 'branches'\" #branches\n                [matAutocomplete]=\"branchOptions\" [matChipInputFor]=\"selectedBranches\"\n                [matChipInputSeparatorKeyCodes]=\"SeparatorKeysCodes\" [matChipInputAddOnBlur]=\"true\"\n                (matChipInputTokenEnd)=\"AddBranchOption($event)\" [disabled]=\"Loading || HostingDetails?.Loading\"\n                required />\n            </mat-chip-list>\n          </mat-form-field>\n\n          <mat-form-field class=\"mat-full-width with-hint\" [fxShow]=\"SelectedBranches?.length > 1\">\n            <mat-icon class=\"org-icon\" matPrefix>account_tree</mat-icon>\n\n            <mat-select [formControlName]=\"SourceControlRoot + 'mainBranch'\" placeholder=\"Main Branch\"\n              [disabled]=\"Loading || HostingDetails?.Loading\" (selectionChange)=\"MainBranchChanged($event)\" required>\n              <ng-container *ngFor=\"let branch of SelectedBranches\">\n                <mat-option [value]=\"branch\">\n                  {{ branch }}\n                </mat-option>\n              </ng-container>\n            </mat-select>\n\n            <mat-icon matSuffix (click)=\"RefreshOrganizations()\" color=\"accent\"> refresh </mat-icon>\n\n            <a matSuffix mat-icon-button href=\"/.oauth/github?oauth-force-edit=true\" target=\"_blank\" color=\"accent\">\n              <mat-icon matTooltip=\"Re-authorize Organizations\" color=\"accent\"> launch </mat-icon>\n            </a>\n\n            <mat-hint>\n              If you don't have an organization or would like to create a new one,\n              <a href=\"https://github.com/account/organizations/new\" target=\"_blank\"class=\"primary-link\">\n                start here\n              </a>\n            </mat-hint>\n          </mat-form-field>\n        </div>\n\n        <div class=\"card\" *ngIf=\"\n                  (BuildPathFormControl?.valid ||\n                    (OrganizationFormControl?.valid &&\n                      RepositoryFormControl?.valid &&\n                      !Loading)) &&\n                  !CreatingRepository &&\n                  UseBuildPath\n                \">\n          <mat-form-field class=\"mat-full-width with-hint\">\n            <mat-icon class=\"org-icon\" matPrefix>build</mat-icon>\n\n            <mat-select [formControlName]=\"SourceControlRoot + 'buildPath'\" placeholder=\"Build Path\"\n              [disabled]=\"Loading || BuildPathDisabled\" (selectionChange)=\"BuildPathChanged($event)\" required>\n              <ng-container *ngFor=\"let buildPath of BuildPathOptions\">\n                <mat-option [value]=\"buildPath\">\n                  {{ buildPath }}\n                </mat-option>\n              </ng-container>\n            </mat-select>\n\n            <mat-hint>\n              The build path identifies which build action to use for your\n              configuration.\n            </mat-hint>\n          </mat-form-field>\n        </div>\n\n        <div *ngIf=\"Loading\">\n          <div class=\"spread\">\n            <lcu-loader style=\"margin: auto\" [loading]=\"true\"></lcu-loader>\n\n            <div class=\"margin-3\">\n              <h4 class=\"mat-title\" *ngIf=\"!OrganizationFormControl?.valid\">\n                Loading organizations\n              </h4>\n\n              <h4 class=\"mat-title\" *ngIf=\"\n                        OrganizationFormControl?.valid && !RepositoryFormControl?.valid\n                      \">\n                Loading repositories\n              </h4>\n\n              <h4 class=\"mat-title\" *ngIf=\"RepositoryFormControl?.valid && !BranchesFormControl?.valid\">\n                Loading branches\n              </h4>\n\n              <h4 class=\"mat-title\" *ngIf=\"\n                        (RepositoryFormControl?.valid || BranchesFormControl?.valid) &&\n                        !BuildPathFormControl?.valid\n                      \">\n                Loading build paths\n              </h4>\n            </div>\n          </div>\n        </div>\n      </ng-container>\n      <!-- </div> -->\n\n    </mat-card-content>\n    <mat-card-actions fxLayoutAlign=\"center center\">\n\n      <button \n        mat-raised-button \n        *ngIf=\"!State?.Loading\"\n        type=\"submit\" \n        fxFlex=\"100%\" \n        color=\"primary\" \n        [disabled]=\"!DevOpsSourceControlFormGroup.valid || !DevOpsSourceControlFormGroup.dirty\">\n        <mat-icon>save</mat-icon>\n        Save Source Control\n      </button>\n      <lcu-loader [loading]=\"State?.Loading\"></lcu-loader>\n      \n  </mat-card-actions>\n  </mat-card>\n</form>", styles: [".form-card,.sc-card{width:100%}.margin-bottom{margin-bottom:15px}.primary-link{color:#4a918e}.s-block{margin:10px 0;width:100%;height:40px}\n"], components: [{ type: i4.MatCard, selector: "mat-card", exportAs: ["matCard"] }, { type: i4.MatCardHeader, selector: "mat-card-header" }, { type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i4$5.SkeletonBlockComponent, selector: "skeleton-block", inputs: ["width", "height", "effect", "borderRadius"] }, { type: i4$3.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { type: i8.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { type: i9$1.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { type: i4$1.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { type: i8$1.MatAutocomplete, selector: "mat-autocomplete", inputs: ["disableRipple"], exportAs: ["matAutocomplete"] }, { type: i9$2.MatChipList, selector: "mat-chip-list", inputs: ["errorStateMatcher", "multiple", "compareWith", "value", "required", "placeholder", "disabled", "aria-orientation", "selectable", "tabIndex"], outputs: ["change", "valueChange"], exportAs: ["matChipList"] }, { type: i4$1.MatAnchor, selector: "a[mat-button], a[mat-raised-button], a[mat-icon-button], a[mat-fab],             a[mat-mini-fab], a[mat-stroked-button], a[mat-flat-button]", inputs: ["disabled", "disableRipple", "color", "tabIndex"], exportAs: ["matButton", "matAnchor"] }, { type: i3.LoaderComponent, selector: "lcu-loader", inputs: ["diameter", "hide-inner", "loading"] }], directives: [{ type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i4.MatCardTitle, selector: "mat-card-title, [mat-card-title], [matCardTitle]" }, { type: i5$1.DefaultFlexDirective, selector: "  [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md],  [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md],  [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm],  [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { type: i4$3.MatSuffix, selector: "[matSuffix]" }, { type: i12.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { type: i4.MatCardContent, selector: "mat-card-content, [mat-card-content], [matCardContent]" }, { type: i4$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { type: i4$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i4$3.MatPrefix, selector: "[matPrefix]" }, { type: i1$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i4$3.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { type: i11.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i9.DefaultShowHideDirective, selector: "  [fxShow], [fxShow.print],  [fxShow.xs], [fxShow.sm], [fxShow.md], [fxShow.lg], [fxShow.xl],  [fxShow.lt-sm], [fxShow.lt-md], [fxShow.lt-lg], [fxShow.lt-xl],  [fxShow.gt-xs], [fxShow.gt-sm], [fxShow.gt-md], [fxShow.gt-lg],  [fxHide], [fxHide.print],  [fxHide.xs], [fxHide.sm], [fxHide.md], [fxHide.lg], [fxHide.xl],  [fxHide.lt-sm], [fxHide.lt-md], [fxHide.lt-lg], [fxHide.lt-xl],  [fxHide.gt-xs], [fxHide.gt-sm], [fxHide.gt-md], [fxHide.gt-lg]", inputs: ["fxShow", "fxShow.print", "fxShow.xs", "fxShow.sm", "fxShow.md", "fxShow.lg", "fxShow.xl", "fxShow.lt-sm", "fxShow.lt-md", "fxShow.lt-lg", "fxShow.lt-xl", "fxShow.gt-xs", "fxShow.gt-sm", "fxShow.gt-md", "fxShow.gt-lg", "fxHide", "fxHide.print", "fxHide.xs", "fxHide.sm", "fxHide.md", "fxHide.lg", "fxHide.xl", "fxHide.lt-sm", "fxHide.lt-md", "fxHide.lt-lg", "fxHide.lt-xl", "fxHide.gt-xs", "fxHide.gt-sm", "fxHide.gt-md", "fxHide.gt-lg"] }, { type: i4$3.MatLabel, selector: "mat-label" }, { type: i9$2.MatChip, selector: "mat-basic-chip, [mat-basic-chip], mat-chip, [mat-chip]", inputs: ["color", "disableRipple", "tabIndex", "selected", "value", "selectable", "disabled", "removable"], outputs: ["selectionChange", "destroyed", "removed"], exportAs: ["matChip"] }, { type: i9$2.MatChipRemove, selector: "[matChipRemove]" }, { type: i8$1.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", exportAs: ["matAutocompleteTrigger"] }, { type: i9$2.MatChipInput, selector: "input[matChipInputFor]", inputs: ["matChipInputFor", "matChipInputAddOnBlur", "matChipInputSeparatorKeyCodes", "placeholder", "id", "disabled"], outputs: ["matChipInputTokenEnd"], exportAs: ["matChipInput", "matChipInputFor"] }, { type: i4.MatCardActions, selector: "mat-card-actions", inputs: ["align"], exportAs: ["matCardActions"] }, { type: i5$1.DefaultLayoutAlignDirective, selector: "  [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md],  [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md],  [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm],  [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.2", ngImport: i0, type: DevopsSourceControlFormComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'lcu-devops-source-control-form', template: "<form class=\"form-card\" [formGroup]=\"DevOpsSourceControlFormGroup\" (ngSubmit)=\"SubmitSourceControl()\">\n\n  <mat-card class=\"spread\" class=\"sc-card\">\n    <mat-card-header>\n      <mat-card-title> Source Control </mat-card-title>\n\n      <div fxFlex></div>\n\n      <mat-icon matSuffix matTooltip=\"Configure source control, DevOps CI/CD, and artifacts.\">\n        info_outline\n      </mat-icon>\n    </mat-card-header>\n\n    <mat-card-content>\n      <div class=\"card\">\n        <mat-form-field class=\"mat-full-width\">\n          <mat-select \n            formControlName=\"devOpsActionLookup\" \n            placeholder=\"DevOps Action\"\n            [disabled]=\"HostingDetails?.Loading\" \n            (selectionChange)=\"DevOpsActionLookupChanged($event)\"\n          >\n            <ng-container *ngFor=\"let devOpsActionLookup of DevOpsActionLookups\">\n              <mat-option \n                [value]=\"devOpsActionLookup\" \n                *ngIf=\"DevOpsActions[devOpsActionLookup]; let devOpsAction\">\n                {{ devOpsAction.Name }}\n              </mat-option>\n            </ng-container>\n\n            <mat-option value=\"\">-- Create New --</mat-option>\n          </mat-select>\n        </mat-form-field>\n      </div>\n      <div class=\"card\" *ngIf=\"OrganizationFormControl?.valid || !Loading\">\n        <mat-form-field \n          class=\"mat-full-width with-hint margin-bottom\" \n          *ngIf=\"OrganizationOptions?.length > 0\"\n        >\n          <mat-icon class=\"org-icon\" matPrefix>corporate_fare</mat-icon>\n\n          <mat-select \n            [formControlName]=\"SourceControlRoot + 'organization'\" \n            placeholder=\"Organization\"\n            (selectionChange)=\"OrganizationChanged($event)\" \n            [disabled]=\"Loading || HostingDetails?.Loading\" \n            required\n          >\n            <ng-container *ngFor=\"let orgOpt of OrganizationOptions\">\n              <mat-option [value]=\"orgOpt.Name\">\n                {{ orgOpt.Name }}\n              </mat-option>\n            </ng-container>\n          </mat-select>\n\n          <mat-icon matSuffix (click)=\"RefreshOrganizations()\" matTooltip=\"Refresh Organization\" color=\"accent\"> refresh </mat-icon>\n\n          <a matSuffix href=\"/.oauth/github?oauth-force-edit=true\" target=\"_blank\" color=\"accent\">\n            <mat-icon color=\"accent\" matTooltip=\"Re-authorize Organizations\"> launch </mat-icon>\n          </a>\n\n          <mat-hint>\n            If you don't have an organization or would like to create a new one,\n            <a href=\"https://github.com/account/organizations/new\" class=\"primary-link\" target=\"_blank\">\n              start here\n            </a>\n          </mat-hint>\n        </mat-form-field>\n      </div>\n\n      <div class=\"card\" *ngIf=\"\n                RepositoryFormControl?.valid ||\n                (OrganizationFormControl?.valid && !Loading)\n              \">\n        <mat-form-field class=\"mat-full-width\">\n          <mat-icon class=\"org-icon\" matPrefix>description</mat-icon>\n\n          <mat-select [formControlName]=\"SourceControlRoot + 'repository'\" [placeholder]=\"\n                    OrganizationFormControl?.valid\n                      ? 'Repository'\n                      : 'Repository (select organization first)'\n                  \" [disabled]=\"\n                    !OrganizationFormControl?.valid || Loading || HostingDetails?.Loading\n                  \" (selectionChange)=\"RepositoryChanged($event)\" *ngIf=\"!CreatingRepository\" required>\n            <ng-container *ngFor=\"let repoOpt of RepositoryOptions\">\n              <mat-option [value]=\"repoOpt.Name\">\n                {{ repoOpt.Name }}\n              </mat-option>\n            </ng-container>\n          </mat-select>\n\n          <input matInput placeholder=\"Repository (creates new if does not exist)\"\n            [formControlName]=\"SourceControlRoot + 'repository'\" *ngIf=\"CreatingRepository\"\n            [fxHide]=\"Loading || HostingDetails?.Loading\" required />\n\n          <mat-icon matSuffix (click)=\"CreateRepository()\" [fxHide]=\"Loading || HostingDetails?.Loading\"\n            *ngIf=\"!CreatingRepository && OrganizationFormControl?.valid\">\n            add_circle\n          </mat-icon>\n\n          <button mat-button type=\"button\" (click)=\"SaveRepository()\"\n            *ngIf=\"CreatingRepository && RepositoryFormControl?.valid\">\n\n            <mat-icon matSuffix color=\"primary\">\n              save\n            </mat-icon>\n          </button>\n\n          <button mat-button type=\"button\" (click)=\"CancelCreateRepository()\" *ngIf=\"CreatingRepository\">\n\n            <mat-icon matSuffix>\n              cancel\n            </mat-icon>\n          </button>\n        </mat-form-field>\n      </div>\n\n      <div class=\"card\" *ngIf=\"\n                (BranchesFormControl?.valid ||\n                  (OrganizationFormControl?.valid &&\n                    RepositoryFormControl?.valid &&\n                    !Loading)) &&\n                !CreatingRepository &&\n                UseBranches\n              \">\n        <mat-form-field class=\"mat-full-width\">\n          <mat-icon class=\"org-icon\" matPrefix>account_tree</mat-icon>\n\n          <mat-label>Selected Branches</mat-label>\n\n          <mat-autocomplete (optionSelected)=\"BranchOptionSelected($event)\" #branchOptions=\"matAutocomplete\">\n            <ng-container *ngFor=\"let branchOpt of BranchOptions\">\n              <mat-option [value]=\"branchOpt.Name\">\n                {{ branchOpt.Name }}\n              </mat-option>\n            </ng-container>\n          </mat-autocomplete>\n\n          <mat-chip-list #selectedBranches>\n            <mat-chip [removable]=\"true\" (removed)=\"RemoveBranchOption(selBranch)\"\n              *ngFor=\"let selBranch of SelectedBranches\">\n              {{ selBranch }}\n              <mat-icon matChipRemove>cancel</mat-icon>\n            </mat-chip>\n\n            <input matInput placeholder=\"New Branch...\" [formControlName]=\"SourceControlRoot + 'branches'\" #branches\n              [matAutocomplete]=\"branchOptions\" [matChipInputFor]=\"selectedBranches\"\n              [matChipInputSeparatorKeyCodes]=\"SeparatorKeysCodes\" [matChipInputAddOnBlur]=\"true\"\n              (matChipInputTokenEnd)=\"AddBranchOption($event)\" [disabled]=\"Loading || HostingDetails?.Loading\"\n              required />\n          </mat-chip-list>\n        </mat-form-field>\n\n        <mat-form-field class=\"mat-full-width with-hint\" [fxShow]=\"SelectedBranches?.length > 1\">\n          <mat-icon class=\"org-icon\" matPrefix>account_tree</mat-icon>\n\n          <mat-select [formControlName]=\"SourceControlRoot + 'mainBranch'\" placeholder=\"Main Branch\"\n            [disabled]=\"Loading || HostingDetails?.Loading\" (selectionChange)=\"MainBranchChanged($event)\" required>\n            <ng-container *ngFor=\"let branch of SelectedBranches\">\n              <mat-option [value]=\"branch\">\n                {{ branch }}\n              </mat-option>\n            </ng-container>\n          </mat-select>\n\n          <mat-icon matSuffix (click)=\"RefreshOrganizations()\" color=\"accent\"> refresh </mat-icon>\n\n          <a matSuffix mat-icon-button href=\"/.oauth/github?oauth-force-edit=true\" target=\"_blank\" color=\"accent\">\n            <mat-icon matTooltip=\"Re-authorize Organizations\" color=\"accent\"> launch </mat-icon>\n          </a>\n\n          <mat-hint>\n            If you don't have an organization or would like to create a new one,\n            <a href=\"https://github.com/account/organizations/new\" target=\"_blank\"class=\"primary-link\">\n              start here\n            </a>\n          </mat-hint>\n        </mat-form-field>\n      </div>\n\n      <div class=\"card\" *ngIf=\"\n                (BuildPathFormControl?.valid ||\n                  (OrganizationFormControl?.valid &&\n                    RepositoryFormControl?.valid &&\n                    !Loading)) &&\n                !CreatingRepository &&\n                UseBuildPath\n              \">\n        <mat-form-field class=\"mat-full-width with-hint\">\n          <mat-icon class=\"org-icon\" matPrefix>build</mat-icon>\n\n          <mat-select [formControlName]=\"SourceControlRoot + 'buildPath'\" placeholder=\"Build Path\"\n            [disabled]=\"Loading || BuildPathDisabled\" (selectionChange)=\"BuildPathChanged($event)\" required>\n            <ng-container *ngFor=\"let buildPath of BuildPathOptions\">\n              <mat-option [value]=\"buildPath\">\n                {{ buildPath }}\n              </mat-option>\n            </ng-container>\n          </mat-select>\n\n          <mat-hint>\n            The build path identifies which build action to use for your\n            configuration.\n          </mat-hint>\n        </mat-form-field>\n      </div>\n\n      <div *ngIf=\"Loading\">\n        <div class=\"spread\">\n          <lcu-loader style=\"margin: auto\" [loading]=\"true\"></lcu-loader>\n\n          <div class=\"margin-3\">\n            <h4 class=\"mat-title\" *ngIf=\"!OrganizationFormControl?.valid\">\n              Loading organizations\n            </h4>\n\n            <h4 class=\"mat-title\" *ngIf=\"\n                      OrganizationFormControl?.valid && !RepositoryFormControl?.valid\n                    \">\n              Loading repositories\n            </h4>\n\n            <h4 class=\"mat-title\" *ngIf=\"RepositoryFormControl?.valid && !BranchesFormControl?.valid\">\n              Loading branches\n            </h4>\n\n            <h4 class=\"mat-title\" *ngIf=\"\n                      (RepositoryFormControl?.valid || BranchesFormControl?.valid) &&\n                      !BuildPathFormControl?.valid\n                    \">\n              Loading build paths\n            </h4>\n          </div>\n        </div>\n      </div>\n      <!-- </div> -->\n\n    </mat-card-content>\n    <mat-card-actions fxLayoutAlign=\"center center\">\n\n      <button \n        mat-raised-button \n        *ngIf=\"!State?.Loading\"\n        type=\"submit\" \n        fxFlex=\"100%\" \n        color=\"primary\" \n        [disabled]=\"!DevOpsSourceControlFormGroup.valid || !DevOpsSourceControlFormGroup.dirty\">\n        <mat-icon>save</mat-icon>\n        Save Source Control\n      </button>\n      <lcu-loader [loading]=\"State?.Loading\"></lcu-loader>\n      \n  </mat-card-actions>\n  </mat-card>\n</form>", styles: [".form-card,.sc-card{width:100%}.margin-bottom{margin-bottom:15px}.primary-link{color:#4a918e}\n"] }]
+            args: [{ selector: 'lcu-devops-source-control-form', template: "<form \n  class=\"form-card\" \n  [formGroup]=\"DevOpsSourceControlFormGroup\" \n  (ngSubmit)=\"SubmitSourceControl()\"\n>\n\n  <mat-card class=\"spread\" class=\"sc-card\">\n    <mat-card-header>\n      <mat-card-title> Source Control </mat-card-title>\n\n      <div fxFlex></div>\n\n      <mat-icon matSuffix matTooltip=\"Configure source control, DevOps CI/CD, and artifacts.\">\n        info_outline\n      </mat-icon>\n    </mat-card-header>\n\n    <mat-card-content>\n\n      <ng-container *ngIf=\"State?.Loading\">\n\n        <skeleton-block \n          class=\"s-block\"\n          effect=\"wave\" \n        ></skeleton-block>\n\n        <skeleton-block \n          class=\"s-block\"\n          effect=\"wave\" \n        ></skeleton-block>\n\n        <skeleton-block \n          class=\"s-block\"\n          effect=\"wave\" \n        ></skeleton-block>\n\n        <skeleton-block \n          class=\"s-block\"\n          effect=\"wave\" \n        ></skeleton-block>\n\n      </ng-container>\n\n      <ng-container *ngIf=\"!State?.Loading\">\n\n        <div class=\"card\">\n\n          <mat-form-field class=\"mat-full-width\">\n            <mat-select \n              formControlName=\"devOpsActionLookup\" \n              placeholder=\"DevOps Action\"\n              [disabled]=\"HostingDetails?.Loading\" \n              (selectionChange)=\"DevOpsActionLookupChanged($event)\"\n            >\n              <ng-container *ngFor=\"let devOpsActionLookup of DevOpsActionLookups\">\n                <mat-option \n                  [value]=\"devOpsActionLookup\" \n                  *ngIf=\"DevOpsActions[devOpsActionLookup]; let devOpsAction\">\n                  {{ devOpsAction.Name }}\n                </mat-option>\n              </ng-container>\n\n              <mat-option value=\"\">-- Create New --</mat-option>\n            </mat-select>\n          </mat-form-field>\n        </div>\n        <div class=\"card\" *ngIf=\"OrganizationFormControl?.valid || !Loading\">\n          <mat-form-field \n            class=\"mat-full-width with-hint margin-bottom\" \n            *ngIf=\"OrganizationOptions?.length > 0\"\n          >\n            <mat-icon class=\"org-icon\" matPrefix>corporate_fare</mat-icon>\n\n            <mat-select \n              [formControlName]=\"SourceControlRoot + 'organization'\" \n              placeholder=\"Organization\"\n              (selectionChange)=\"OrganizationChanged($event)\" \n              [disabled]=\"Loading || HostingDetails?.Loading\" \n              required\n            >\n              <ng-container *ngFor=\"let orgOpt of OrganizationOptions\">\n                <mat-option [value]=\"orgOpt.Name\">\n                  {{ orgOpt.Name }}\n                </mat-option>\n              </ng-container>\n            </mat-select>\n\n            <mat-icon matSuffix (click)=\"RefreshOrganizations()\" matTooltip=\"Refresh Organization\" color=\"accent\"> refresh </mat-icon>\n\n            <a matSuffix href=\"/.oauth/github?oauth-force-edit=true\" target=\"_blank\" color=\"accent\">\n              <mat-icon color=\"accent\" matTooltip=\"Re-authorize Organizations\"> launch </mat-icon>\n            </a>\n\n            <mat-hint>\n              If you don't have an organization or would like to create a new one,\n              <a href=\"https://github.com/account/organizations/new\" class=\"primary-link\" target=\"_blank\">\n                start here\n              </a>\n            </mat-hint>\n          </mat-form-field>\n        </div>\n\n        <div class=\"card\" *ngIf=\"\n                  RepositoryFormControl?.valid ||\n                  (OrganizationFormControl?.valid && !Loading)\n                \">\n          <mat-form-field class=\"mat-full-width\">\n            <mat-icon class=\"org-icon\" matPrefix>description</mat-icon>\n\n            <mat-select [formControlName]=\"SourceControlRoot + 'repository'\" [placeholder]=\"\n                      OrganizationFormControl?.valid\n                        ? 'Repository'\n                        : 'Repository (select organization first)'\n                    \" [disabled]=\"\n                      !OrganizationFormControl?.valid || Loading || HostingDetails?.Loading\n                    \" (selectionChange)=\"RepositoryChanged($event)\" *ngIf=\"!CreatingRepository\" required>\n              <ng-container *ngFor=\"let repoOpt of RepositoryOptions\">\n                <mat-option [value]=\"repoOpt.Name\">\n                  {{ repoOpt.Name }}\n                </mat-option>\n              </ng-container>\n            </mat-select>\n\n            <input matInput placeholder=\"Repository (creates new if does not exist)\"\n              [formControlName]=\"SourceControlRoot + 'repository'\" *ngIf=\"CreatingRepository\"\n              [fxHide]=\"Loading || HostingDetails?.Loading\" required />\n\n            <mat-icon matSuffix (click)=\"CreateRepository()\" [fxHide]=\"Loading || HostingDetails?.Loading\"\n              *ngIf=\"!CreatingRepository && OrganizationFormControl?.valid\">\n              add_circle\n            </mat-icon>\n\n            <button mat-button type=\"button\" (click)=\"SaveRepository()\"\n              *ngIf=\"CreatingRepository && RepositoryFormControl?.valid\">\n\n              <mat-icon matSuffix color=\"primary\">\n                save\n              </mat-icon>\n            </button>\n\n            <button mat-button type=\"button\" (click)=\"CancelCreateRepository()\" *ngIf=\"CreatingRepository\">\n\n              <mat-icon matSuffix>\n                cancel\n              </mat-icon>\n            </button>\n          </mat-form-field>\n        </div>\n\n        <div class=\"card\" *ngIf=\"\n                  (BranchesFormControl?.valid ||\n                    (OrganizationFormControl?.valid &&\n                      RepositoryFormControl?.valid &&\n                      !Loading)) &&\n                  !CreatingRepository &&\n                  UseBranches\n                \">\n          <mat-form-field class=\"mat-full-width\">\n            <mat-icon class=\"org-icon\" matPrefix>account_tree</mat-icon>\n\n            <mat-label>Selected Branches</mat-label>\n\n            <mat-autocomplete (optionSelected)=\"BranchOptionSelected($event)\" #branchOptions=\"matAutocomplete\">\n              <ng-container *ngFor=\"let branchOpt of BranchOptions\">\n                <mat-option [value]=\"branchOpt.Name\">\n                  {{ branchOpt.Name }}\n                </mat-option>\n              </ng-container>\n            </mat-autocomplete>\n\n            <mat-chip-list #selectedBranches>\n              <mat-chip [removable]=\"true\" (removed)=\"RemoveBranchOption(selBranch)\"\n                *ngFor=\"let selBranch of SelectedBranches\">\n                {{ selBranch }}\n                <mat-icon matChipRemove>cancel</mat-icon>\n              </mat-chip>\n\n              <input matInput placeholder=\"New Branch...\" [formControlName]=\"SourceControlRoot + 'branches'\" #branches\n                [matAutocomplete]=\"branchOptions\" [matChipInputFor]=\"selectedBranches\"\n                [matChipInputSeparatorKeyCodes]=\"SeparatorKeysCodes\" [matChipInputAddOnBlur]=\"true\"\n                (matChipInputTokenEnd)=\"AddBranchOption($event)\" [disabled]=\"Loading || HostingDetails?.Loading\"\n                required />\n            </mat-chip-list>\n          </mat-form-field>\n\n          <mat-form-field class=\"mat-full-width with-hint\" [fxShow]=\"SelectedBranches?.length > 1\">\n            <mat-icon class=\"org-icon\" matPrefix>account_tree</mat-icon>\n\n            <mat-select [formControlName]=\"SourceControlRoot + 'mainBranch'\" placeholder=\"Main Branch\"\n              [disabled]=\"Loading || HostingDetails?.Loading\" (selectionChange)=\"MainBranchChanged($event)\" required>\n              <ng-container *ngFor=\"let branch of SelectedBranches\">\n                <mat-option [value]=\"branch\">\n                  {{ branch }}\n                </mat-option>\n              </ng-container>\n            </mat-select>\n\n            <mat-icon matSuffix (click)=\"RefreshOrganizations()\" color=\"accent\"> refresh </mat-icon>\n\n            <a matSuffix mat-icon-button href=\"/.oauth/github?oauth-force-edit=true\" target=\"_blank\" color=\"accent\">\n              <mat-icon matTooltip=\"Re-authorize Organizations\" color=\"accent\"> launch </mat-icon>\n            </a>\n\n            <mat-hint>\n              If you don't have an organization or would like to create a new one,\n              <a href=\"https://github.com/account/organizations/new\" target=\"_blank\"class=\"primary-link\">\n                start here\n              </a>\n            </mat-hint>\n          </mat-form-field>\n        </div>\n\n        <div class=\"card\" *ngIf=\"\n                  (BuildPathFormControl?.valid ||\n                    (OrganizationFormControl?.valid &&\n                      RepositoryFormControl?.valid &&\n                      !Loading)) &&\n                  !CreatingRepository &&\n                  UseBuildPath\n                \">\n          <mat-form-field class=\"mat-full-width with-hint\">\n            <mat-icon class=\"org-icon\" matPrefix>build</mat-icon>\n\n            <mat-select [formControlName]=\"SourceControlRoot + 'buildPath'\" placeholder=\"Build Path\"\n              [disabled]=\"Loading || BuildPathDisabled\" (selectionChange)=\"BuildPathChanged($event)\" required>\n              <ng-container *ngFor=\"let buildPath of BuildPathOptions\">\n                <mat-option [value]=\"buildPath\">\n                  {{ buildPath }}\n                </mat-option>\n              </ng-container>\n            </mat-select>\n\n            <mat-hint>\n              The build path identifies which build action to use for your\n              configuration.\n            </mat-hint>\n          </mat-form-field>\n        </div>\n\n        <div *ngIf=\"Loading\">\n          <div class=\"spread\">\n            <lcu-loader style=\"margin: auto\" [loading]=\"true\"></lcu-loader>\n\n            <div class=\"margin-3\">\n              <h4 class=\"mat-title\" *ngIf=\"!OrganizationFormControl?.valid\">\n                Loading organizations\n              </h4>\n\n              <h4 class=\"mat-title\" *ngIf=\"\n                        OrganizationFormControl?.valid && !RepositoryFormControl?.valid\n                      \">\n                Loading repositories\n              </h4>\n\n              <h4 class=\"mat-title\" *ngIf=\"RepositoryFormControl?.valid && !BranchesFormControl?.valid\">\n                Loading branches\n              </h4>\n\n              <h4 class=\"mat-title\" *ngIf=\"\n                        (RepositoryFormControl?.valid || BranchesFormControl?.valid) &&\n                        !BuildPathFormControl?.valid\n                      \">\n                Loading build paths\n              </h4>\n            </div>\n          </div>\n        </div>\n      </ng-container>\n      <!-- </div> -->\n\n    </mat-card-content>\n    <mat-card-actions fxLayoutAlign=\"center center\">\n\n      <button \n        mat-raised-button \n        *ngIf=\"!State?.Loading\"\n        type=\"submit\" \n        fxFlex=\"100%\" \n        color=\"primary\" \n        [disabled]=\"!DevOpsSourceControlFormGroup.valid || !DevOpsSourceControlFormGroup.dirty\">\n        <mat-icon>save</mat-icon>\n        Save Source Control\n      </button>\n      <lcu-loader [loading]=\"State?.Loading\"></lcu-loader>\n      \n  </mat-card-actions>\n  </mat-card>\n</form>", styles: [".form-card,.sc-card{width:100%}.margin-bottom{margin-bottom:15px}.primary-link{color:#4a918e}.s-block{margin:10px 0;width:100%;height:40px}\n"] }]
         }], ctorParameters: function () { return [{ type: ApplicationsFlowService }, { type: EaCService }, { type: i1$1.FormBuilder }]; }, propDecorators: { EditingSourceControlLookup: [{
                 type: Input,
                 args: ['editing-source-control-lookup']