@lowcodeunit/applications-flow-common 1.33.293-lets-get-social-ish → 1.33.296-lets-get-social-ish

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

@@ -4510,17 +4510,17 @@ class GhControlComponent {
     }
     //HELPERS
     addSelectBtn() {
-        document.getElementById(this.selectedBtn).classList.add('selected');
+        // (<HTMLElement>document.getElementById(this.selectedBtn)).classList.add('selected');
     }
     removeSelectedBtn() {
-        document.getElementById(this.selectedBtn).classList.remove('selected');
+        // (<HTMLElement>document.getElementById(this.selectedBtn)).classList.remove('selected');
     }
 }
 GhControlComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.2", ngImport: i0, type: GhControlComponent, deps: [{ token: EaCService }, { token: i2$2.MatDialog }], target: i0.ɵɵFactoryTarget.Component });
-GhControlComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.2", type: GhControlComponent, selector: "lcu-gh-control", ngImport: i0, template: "<mat-card class=\"social-card\">\n    \n\n    <ng-container *ngIf=\"!State?.Loading\">\n\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\n            <button \n                fxFlex=\"15%\" \n                mat-button \n                (click)=\"Submit()\" \n                id=\"submit-btn\" \n                color=\"primary\"\n            >\n                Submit\n            </button>\n\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 [matMenuTriggerFor]=\"menu\" aria-label=\"menu\">\n                <mat-icon>more_horiz</mat-icon>\n              </button>\n              <mat-menu #menu=\"matMenu\">\n                <button \n                    class=\"gh-menu-action\" \n                    mat-menu-item\n                    (click)=\"CreateNewApp()\" \n                >\n                    Create New App\n                </button>\n\n                <button \n                    class=\"gh-menu-action\" \n                    mat-menu-item \n                    (click)=\"RouteToPath('/dashboard/create-project')\" \n                >\n                    Create Project\n                </button>\n                \n              </mat-menu>\n        </mat-card-actions>\n    </ng-container>\n\n    <!-- SKELETON -->\n    <ng-container *ngIf=\"State?.Loading\">\n        <div \n            id=\"gh-card-skeleton\" \n            fxLayout=\"row\" \n            fxLayoutAlign=\"center center\"\n        >\n\n            <skeleton-avatar  \n                class=\"gh-icon\" \n                [showIcon]=\"false\" \n                [effect]=\"SkeletonEffect\"\n            ></skeleton-avatar>\n\n            <div fxFlex=\"70%\"class=\"gh-card-main-content\">\n                <skeleton-block  height=\"60px\" [effect]=\"SkeletonEffect\"></skeleton-block>\n            </div>\n\n            <div \n                skeleton-text  \n                fxFlex=\"15%\"  \n                [effect]=\"SkeletonEffect\"\n                style=\"margin: 0px 10px;\"\n            >\n                Submit\n            </div>\n\n\n        </div>\n\n        <div fxLayout=\"row\" fxLayoutAlign=\"space-around center\">\n            <div skeleton-text [effect]=\"SkeletonEffect\">Pull Request</div>\n            <div skeleton-text [effect]=\"SkeletonEffect\">Open Issue</div>\n            <div skeleton-text [effect]=\"SkeletonEffect\">Feature Branch</div>\n            <div skeleton-text [effect]=\"SkeletonEffect\">\n                <mat-icon>more_horiz</mat-icon>\n            </div>\n        </div>\n\n    </ng-container>\n</mat-card>", styles: [":host ::ng-deep .social-card{margin:20px;padding:15px 5px}:host ::ng-deep mat-card-actions{margin-bottom:-1px!important;margin-left:0!important;margin-right:-.5px!important}:host ::ng-deep .main-slot-container{padding:10px}:host ::ng-deep .slot-header{align-items:center}:host ::ng-deep .slot-content{width:100%}:host ::ng-deep .slot-name{font-size:13px;font-weight:600}:host ::ng-deep .slot-description{font-size:12px;margin-right:10px}:host ::ng-deep .slot-action-anchor{font-size:10px;text-decoration:none;color:#000}:host ::ng-deep .action-icon{height:25px;width:25px;font-size:25px;cursor:pointer}.gh-icon{width:60px;height:60px;font-size:60px;text-align:center}.gh-input{width:90%}.selected{border:1px solid green}.gh-input ::ng-deep .mat-form-field-flex{border:1px solid;border-radius:30px!important}.gh-input ::ng-deep .mat-form-field-wrapper{padding-bottom:0!important}.gh-input ::ng-deep .mat-form-field-underline{display:none}\n"], components: [{ type: i1$1.MatCard, selector: "mat-card", exportAs: ["matCard"] }, { type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i4$1.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { type: i4.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: i7$1.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { type: i7$1.MatMenuItem, selector: "[mat-menu-item]", inputs: ["disabled", "disableRipple", "role"], exportAs: ["matMenuItem"] }, { type: i4$3.SkeletonAvatarComponent, selector: "skeleton-avatar", inputs: ["size", "color", "showIcon", "iconColor", "borderRadius", "effect"] }, { type: i4$3.SkeletonBlockComponent, selector: "skeleton-block", inputs: ["width", "height", "effect", "borderRadius"] }], directives: [{ type: i9.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i8.DefaultLayoutDirective, selector: "  [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md],  [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md],  [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm],  [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { type: i8.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"] }, { type: i8.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$1.MatLabel, selector: "mat-label" }, { 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$2.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: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i1$1.MatCardActions, selector: "mat-card-actions", inputs: ["align"], exportAs: ["matCardActions"] }, { type: i7$1.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { type: i4$3.SkeletonTextDirective, selector: "[skeleton-text]", inputs: ["effect"] }] });
+GhControlComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.2", type: GhControlComponent, selector: "lcu-gh-control", ngImport: i0, template: "<mat-card class=\"social-card\" *ngIf=\"false\">\n  <ng-container *ngIf=\"!State?.Loading\">\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\n      <button\n        fxFlex=\"15%\"\n        mat-button\n        (click)=\"Submit()\"\n        id=\"submit-btn\"\n        color=\"primary\"\n      >\n        Submit\n      </button>\n    </div>\n\n    <mat-card-actions fxLayout=\"row\" fxLayoutAlign=\"space-around center\">\n      <button mat-button (click)=\"CreatePullRequest()\" id=\"pr-btn\">\n        Pull Request\n      </button>\n      <button mat-button (click)=\"OpenIssue()\" id=\"oi-btn\">Open Issue</button>\n      <button mat-button (click)=\"CreateFeatureBranch()\" id=\"fb-btn\">\n        Feature Branch\n      </button>\n      <button mat-icon-button [matMenuTriggerFor]=\"menu\" aria-label=\"menu\">\n        <mat-icon>more_horiz</mat-icon>\n      </button>\n      <mat-menu #menu=\"matMenu\">\n        <button class=\"gh-menu-action\" mat-menu-item (click)=\"CreateNewApp()\">\n          Create New App\n        </button>\n\n        <button\n          class=\"gh-menu-action\"\n          mat-menu-item\n          (click)=\"RouteToPath('/dashboard/create-project')\"\n        >\n          Create Project\n        </button>\n      </mat-menu>\n    </mat-card-actions>\n  </ng-container>\n\n  <!-- SKELETON -->\n  <ng-container *ngIf=\"State?.Loading\">\n    <div id=\"gh-card-skeleton\" fxLayout=\"row\" fxLayoutAlign=\"center center\">\n      <skeleton-avatar\n        class=\"gh-icon\"\n        [showIcon]=\"false\"\n        [effect]=\"SkeletonEffect\"\n      ></skeleton-avatar>\n\n      <div fxFlex=\"70%\" class=\"gh-card-main-content\">\n        <skeleton-block\n          height=\"60px\"\n          [effect]=\"SkeletonEffect\"\n        ></skeleton-block>\n      </div>\n\n      <div\n        skeleton-text\n        fxFlex=\"15%\"\n        [effect]=\"SkeletonEffect\"\n        style=\"margin: 0px 10px\"\n      >\n        Submit\n      </div>\n    </div>\n\n    <div fxLayout=\"row\" fxLayoutAlign=\"space-around center\">\n      <div skeleton-text [effect]=\"SkeletonEffect\">Pull Request</div>\n      <div skeleton-text [effect]=\"SkeletonEffect\">Open Issue</div>\n      <div skeleton-text [effect]=\"SkeletonEffect\">Feature Branch</div>\n      <div skeleton-text [effect]=\"SkeletonEffect\">\n        <mat-icon>more_horiz</mat-icon>\n      </div>\n    </div>\n  </ng-container>\n</mat-card>\n", styles: [":host ::ng-deep .social-card{margin:20px;padding:15px 5px}:host ::ng-deep mat-card-actions{margin-bottom:-1px!important;margin-left:0!important;margin-right:-.5px!important}:host ::ng-deep .main-slot-container{padding:10px}:host ::ng-deep .slot-header{align-items:center}:host ::ng-deep .slot-content{width:100%}:host ::ng-deep .slot-name{font-size:13px;font-weight:600}:host ::ng-deep .slot-description{font-size:12px;margin-right:10px}:host ::ng-deep .slot-action-anchor{font-size:10px;text-decoration:none;color:#000}:host ::ng-deep .action-icon{height:25px;width:25px;font-size:25px;cursor:pointer}.gh-icon{width:60px;height:60px;font-size:60px;text-align:center}.gh-input{width:90%}.selected{border:1px solid green}.gh-input ::ng-deep .mat-form-field-flex{border:1px solid;border-radius:30px!important}.gh-input ::ng-deep .mat-form-field-wrapper{padding-bottom:0!important}.gh-input ::ng-deep .mat-form-field-underline{display:none}\n"], components: [{ type: i1$1.MatCard, selector: "mat-card", exportAs: ["matCard"] }, { type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i4$1.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { type: i4.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: i7$1.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { type: i7$1.MatMenuItem, selector: "[mat-menu-item]", inputs: ["disabled", "disableRipple", "role"], exportAs: ["matMenuItem"] }, { type: i4$3.SkeletonAvatarComponent, selector: "skeleton-avatar", inputs: ["size", "color", "showIcon", "iconColor", "borderRadius", "effect"] }, { type: i4$3.SkeletonBlockComponent, selector: "skeleton-block", inputs: ["width", "height", "effect", "borderRadius"] }], directives: [{ type: i9.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i8.DefaultLayoutDirective, selector: "  [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md],  [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md],  [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm],  [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { type: i8.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"] }, { type: i8.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$1.MatLabel, selector: "mat-label" }, { 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$2.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: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i1$1.MatCardActions, selector: "mat-card-actions", inputs: ["align"], exportAs: ["matCardActions"] }, { type: i7$1.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { type: i4$3.SkeletonTextDirective, selector: "[skeleton-text]", inputs: ["effect"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.2", ngImport: i0, type: GhControlComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'lcu-gh-control', template: "<mat-card class=\"social-card\">\n    \n\n    <ng-container *ngIf=\"!State?.Loading\">\n\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\n            <button \n                fxFlex=\"15%\" \n                mat-button \n                (click)=\"Submit()\" \n                id=\"submit-btn\" \n                color=\"primary\"\n            >\n                Submit\n            </button>\n\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 [matMenuTriggerFor]=\"menu\" aria-label=\"menu\">\n                <mat-icon>more_horiz</mat-icon>\n              </button>\n              <mat-menu #menu=\"matMenu\">\n                <button \n                    class=\"gh-menu-action\" \n                    mat-menu-item\n                    (click)=\"CreateNewApp()\" \n                >\n                    Create New App\n                </button>\n\n                <button \n                    class=\"gh-menu-action\" \n                    mat-menu-item \n                    (click)=\"RouteToPath('/dashboard/create-project')\" \n                >\n                    Create Project\n                </button>\n                \n              </mat-menu>\n        </mat-card-actions>\n    </ng-container>\n\n    <!-- SKELETON -->\n    <ng-container *ngIf=\"State?.Loading\">\n        <div \n            id=\"gh-card-skeleton\" \n            fxLayout=\"row\" \n            fxLayoutAlign=\"center center\"\n        >\n\n            <skeleton-avatar  \n                class=\"gh-icon\" \n                [showIcon]=\"false\" \n                [effect]=\"SkeletonEffect\"\n            ></skeleton-avatar>\n\n            <div fxFlex=\"70%\"class=\"gh-card-main-content\">\n                <skeleton-block  height=\"60px\" [effect]=\"SkeletonEffect\"></skeleton-block>\n            </div>\n\n            <div \n                skeleton-text  \n                fxFlex=\"15%\"  \n                [effect]=\"SkeletonEffect\"\n                style=\"margin: 0px 10px;\"\n            >\n                Submit\n            </div>\n\n\n        </div>\n\n        <div fxLayout=\"row\" fxLayoutAlign=\"space-around center\">\n            <div skeleton-text [effect]=\"SkeletonEffect\">Pull Request</div>\n            <div skeleton-text [effect]=\"SkeletonEffect\">Open Issue</div>\n            <div skeleton-text [effect]=\"SkeletonEffect\">Feature Branch</div>\n            <div skeleton-text [effect]=\"SkeletonEffect\">\n                <mat-icon>more_horiz</mat-icon>\n            </div>\n        </div>\n\n    </ng-container>\n</mat-card>", styles: [":host ::ng-deep .social-card{margin:20px;padding:15px 5px}:host ::ng-deep mat-card-actions{margin-bottom:-1px!important;margin-left:0!important;margin-right:-.5px!important}:host ::ng-deep .main-slot-container{padding:10px}:host ::ng-deep .slot-header{align-items:center}:host ::ng-deep .slot-content{width:100%}:host ::ng-deep .slot-name{font-size:13px;font-weight:600}:host ::ng-deep .slot-description{font-size:12px;margin-right:10px}:host ::ng-deep .slot-action-anchor{font-size:10px;text-decoration:none;color:#000}:host ::ng-deep .action-icon{height:25px;width:25px;font-size:25px;cursor:pointer}.gh-icon{width:60px;height:60px;font-size:60px;text-align:center}.gh-input{width:90%}.selected{border:1px solid green}.gh-input ::ng-deep .mat-form-field-flex{border:1px solid;border-radius:30px!important}.gh-input ::ng-deep .mat-form-field-wrapper{padding-bottom:0!important}.gh-input ::ng-deep .mat-form-field-underline{display:none}\n"] }]
+            args: [{ selector: 'lcu-gh-control', template: "<mat-card class=\"social-card\" *ngIf=\"false\">\n  <ng-container *ngIf=\"!State?.Loading\">\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\n      <button\n        fxFlex=\"15%\"\n        mat-button\n        (click)=\"Submit()\"\n        id=\"submit-btn\"\n        color=\"primary\"\n      >\n        Submit\n      </button>\n    </div>\n\n    <mat-card-actions fxLayout=\"row\" fxLayoutAlign=\"space-around center\">\n      <button mat-button (click)=\"CreatePullRequest()\" id=\"pr-btn\">\n        Pull Request\n      </button>\n      <button mat-button (click)=\"OpenIssue()\" id=\"oi-btn\">Open Issue</button>\n      <button mat-button (click)=\"CreateFeatureBranch()\" id=\"fb-btn\">\n        Feature Branch\n      </button>\n      <button mat-icon-button [matMenuTriggerFor]=\"menu\" aria-label=\"menu\">\n        <mat-icon>more_horiz</mat-icon>\n      </button>\n      <mat-menu #menu=\"matMenu\">\n        <button class=\"gh-menu-action\" mat-menu-item (click)=\"CreateNewApp()\">\n          Create New App\n        </button>\n\n        <button\n          class=\"gh-menu-action\"\n          mat-menu-item\n          (click)=\"RouteToPath('/dashboard/create-project')\"\n        >\n          Create Project\n        </button>\n      </mat-menu>\n    </mat-card-actions>\n  </ng-container>\n\n  <!-- SKELETON -->\n  <ng-container *ngIf=\"State?.Loading\">\n    <div id=\"gh-card-skeleton\" fxLayout=\"row\" fxLayoutAlign=\"center center\">\n      <skeleton-avatar\n        class=\"gh-icon\"\n        [showIcon]=\"false\"\n        [effect]=\"SkeletonEffect\"\n      ></skeleton-avatar>\n\n      <div fxFlex=\"70%\" class=\"gh-card-main-content\">\n        <skeleton-block\n          height=\"60px\"\n          [effect]=\"SkeletonEffect\"\n        ></skeleton-block>\n      </div>\n\n      <div\n        skeleton-text\n        fxFlex=\"15%\"\n        [effect]=\"SkeletonEffect\"\n        style=\"margin: 0px 10px\"\n      >\n        Submit\n      </div>\n    </div>\n\n    <div fxLayout=\"row\" fxLayoutAlign=\"space-around center\">\n      <div skeleton-text [effect]=\"SkeletonEffect\">Pull Request</div>\n      <div skeleton-text [effect]=\"SkeletonEffect\">Open Issue</div>\n      <div skeleton-text [effect]=\"SkeletonEffect\">Feature Branch</div>\n      <div skeleton-text [effect]=\"SkeletonEffect\">\n        <mat-icon>more_horiz</mat-icon>\n      </div>\n    </div>\n  </ng-container>\n</mat-card>\n", styles: [":host ::ng-deep .social-card{margin:20px;padding:15px 5px}:host ::ng-deep mat-card-actions{margin-bottom:-1px!important;margin-left:0!important;margin-right:-.5px!important}:host ::ng-deep .main-slot-container{padding:10px}:host ::ng-deep .slot-header{align-items:center}:host ::ng-deep .slot-content{width:100%}:host ::ng-deep .slot-name{font-size:13px;font-weight:600}:host ::ng-deep .slot-description{font-size:12px;margin-right:10px}:host ::ng-deep .slot-action-anchor{font-size:10px;text-decoration:none;color:#000}:host ::ng-deep .action-icon{height:25px;width:25px;font-size:25px;cursor:pointer}.gh-icon{width:60px;height:60px;font-size:60px;text-align:center}.gh-input{width:90%}.selected{border:1px solid green}.gh-input ::ng-deep .mat-form-field-flex{border:1px solid;border-radius:30px!important}.gh-input ::ng-deep .mat-form-field-wrapper{padding-bottom:0!important}.gh-input ::ng-deep .mat-form-field-underline{display:none}\n"] }]
         }], ctorParameters: function () { return [{ type: EaCService }, { type: i2$2.MatDialog }]; } });
 
 class DevopsSourceControlFormComponent {