@skysoftware-co/bayan-hr-widgets-ui 2.0.6 → 2.0.7

package/fesm2022/skysoftware-co-bayan-hr-widgets-ui.mjs

@@ -180,7 +180,6 @@ var MyTeam$2 = "My team";
 var ContactInfo$2 = "Contact info";
 var ShowAllSubordinates$2 = "Show all subordinates";
 var NoDataToDisplay$2 = "No data to display";
-var Search$2 = "Search";
 var JobInformation$2 = "Job information";
 var Degrees$2 = "Degrees";
 var degrees$2 = "Degrees";
@@ -340,7 +339,6 @@ var en = {
 	ContactInfo: ContactInfo$2,
 	ShowAllSubordinates: ShowAllSubordinates$2,
 	NoDataToDisplay: NoDataToDisplay$2,
-	Search: Search$2,
 	"Search...": "Search...",
 	JobInformation: JobInformation$2,
 	Degrees: Degrees$2,
@@ -505,7 +503,6 @@ var MyTeam$1 = "فريقي";
 var ContactInfo$1 = "معلومات التواصل";
 var ShowAllSubordinates$1 = "إظهار جميع المرؤوسون";
 var NoDataToDisplay$1 = "لا توجد بيانات للعرض";
-var Search$1 = "بحث";
 var JobInformation$1 = "معلومات الوظيفة";
 var Degrees$1 = "المؤهلات العلمية";
 var degrees$1 = "المؤهلات العلمية";
@@ -665,7 +662,6 @@ var ar = {
 	ContactInfo: ContactInfo$1,
 	ShowAllSubordinates: ShowAllSubordinates$1,
 	NoDataToDisplay: NoDataToDisplay$1,
-	Search: Search$1,
 	"Search...": "بحث...",
 	JobInformation: JobInformation$1,
 	Degrees: Degrees$1,
@@ -832,7 +828,6 @@ var MyTeam = "Mon équipe";
 var ContactInfo = "Coordonnées";
 var ShowAllSubordinates = "Afficher tous les subordonnés";
 var NoDataToDisplay = "Aucune donnée à afficher";
-var Search = "Rechercher";
 var JobInformation = "Informations sur l'emploi";
 var Degrees = "Diplomes";
 var degrees = "Diplomes";
@@ -992,7 +987,6 @@ var fr = {
 	ContactInfo: ContactInfo,
 	ShowAllSubordinates: ShowAllSubordinates,
 	NoDataToDisplay: NoDataToDisplay,
-	Search: Search,
 	"Search...": "Rechercher...",
 	JobInformation: JobInformation,
 	Degrees: Degrees,
@@ -4405,11 +4399,11 @@ class WidgetCardComponent {
     contentTemplate;
     context;
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: WidgetCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.13", type: WidgetCardComponent, isStandalone: true, selector: "hr-widget-card", inputs: { cardClass: "cardClass", height: "height", contentTemplate: "contentTemplate", context: "context" }, ngImport: i0, template: "<div [class]=\"cardClass\" [style.height.px]=\"height\" style=\"overflow: hidden;\">\n  <ng-container *ngTemplateOutlet=\"contentTemplate; context: context\">\n  </ng-container>\n</div>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.13", type: WidgetCardComponent, isStandalone: true, selector: "hr-widget-card", inputs: { cardClass: "cardClass", height: "height", contentTemplate: "contentTemplate", context: "context" }, ngImport: i0, template: "<div [class]=\"cardClass\" [style.height.px]=\"height\" style=\"overflow: hidden;\">\r\n  <ng-container *ngTemplateOutlet=\"contentTemplate; context: context\">\r\n  </ng-container>\r\n</div>\r\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: WidgetCardComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'hr-widget-card', standalone: true, imports: [CommonModule], template: "<div [class]=\"cardClass\" [style.height.px]=\"height\" style=\"overflow: hidden;\">\n  <ng-container *ngTemplateOutlet=\"contentTemplate; context: context\">\n  </ng-container>\n</div>\n" }]
+            args: [{ selector: 'hr-widget-card', standalone: true, imports: [CommonModule], template: "<div [class]=\"cardClass\" [style.height.px]=\"height\" style=\"overflow: hidden;\">\r\n  <ng-container *ngTemplateOutlet=\"contentTemplate; context: context\">\r\n  </ng-container>\r\n</div>\r\n" }]
         }], propDecorators: { cardClass: [{
                 type: Input
             }], height: [{
@@ -5637,6 +5631,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImpo
 class EmployeeMainInfoCardComponent {
     employeeMainInfo = input(null, ...(ngDevMode ? [{ debugName: "employeeMainInfo" }] : /* istanbul ignore next */ []));
     searchValue = input('', ...(ngDevMode ? [{ debugName: "searchValue" }] : /* istanbul ignore next */ []));
+    showGrade = input(false, ...(ngDevMode ? [{ debugName: "showGrade" }] : /* istanbul ignore next */ []));
     showPropertySymbol = input(true, ...(ngDevMode ? [{ debugName: "showPropertySymbol" }] : /* istanbul ignore next */ []));
     showChangeEmployeeButton = input(false, ...(ngDevMode ? [{ debugName: "showChangeEmployeeButton" }] : /* istanbul ignore next */ []));
     alignCenter = input(true, ...(ngDevMode ? [{ debugName: "alignCenter" }] : /* istanbul ignore next */ []));
@@ -5666,14 +5661,14 @@ class EmployeeMainInfoCardComponent {
         this.employeeBadge.EmployeePhotoFailed = true;
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: EmployeeMainInfoCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.13", type: EmployeeMainInfoCardComponent, isStandalone: true, selector: "app-employee-main-info-card", inputs: { employeeMainInfo: { classPropertyName: "employeeMainInfo", publicName: "employeeMainInfo", isSignal: true, isRequired: false, transformFunction: null }, searchValue: { classPropertyName: "searchValue", publicName: "searchValue", isSignal: true, isRequired: false, transformFunction: null }, showPropertySymbol: { classPropertyName: "showPropertySymbol", publicName: "showPropertySymbol", isSignal: true, isRequired: false, transformFunction: null }, showChangeEmployeeButton: { classPropertyName: "showChangeEmployeeButton", publicName: "showChangeEmployeeButton", isSignal: true, isRequired: false, transformFunction: null }, alignCenter: { classPropertyName: "alignCenter", publicName: "alignCenter", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { ChangeEmployeeButtonHandler: "ChangeEmployeeButtonHandler" }, ngImport: i0, template: "@if (employeeMainInfo(); as info) {\r\n  <div class=\"d-flex align-content-center\" [ngClass]=\"{ 'align-items-center': alignCenter }\">\r\n    <bayan-employee-badge\r\n      [badge]=\"employeeBadge\"\r\n      badgeClass=\"badge employee-rounded-badge-xl fs-5\"\r\n      imageClass=\"rounded-circle shadow-lg\"\r\n      [width]=\"'50px'\"\r\n      [height]=\"'50px'\"\r\n      (employeePhotoError)=\"handleEmployeePhotoError()\"\r\n    ></bayan-employee-badge>\r\n\r\n    <div class=\"ms-3\">\r\n      <div class=\"d-flex align-items-center\">\r\n        <div\r\n          class=\"fs-14 text-dark-gray fw-medium text-ellipsis-one-line\"\r\n          data-bs-toggle=\"tooltip\"\r\n          [title]=\"info.EmployeeNumber + ' | ' + info.EmployeeName\"\r\n          [innerHTML]=\"info.EmployeeNumber + ' | ' + info.EmployeeName | highlight: searchValue()\"\r\n        ></div>\r\n        @if (showChangeEmployeeButton()) {\r\n          <button type=\"button\" class=\"border-0 ms-2 bg-none\" (click)=\"convertEmployee()\">\r\n            <fa-icon [icon]=\"dropDownIcon\" class=\"text-primary fs-5\"></fa-icon>\r\n          </button>\r\n        }\r\n      </div>\r\n      @if (info.PositionName != null && info.PositionName != '') {\r\n        <div class=\"fs-12 fw-normal text-dark-gray text-ellipsis-one-line mb-1\" data-bs-toggle=\"tooltip\" [title]=\"info.PositionName\">\r\n          <span [innerHTML]=\"info.PositionName | highlight: searchValue()\"></span>\r\n        </div>\r\n      }\r\n      <div\r\n        class=\"d-flex text-dark-gray mb-0\"\r\n        data-bs-toggle=\"tooltip\"\r\n        [title]=\"showPropertySymbol() ? info.PropertySymbol + ' | ' + info.AdminUnitName : info.AdminUnitName\"\r\n      >\r\n        <div class=\"fs-12\">\r\n          @if (showPropertySymbol()) {\r\n            <span class=\"property-badge cursor-pointer\" title=\"{{ info.PropertyName }}\">\r\n              <span [innerHTML]=\"info.PropertySymbol | highlight: searchValue()\"></span>\r\n            </span>\r\n          }\r\n          <span class=\"fw-normal ms-1\" [ngClass]=\"{ 'me-1': isRTL, 'ms-1': !isRTL }\" \r\n          [title]=\"info.AdminUnitName\" [innerHTML]=\"info.AdminUnitName | highlight: searchValue()\"></span>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n}\r\n", dependencies: [{ kind: "ngmodule", type: FontAwesomeModule }, { kind: "component", type: i2$1.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "animation", "mask", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"], outputs: ["iconChange", "titleChange", "animationChange", "maskChange", "flipChange", "sizeChange", "pullChange", "borderChange", "inverseChange", "symbolChange", "rotateChange", "fixedWidthChange", "transformChange", "a11yRoleChange"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: BayanEmployeeBadgeComponent, selector: "bayan-employee-badge", inputs: ["badge", "width", "height", "imageClass", "badgeClass"], outputs: ["employeePhotoError"] }, { kind: "pipe", type: HighlightPipe, name: "highlight" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.13", type: EmployeeMainInfoCardComponent, isStandalone: true, selector: "app-employee-main-info-card", inputs: { employeeMainInfo: { classPropertyName: "employeeMainInfo", publicName: "employeeMainInfo", isSignal: true, isRequired: false, transformFunction: null }, searchValue: { classPropertyName: "searchValue", publicName: "searchValue", isSignal: true, isRequired: false, transformFunction: null }, showGrade: { classPropertyName: "showGrade", publicName: "showGrade", isSignal: true, isRequired: false, transformFunction: null }, showPropertySymbol: { classPropertyName: "showPropertySymbol", publicName: "showPropertySymbol", isSignal: true, isRequired: false, transformFunction: null }, showChangeEmployeeButton: { classPropertyName: "showChangeEmployeeButton", publicName: "showChangeEmployeeButton", isSignal: true, isRequired: false, transformFunction: null }, alignCenter: { classPropertyName: "alignCenter", publicName: "alignCenter", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { ChangeEmployeeButtonHandler: "ChangeEmployeeButtonHandler" }, ngImport: i0, template: "@if (employeeMainInfo(); as info) {\r\n  <div class=\"d-flex align-content-center\" [ngClass]=\"{ 'align-items-center': alignCenter }\">\r\n    <bayan-employee-badge\r\n      [badge]=\"employeeBadge\"\r\n      badgeClass=\"badge employee-rounded-badge-xl fs-5\"\r\n      imageClass=\"rounded-circle shadow-lg\"\r\n      [width]=\"'50px'\"\r\n      [height]=\"'50px'\"\r\n      (employeePhotoError)=\"handleEmployeePhotoError()\"\r\n    ></bayan-employee-badge>\r\n\r\n    <div class=\"ms-3\">\r\n      <div class=\"d-flex align-items-center\">\r\n        <div\r\n          class=\"fs-14 text-dark-gray fw-medium text-ellipsis-one-line\"\r\n          data-bs-toggle=\"tooltip\"\r\n          [title]=\"info.EmployeeNumber + ' | ' + info.EmployeeName\"\r\n          [innerHTML]=\"info.EmployeeNumber + ' | ' + info.EmployeeName | highlight: searchValue()\"\r\n        ></div>\r\n        @if (showChangeEmployeeButton()) {\r\n          <button type=\"button\" class=\"border-0 ms-2 bg-none\" (click)=\"convertEmployee()\">\r\n            <fa-icon [icon]=\"dropDownIcon\" class=\"text-primary fs-5\"></fa-icon>\r\n          </button>\r\n        }\r\n      </div>\r\n      @if (info.PositionName != null && info.PositionName != '') {\r\n        <div class=\"fs-12 fw-normal text-dark-gray text-ellipsis-one-line mb-1\" data-bs-toggle=\"tooltip\" [title]=\"info.PositionName\">\r\n          <span [innerHTML]=\"info.PositionName | highlight: searchValue()\"></span>\r\n        </div>\r\n      }\r\n      @if (showGrade() && info.GradeName != null) {\r\n        <div class=\"fs-12 text-dark-gray\" [title]=\"info.GradeName\">\r\n          <span [innerHTML]=\"info.GradeName | highlight: searchValue()\"></span>\r\n        </div>\r\n      }\r\n      <div\r\n        class=\"d-flex text-dark-gray mb-0\"\r\n        data-bs-toggle=\"tooltip\"\r\n        [title]=\"showPropertySymbol() ? info.PropertySymbol + ' | ' + info.AdminUnitName : info.AdminUnitName\"\r\n      >\r\n        <div class=\"fs-12\">\r\n          @if (showPropertySymbol()) {\r\n            <span class=\"property-badge cursor-pointer\" title=\"{{ info.PropertyName }}\">\r\n              <span [innerHTML]=\"info.PropertySymbol | highlight: searchValue()\"></span>\r\n            </span>\r\n          }\r\n          <span class=\"fw-normal ms-1\" [ngClass]=\"{ 'me-1': isRTL, 'ms-1': !isRTL }\" \r\n          [title]=\"info.AdminUnitName\" [innerHTML]=\"info.AdminUnitName | highlight: searchValue()\"></span>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n}\r\n", dependencies: [{ kind: "ngmodule", type: FontAwesomeModule }, { kind: "component", type: i2$1.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "animation", "mask", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"], outputs: ["iconChange", "titleChange", "animationChange", "maskChange", "flipChange", "sizeChange", "pullChange", "borderChange", "inverseChange", "symbolChange", "rotateChange", "fixedWidthChange", "transformChange", "a11yRoleChange"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: BayanEmployeeBadgeComponent, selector: "bayan-employee-badge", inputs: ["badge", "width", "height", "imageClass", "badgeClass"], outputs: ["employeePhotoError"] }, { kind: "pipe", type: HighlightPipe, name: "highlight" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: EmployeeMainInfoCardComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-employee-main-info-card', standalone: true, imports: [FontAwesomeModule, NgClass, BayanEmployeeBadgeComponent, HighlightPipe], changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (employeeMainInfo(); as info) {\r\n  <div class=\"d-flex align-content-center\" [ngClass]=\"{ 'align-items-center': alignCenter }\">\r\n    <bayan-employee-badge\r\n      [badge]=\"employeeBadge\"\r\n      badgeClass=\"badge employee-rounded-badge-xl fs-5\"\r\n      imageClass=\"rounded-circle shadow-lg\"\r\n      [width]=\"'50px'\"\r\n      [height]=\"'50px'\"\r\n      (employeePhotoError)=\"handleEmployeePhotoError()\"\r\n    ></bayan-employee-badge>\r\n\r\n    <div class=\"ms-3\">\r\n      <div class=\"d-flex align-items-center\">\r\n        <div\r\n          class=\"fs-14 text-dark-gray fw-medium text-ellipsis-one-line\"\r\n          data-bs-toggle=\"tooltip\"\r\n          [title]=\"info.EmployeeNumber + ' | ' + info.EmployeeName\"\r\n          [innerHTML]=\"info.EmployeeNumber + ' | ' + info.EmployeeName | highlight: searchValue()\"\r\n        ></div>\r\n        @if (showChangeEmployeeButton()) {\r\n          <button type=\"button\" class=\"border-0 ms-2 bg-none\" (click)=\"convertEmployee()\">\r\n            <fa-icon [icon]=\"dropDownIcon\" class=\"text-primary fs-5\"></fa-icon>\r\n          </button>\r\n        }\r\n      </div>\r\n      @if (info.PositionName != null && info.PositionName != '') {\r\n        <div class=\"fs-12 fw-normal text-dark-gray text-ellipsis-one-line mb-1\" data-bs-toggle=\"tooltip\" [title]=\"info.PositionName\">\r\n          <span [innerHTML]=\"info.PositionName | highlight: searchValue()\"></span>\r\n        </div>\r\n      }\r\n      <div\r\n        class=\"d-flex text-dark-gray mb-0\"\r\n        data-bs-toggle=\"tooltip\"\r\n        [title]=\"showPropertySymbol() ? info.PropertySymbol + ' | ' + info.AdminUnitName : info.AdminUnitName\"\r\n      >\r\n        <div class=\"fs-12\">\r\n          @if (showPropertySymbol()) {\r\n            <span class=\"property-badge cursor-pointer\" title=\"{{ info.PropertyName }}\">\r\n              <span [innerHTML]=\"info.PropertySymbol | highlight: searchValue()\"></span>\r\n            </span>\r\n          }\r\n          <span class=\"fw-normal ms-1\" [ngClass]=\"{ 'me-1': isRTL, 'ms-1': !isRTL }\" \r\n          [title]=\"info.AdminUnitName\" [innerHTML]=\"info.AdminUnitName | highlight: searchValue()\"></span>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n}\r\n" }]
-        }], ctorParameters: () => [], propDecorators: { employeeMainInfo: [{ type: i0.Input, args: [{ isSignal: true, alias: "employeeMainInfo", required: false }] }], searchValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "searchValue", required: false }] }], showPropertySymbol: [{ type: i0.Input, args: [{ isSignal: true, alias: "showPropertySymbol", required: false }] }], showChangeEmployeeButton: [{ type: i0.Input, args: [{ isSignal: true, alias: "showChangeEmployeeButton", required: false }] }], alignCenter: [{ type: i0.Input, args: [{ isSignal: true, alias: "alignCenter", required: false }] }], ChangeEmployeeButtonHandler: [{ type: i0.Output, args: ["ChangeEmployeeButtonHandler"] }] } });
+            args: [{ selector: 'app-employee-main-info-card', standalone: true, imports: [FontAwesomeModule, NgClass, BayanEmployeeBadgeComponent, HighlightPipe], changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (employeeMainInfo(); as info) {\r\n  <div class=\"d-flex align-content-center\" [ngClass]=\"{ 'align-items-center': alignCenter }\">\r\n    <bayan-employee-badge\r\n      [badge]=\"employeeBadge\"\r\n      badgeClass=\"badge employee-rounded-badge-xl fs-5\"\r\n      imageClass=\"rounded-circle shadow-lg\"\r\n      [width]=\"'50px'\"\r\n      [height]=\"'50px'\"\r\n      (employeePhotoError)=\"handleEmployeePhotoError()\"\r\n    ></bayan-employee-badge>\r\n\r\n    <div class=\"ms-3\">\r\n      <div class=\"d-flex align-items-center\">\r\n        <div\r\n          class=\"fs-14 text-dark-gray fw-medium text-ellipsis-one-line\"\r\n          data-bs-toggle=\"tooltip\"\r\n          [title]=\"info.EmployeeNumber + ' | ' + info.EmployeeName\"\r\n          [innerHTML]=\"info.EmployeeNumber + ' | ' + info.EmployeeName | highlight: searchValue()\"\r\n        ></div>\r\n        @if (showChangeEmployeeButton()) {\r\n          <button type=\"button\" class=\"border-0 ms-2 bg-none\" (click)=\"convertEmployee()\">\r\n            <fa-icon [icon]=\"dropDownIcon\" class=\"text-primary fs-5\"></fa-icon>\r\n          </button>\r\n        }\r\n      </div>\r\n      @if (info.PositionName != null && info.PositionName != '') {\r\n        <div class=\"fs-12 fw-normal text-dark-gray text-ellipsis-one-line mb-1\" data-bs-toggle=\"tooltip\" [title]=\"info.PositionName\">\r\n          <span [innerHTML]=\"info.PositionName | highlight: searchValue()\"></span>\r\n        </div>\r\n      }\r\n      @if (showGrade() && info.GradeName != null) {\r\n        <div class=\"fs-12 text-dark-gray\" [title]=\"info.GradeName\">\r\n          <span [innerHTML]=\"info.GradeName | highlight: searchValue()\"></span>\r\n        </div>\r\n      }\r\n      <div\r\n        class=\"d-flex text-dark-gray mb-0\"\r\n        data-bs-toggle=\"tooltip\"\r\n        [title]=\"showPropertySymbol() ? info.PropertySymbol + ' | ' + info.AdminUnitName : info.AdminUnitName\"\r\n      >\r\n        <div class=\"fs-12\">\r\n          @if (showPropertySymbol()) {\r\n            <span class=\"property-badge cursor-pointer\" title=\"{{ info.PropertyName }}\">\r\n              <span [innerHTML]=\"info.PropertySymbol | highlight: searchValue()\"></span>\r\n            </span>\r\n          }\r\n          <span class=\"fw-normal ms-1\" [ngClass]=\"{ 'me-1': isRTL, 'ms-1': !isRTL }\" \r\n          [title]=\"info.AdminUnitName\" [innerHTML]=\"info.AdminUnitName | highlight: searchValue()\"></span>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n}\r\n" }]
+        }], ctorParameters: () => [], propDecorators: { employeeMainInfo: [{ type: i0.Input, args: [{ isSignal: true, alias: "employeeMainInfo", required: false }] }], searchValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "searchValue", required: false }] }], showGrade: [{ type: i0.Input, args: [{ isSignal: true, alias: "showGrade", required: false }] }], showPropertySymbol: [{ type: i0.Input, args: [{ isSignal: true, alias: "showPropertySymbol", required: false }] }], showChangeEmployeeButton: [{ type: i0.Input, args: [{ isSignal: true, alias: "showChangeEmployeeButton", required: false }] }], alignCenter: [{ type: i0.Input, args: [{ isSignal: true, alias: "alignCenter", required: false }] }], ChangeEmployeeButtonHandler: [{ type: i0.Output, args: ["ChangeEmployeeButtonHandler"] }] } });
 
-class WfSelfWidgetsService {
+class MyTeamWidgetsService {
     http;
     headers = { 'api-version': '1' };
     constructor(http) {
@@ -5690,10 +5685,10 @@ class WfSelfWidgetsService {
             headers: this.headers,
         });
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: WfSelfWidgetsService, deps: [{ token: i1.HttpClient }], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: WfSelfWidgetsService, providedIn: 'root' });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: MyTeamWidgetsService, deps: [{ token: i1.HttpClient }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: MyTeamWidgetsService, providedIn: 'root' });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: WfSelfWidgetsService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: MyTeamWidgetsService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',
@@ -5704,12 +5699,13 @@ const myTeamSubordinatesVisible = signal(false, ...(ngDevMode ? [{ debugName: "m
 function openMyTeamSubordinatesPopup() {
     myTeamSubordinatesVisible.set(true);
 }
-class MyTeamSubordinatesPopupComponent {
-    wfSelfWidgetsService = inject(WfSelfWidgetsService);
+class MyTeamPopupComponent {
+    myTeamWidgetsService = inject(MyTeamWidgetsService);
     dataScrollView;
     baseUrl = input.required(...(ngDevMode ? [{ debugName: "baseUrl" }] : /* istanbul ignore next */ []));
     isLoadingChanged = output();
     errorOccurred = output();
+    showGrade = input(false, ...(ngDevMode ? [{ debugName: "showGrade" }] : /* istanbul ignore next */ []));
     isPopupVisible = myTeamSubordinatesVisible;
     isLoading = signal(false, ...(ngDevMode ? [{ debugName: "isLoading" }] : /* istanbul ignore next */ []));
     showAllSubordinates = signal(false, ...(ngDevMode ? [{ debugName: "showAllSubordinates" }] : /* istanbul ignore next */ []));
@@ -5748,7 +5744,7 @@ class MyTeamSubordinatesPopupComponent {
             PhotoKey: emp.PhotoPath,
             PositionName: emp.PositionName,
             AdminUnitName: emp.AdminUnitName ?? '-',
-            GradeName: null,
+            GradeName: emp.GradeName ?? null,
             PropertyName: emp.PropertyName ?? '-',
             PropertySymbol: emp.PropertySymbol ?? '-',
             EmployeeNameInitials: emp.EmployeeNameInitials,
@@ -5823,7 +5819,7 @@ class MyTeamSubordinatesPopupComponent {
             this.isLoadingChanged.emit(true);
         }
         try {
-            const response = await firstValueFrom(this.wfSelfWidgetsService.getSubordinates(this.baseUrl(), {
+            const response = await firstValueFrom(this.myTeamWidgetsService.getSubordinates(this.baseUrl(), {
                 showDirectSubordinatesOnly: !this.showAllSubordinates(),
                 pageIndex: this.pageIndex,
                 pageSize: this.pageSize(),
@@ -5851,12 +5847,12 @@ class MyTeamSubordinatesPopupComponent {
             }
         }
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: MyTeamSubordinatesPopupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.13", type: MyTeamSubordinatesPopupComponent, isStandalone: true, selector: "hr-my-team-subordinates-popup", inputs: { baseUrl: { classPropertyName: "baseUrl", publicName: "baseUrl", isSignal: true, isRequired: true, transformFunction: null }, phoneIcon: { classPropertyName: "phoneIcon", publicName: "phoneIcon", isSignal: true, isRequired: false, transformFunction: null }, emailIcon: { classPropertyName: "emailIcon", publicName: "emailIcon", isSignal: true, isRequired: false, transformFunction: null }, headerRowClass: { classPropertyName: "headerRowClass", publicName: "headerRowClass", isSignal: true, isRequired: false, transformFunction: null }, switchContainerClass: { classPropertyName: "switchContainerClass", publicName: "switchContainerClass", isSignal: true, isRequired: false, transformFunction: null }, switchInputClass: { classPropertyName: "switchInputClass", publicName: "switchInputClass", isSignal: true, isRequired: false, transformFunction: null }, switchLabelClass: { classPropertyName: "switchLabelClass", publicName: "switchLabelClass", isSignal: true, isRequired: false, transformFunction: null }, scrollViewClass: { classPropertyName: "scrollViewClass", publicName: "scrollViewClass", isSignal: true, isRequired: false, transformFunction: null }, emptyStateClass: { classPropertyName: "emptyStateClass", publicName: "emptyStateClass", isSignal: true, isRequired: false, transformFunction: null }, groupHeaderClass: { classPropertyName: "groupHeaderClass", publicName: "groupHeaderClass", isSignal: true, isRequired: false, transformFunction: null }, employeeCardClass: { classPropertyName: "employeeCardClass", publicName: "employeeCardClass", isSignal: true, isRequired: false, transformFunction: null }, contactContainerClass: { classPropertyName: "contactContainerClass", publicName: "contactContainerClass", isSignal: true, isRequired: false, transformFunction: null }, contactTitleClass: { classPropertyName: "contactTitleClass", publicName: "contactTitleClass", isSignal: true, isRequired: false, transformFunction: null }, contactRowClass: { classPropertyName: "contactRowClass", publicName: "contactRowClass", isSignal: true, isRequired: false, transformFunction: null }, contactIconClass: { classPropertyName: "contactIconClass", publicName: "contactIconClass", isSignal: true, isRequired: false, transformFunction: null }, emailTextClass: { classPropertyName: "emailTextClass", publicName: "emailTextClass", isSignal: true, isRequired: false, transformFunction: null }, groupedListClass: { classPropertyName: "groupedListClass", publicName: "groupedListClass", isSignal: true, isRequired: false, transformFunction: null }, loadingContainerClass: { classPropertyName: "loadingContainerClass", publicName: "loadingContainerClass", isSignal: true, isRequired: false, transformFunction: null }, loadingIndicatorClass: { classPropertyName: "loadingIndicatorClass", publicName: "loadingIndicatorClass", isSignal: true, isRequired: false, transformFunction: null }, employeeInfoColumnClass: { classPropertyName: "employeeInfoColumnClass", publicName: "employeeInfoColumnClass", isSignal: true, isRequired: false, transformFunction: null }, contactColumnClass: { classPropertyName: "contactColumnClass", publicName: "contactColumnClass", isSignal: true, isRequired: false, transformFunction: null }, pageSize: { classPropertyName: "pageSize", publicName: "pageSize", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { isLoadingChanged: "isLoadingChanged", errorOccurred: "errorOccurred" }, viewQueries: [{ propertyName: "dataScrollView", first: true, predicate: ["dataScrollView"], descendants: true }], ngImport: i0, template: "<dx-popup\r\n  [visible]=\"isPopupVisible()\"\r\n  [width]=\"'755px'\"\r\n  [height]=\"'680px'\"\r\n  [showCloseButton]=\"true\"\r\n  [showTitle]=\"true\"\r\n  [title]=\"'MyTeam' | translate\"\r\n  contentTemplate=\"popup-content\"\r\n  shadingColor=\"rgba(0,0,0,0.4)\"\r\n  (onShown)=\"loadPage(true)\"\r\n  (onHiding)=\"closePopup()\"\r\n>\r\n  <div *dxTemplate=\"let data of 'popup-content'\">\r\n    <ng-template #employeeCardTemplate let-employee>\r\n      <div [class]=\"employeeCardClass()\">\r\n        <div class=\"row g-0 w-100 align-items-center flex-nowrap\">\r\n          <div [class]=\"employeeInfoColumnClass()\">\r\n            <app-employee-main-info-card\r\n              [employeeMainInfo]=\"toEmployeeMainInfo(employee)\"\r\n              [searchValue]=\"searchValue()\"\r\n              [showPropertySymbol]=\"true\"\r\n              [showChangeEmployeeButton]=\"false\"\r\n            ></app-employee-main-info-card>\r\n          </div>\r\n          <div [class]=\"contactColumnClass()\">\r\n            <div [class]=\"contactContainerClass()\">\r\n              <span [class]=\"contactTitleClass()\">{{ 'ContactInfo' | translate }}:</span>\r\n              <span [class]=\"contactRowClass()\">\r\n                <fa-icon [icon]=\"phoneIcon()\" [class]=\"contactIconClass()\"></fa-icon>\r\n                <span [innerHTML]=\"employee.MobileNumber ?? '-'\"></span>\r\n              </span>\r\n              <span [class]=\"contactRowClass()\">\r\n                <fa-icon [icon]=\"emailIcon()\" [class]=\"contactIconClass()\"></fa-icon>\r\n                <span [class]=\"emailTextClass()\" [title]=\"getEmployeeEmail(employee)\" [innerHTML]=\"getEmployeeEmail(employee)\"></span>\r\n              </span>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </ng-template>\r\n\r\n    <div [class]=\"headerRowClass()\">\r\n      <div [class]=\"switchContainerClass()\">\r\n        <input\r\n          [class]=\"switchInputClass()\"\r\n          type=\"checkbox\"\r\n          role=\"switch\"\r\n          id=\"myTeamDirectOnlySwitch\"\r\n          [checked]=\"showAllSubordinates()\"\r\n          (change)=\"onToggleChange($event)\"\r\n        />\r\n        <label [class]=\"switchLabelClass()\" for=\"myTeamDirectOnlySwitch\">\r\n          {{ 'ShowAllSubordinates' | translate }}\r\n        </label>\r\n      </div>\r\n      <dx-text-box\r\n        [value]=\"searchValue()\"\r\n        [placeholder]=\"'Search' | translate\"\r\n        [width]=\"'250px'\"\r\n        mode=\"search\"\r\n        (onValueChanged)=\"onSearchChanged($event.value)\"\r\n      ></dx-text-box>\r\n    </div>\r\n\r\n    <dx-scroll-view\r\n      #dataScrollView\r\n      [height]=\"500\"\r\n      [width]=\"'100%'\"\r\n      [elementAttr]=\"{ class: scrollViewClass() }\"\r\n      [scrollByContent]=\"true\"\r\n      [scrollByThumb]=\"true\"\r\n      [showScrollbar]=\"'always'\"\r\n      [bounceEnabled]=\"false\"\r\n      (onReachBottom)=\"onReachBottom($event)\"\r\n    >\r\n      <div [class]=\"groupedListClass()\">\r\n        @if (isDataLoading() && items().length === 0) {\r\n          <div [class]=\"loadingContainerClass()\">\r\n            <dx-load-indicator [visible]=\"true\" [class]=\"loadingIndicatorClass()\"></dx-load-indicator>\r\n          </div>\r\n        } @else if (items().length === 0) {\r\n          <div [class]=\"emptyStateClass()\">\r\n            {{ 'NoDataToDisplay' | translate }}\r\n          </div>\r\n        } @else {\r\n          @for (group of items(); track group.adminUnitName) {\r\n            @if (showAllSubordinates()) {\r\n              <div [class]=\"groupHeaderClass()\" [innerHTML]=\"group.adminUnitName | highlight: searchValue()\"></div>\r\n            }\r\n            @for (emp of group.employees; track emp.EmployeeNumber) {\r\n              <ng-container *ngTemplateOutlet=\"employeeCardTemplate; context: { $implicit: emp }\"></ng-container>\r\n            }\r\n          }\r\n          @if (isDataLoading()) {\r\n            <div [class]=\"loadingContainerClass()\">\r\n              <dx-load-indicator [visible]=\"true\" [class]=\"loadingIndicatorClass()\"></dx-load-indicator>\r\n            </div>\r\n          }\r\n        }\r\n      </div>\r\n    </dx-scroll-view>\r\n  </div>\r\n</dx-popup>\r\n", dependencies: [{ kind: "ngmodule", type: FontAwesomeModule }, { kind: "component", type: i2$1.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "animation", "mask", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"], outputs: ["iconChange", "titleChange", "animationChange", "maskChange", "flipChange", "sizeChange", "pullChange", "borderChange", "inverseChange", "symbolChange", "rotateChange", "fixedWidthChange", "transformChange", "a11yRoleChange"] }, { kind: "ngmodule", type: DxPopupModule }, { kind: "component", type: i2.DxPopupComponent, selector: "dx-popup", inputs: ["accessKey", "animation", "container", "contentTemplate", "deferRendering", "disabled", "dragAndResizeArea", "dragEnabled", "dragOutsideBoundary", "enableBodyScroll", "focusStateEnabled", "fullScreen", "height", "hideOnOutsideClick", "hideOnParentScroll", "hint", "hoverStateEnabled", "maxHeight", "maxWidth", "minHeight", "minWidth", "position", "resizeEnabled", "restorePosition", "rtlEnabled", "shading", "shadingColor", "showCloseButton", "showTitle", "tabIndex", "title", "titleTemplate", "toolbarItems", "visible", "width", "wrapperAttr"], outputs: ["onContentReady", "onDisposing", "onHidden", "onHiding", "onInitialized", "onOptionChanged", "onResize", "onResizeEnd", "onResizeStart", "onShowing", "onShown", "onTitleRendered", "accessKeyChange", "animationChange", "containerChange", "contentTemplateChange", "deferRenderingChange", "disabledChange", "dragAndResizeAreaChange", "dragEnabledChange", "dragOutsideBoundaryChange", "enableBodyScrollChange", "focusStateEnabledChange", "fullScreenChange", "heightChange", "hideOnOutsideClickChange", "hideOnParentScrollChange", "hintChange", "hoverStateEnabledChange", "maxHeightChange", "maxWidthChange", "minHeightChange", "minWidthChange", "positionChange", "resizeEnabledChange", "restorePositionChange", "rtlEnabledChange", "shadingChange", "shadingColorChange", "showCloseButtonChange", "showTitleChange", "tabIndexChange", "titleChange", "titleTemplateChange", "toolbarItemsChange", "visibleChange", "widthChange", "wrapperAttrChange"] }, { kind: "directive", type: i3.DxTemplateDirective, selector: "[dxTemplate]", inputs: ["dxTemplateOf"] }, { kind: "ngmodule", type: DxTextBoxModule }, { kind: "component", type: i2.DxTextBoxComponent, selector: "dx-text-box", inputs: ["accessKey", "activeStateEnabled", "buttons", "disabled", "elementAttr", "focusStateEnabled", "height", "hint", "hoverStateEnabled", "inputAttr", "isDirty", "isValid", "label", "labelMode", "mask", "maskChar", "maskInvalidMessage", "maskRules", "maxLength", "mode", "name", "placeholder", "readOnly", "rtlEnabled", "showClearButton", "showMaskMode", "spellcheck", "stylingMode", "tabIndex", "text", "useMaskedValue", "validationError", "validationErrors", "validationMessageMode", "validationMessagePosition", "validationStatus", "value", "valueChangeEvent", "visible", "width"], outputs: ["onChange", "onContentReady", "onCopy", "onCut", "onDisposing", "onEnterKey", "onFocusIn", "onFocusOut", "onInitialized", "onInput", "onKeyDown", "onKeyUp", "onOptionChanged", "onPaste", "onValueChanged", "accessKeyChange", "activeStateEnabledChange", "buttonsChange", "disabledChange", "elementAttrChange", "focusStateEnabledChange", "heightChange", "hintChange", "hoverStateEnabledChange", "inputAttrChange", "isDirtyChange", "isValidChange", "labelChange", "labelModeChange", "maskChange", "maskCharChange", "maskInvalidMessageChange", "maskRulesChange", "maxLengthChange", "modeChange", "nameChange", "placeholderChange", "readOnlyChange", "rtlEnabledChange", "showClearButtonChange", "showMaskModeChange", "spellcheckChange", "stylingModeChange", "tabIndexChange", "textChange", "useMaskedValueChange", "validationErrorChange", "validationErrorsChange", "validationMessageModeChange", "validationMessagePositionChange", "validationStatusChange", "valueChange", "valueChangeEventChange", "visibleChange", "widthChange", "onBlur"] }, { kind: "ngmodule", type: DxScrollViewModule }, { kind: "component", type: i2.DxScrollViewComponent, selector: "dx-scroll-view", inputs: ["bounceEnabled", "direction", "disabled", "elementAttr", "height", "pulledDownText", "pullingDownText", "reachBottomText", "refreshingText", "rtlEnabled", "scrollByContent", "scrollByThumb", "showScrollbar", "useNative", "width"], outputs: ["onDisposing", "onInitialized", "onOptionChanged", "onPullDown", "onReachBottom", "onScroll", "onUpdated", "bounceEnabledChange", "directionChange", "disabledChange", "elementAttrChange", "heightChange", "pulledDownTextChange", "pullingDownTextChange", "reachBottomTextChange", "refreshingTextChange", "rtlEnabledChange", "scrollByContentChange", "scrollByThumbChange", "showScrollbarChange", "useNativeChange", "widthChange"] }, { kind: "ngmodule", type: DxLoadIndicatorModule }, { kind: "component", type: i2.DxLoadIndicatorComponent, selector: "dx-load-indicator", inputs: ["animationType", "elementAttr", "height", "hint", "indicatorSrc", "rtlEnabled", "visible", "width"], outputs: ["onContentReady", "onDisposing", "onInitialized", "onOptionChanged", "animationTypeChange", "elementAttrChange", "heightChange", "hintChange", "indicatorSrcChange", "rtlEnabledChange", "visibleChange", "widthChange"] }, { kind: "component", type: EmployeeMainInfoCardComponent, selector: "app-employee-main-info-card", inputs: ["employeeMainInfo", "searchValue", "showPropertySymbol", "showChangeEmployeeButton", "alignCenter"], outputs: ["ChangeEmployeeButtonHandler"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: HighlightPipe, name: "highlight" }, { kind: "pipe", type: HRTranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: MyTeamPopupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.13", type: MyTeamPopupComponent, isStandalone: true, selector: "hr-my-team-popup", inputs: { baseUrl: { classPropertyName: "baseUrl", publicName: "baseUrl", isSignal: true, isRequired: true, transformFunction: null }, showGrade: { classPropertyName: "showGrade", publicName: "showGrade", isSignal: true, isRequired: false, transformFunction: null }, phoneIcon: { classPropertyName: "phoneIcon", publicName: "phoneIcon", isSignal: true, isRequired: false, transformFunction: null }, emailIcon: { classPropertyName: "emailIcon", publicName: "emailIcon", isSignal: true, isRequired: false, transformFunction: null }, headerRowClass: { classPropertyName: "headerRowClass", publicName: "headerRowClass", isSignal: true, isRequired: false, transformFunction: null }, switchContainerClass: { classPropertyName: "switchContainerClass", publicName: "switchContainerClass", isSignal: true, isRequired: false, transformFunction: null }, switchInputClass: { classPropertyName: "switchInputClass", publicName: "switchInputClass", isSignal: true, isRequired: false, transformFunction: null }, switchLabelClass: { classPropertyName: "switchLabelClass", publicName: "switchLabelClass", isSignal: true, isRequired: false, transformFunction: null }, scrollViewClass: { classPropertyName: "scrollViewClass", publicName: "scrollViewClass", isSignal: true, isRequired: false, transformFunction: null }, emptyStateClass: { classPropertyName: "emptyStateClass", publicName: "emptyStateClass", isSignal: true, isRequired: false, transformFunction: null }, groupHeaderClass: { classPropertyName: "groupHeaderClass", publicName: "groupHeaderClass", isSignal: true, isRequired: false, transformFunction: null }, employeeCardClass: { classPropertyName: "employeeCardClass", publicName: "employeeCardClass", isSignal: true, isRequired: false, transformFunction: null }, contactContainerClass: { classPropertyName: "contactContainerClass", publicName: "contactContainerClass", isSignal: true, isRequired: false, transformFunction: null }, contactTitleClass: { classPropertyName: "contactTitleClass", publicName: "contactTitleClass", isSignal: true, isRequired: false, transformFunction: null }, contactRowClass: { classPropertyName: "contactRowClass", publicName: "contactRowClass", isSignal: true, isRequired: false, transformFunction: null }, contactIconClass: { classPropertyName: "contactIconClass", publicName: "contactIconClass", isSignal: true, isRequired: false, transformFunction: null }, emailTextClass: { classPropertyName: "emailTextClass", publicName: "emailTextClass", isSignal: true, isRequired: false, transformFunction: null }, groupedListClass: { classPropertyName: "groupedListClass", publicName: "groupedListClass", isSignal: true, isRequired: false, transformFunction: null }, loadingContainerClass: { classPropertyName: "loadingContainerClass", publicName: "loadingContainerClass", isSignal: true, isRequired: false, transformFunction: null }, loadingIndicatorClass: { classPropertyName: "loadingIndicatorClass", publicName: "loadingIndicatorClass", isSignal: true, isRequired: false, transformFunction: null }, employeeInfoColumnClass: { classPropertyName: "employeeInfoColumnClass", publicName: "employeeInfoColumnClass", isSignal: true, isRequired: false, transformFunction: null }, contactColumnClass: { classPropertyName: "contactColumnClass", publicName: "contactColumnClass", isSignal: true, isRequired: false, transformFunction: null }, pageSize: { classPropertyName: "pageSize", publicName: "pageSize", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { isLoadingChanged: "isLoadingChanged", errorOccurred: "errorOccurred" }, viewQueries: [{ propertyName: "dataScrollView", first: true, predicate: ["dataScrollView"], descendants: true }], ngImport: i0, template: "<dx-popup\r\n  [visible]=\"isPopupVisible()\"\r\n  [width]=\"'755px'\"\r\n  [height]=\"'680px'\"\r\n  [showCloseButton]=\"true\"\r\n  [showTitle]=\"true\"\r\n  [title]=\"'MyTeam' | translate\"\r\n  contentTemplate=\"popup-content\"\r\n  shadingColor=\"rgba(0,0,0,0.4)\"\r\n  (onShown)=\"loadPage(true)\"\r\n  (onHiding)=\"closePopup()\"\r\n>\r\n  <ng-template dxTemplate=\"popup-content\">\r\n    <ng-template #loadingIndicatorTemplate>\r\n      <div [class]=\"loadingContainerClass()\">\r\n        <dx-load-indicator [visible]=\"true\" [class]=\"loadingIndicatorClass()\"></dx-load-indicator>\r\n      </div>\r\n    </ng-template>\r\n\r\n    <ng-template #employeeCardTemplate let-employee>\r\n      <div [class]=\"employeeCardClass()\">\r\n        <div class=\"row g-0 w-100 align-items-center flex-nowrap\">\r\n          <div [class]=\"employeeInfoColumnClass()\">\r\n            <app-employee-main-info-card\r\n              [employeeMainInfo]=\"toEmployeeMainInfo(employee)\"\r\n              [searchValue]=\"searchValue()\"\r\n              [showGrade]=\"showGrade()\"\r\n              [showPropertySymbol]=\"true\"\r\n              [showChangeEmployeeButton]=\"false\"\r\n            ></app-employee-main-info-card>\r\n          </div>\r\n          <div [class]=\"contactColumnClass()\">\r\n            <div [class]=\"contactContainerClass()\">\r\n              <span [class]=\"contactTitleClass()\">{{ 'ContactInfo' | translate }}:</span>\r\n              <span [class]=\"contactRowClass()\">\r\n                <fa-icon [icon]=\"emailIcon()\" [class]=\"contactIconClass()\"></fa-icon>\r\n                <span [class]=\"emailTextClass()\" [title]=\"getEmployeeEmail(employee)\" [innerHTML]=\"getEmployeeEmail(employee)\"></span>\r\n              </span>\r\n              <span [class]=\"contactRowClass()\">\r\n                <fa-icon [icon]=\"phoneIcon()\" [class]=\"contactIconClass()\"></fa-icon>\r\n                <span [innerHTML]=\"employee.MobileNumber ?? '-'\"></span>\r\n              </span>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </ng-template>\r\n\r\n    <div [class]=\"headerRowClass()\">\r\n      <div [class]=\"switchContainerClass()\">\r\n        <input\r\n          [class]=\"switchInputClass()\"\r\n          type=\"checkbox\"\r\n          role=\"switch\"\r\n          id=\"myTeamDirectOnlySwitch\"\r\n          [checked]=\"showAllSubordinates()\"\r\n          (change)=\"onToggleChange($event)\"\r\n        />\r\n        <label [class]=\"switchLabelClass()\" for=\"myTeamDirectOnlySwitch\">\r\n          {{ 'ShowAllSubordinates' | translate }}\r\n        </label>\r\n      </div>\r\n      <dx-text-box\r\n        [value]=\"searchValue()\"\r\n        [placeholder]=\"'Search...' | translate\"\r\n        [width]=\"'250px'\"\r\n        mode=\"search\"\r\n        (onValueChanged)=\"onSearchChanged($event.value)\"\r\n      ></dx-text-box>\r\n    </div>\r\n\r\n    <dx-scroll-view\r\n      #dataScrollView\r\n      [height]=\"500\"\r\n      [width]=\"'100%'\"\r\n      [elementAttr]=\"{ class: scrollViewClass() }\"\r\n      [scrollByContent]=\"true\"\r\n      [scrollByThumb]=\"true\"\r\n      [showScrollbar]=\"'always'\"\r\n      [bounceEnabled]=\"false\"\r\n      (onReachBottom)=\"onReachBottom($event)\"\r\n    >\r\n      <div [class]=\"groupedListClass()\">\r\n        @if (isDataLoading() && items().length === 0) {\r\n          <ng-container *ngTemplateOutlet=\"loadingIndicatorTemplate\"></ng-container>\r\n        } @else if (items().length === 0) {\r\n          <div [class]=\"emptyStateClass()\">\r\n            {{ 'NoDataToDisplay' | translate }}\r\n          </div>\r\n        } @else {\r\n          @for (group of items(); track group.adminUnitName) {\r\n            @if (showAllSubordinates()) {\r\n              <div [class]=\"groupHeaderClass()\" [innerHTML]=\"group.adminUnitName | highlight: searchValue()\"></div>\r\n            }\r\n            @for (emp of group.employees; track emp.EmployeeNumber) {\r\n              <ng-container *ngTemplateOutlet=\"employeeCardTemplate; context: { $implicit: emp }\"></ng-container>\r\n            }\r\n          }\r\n          @if (isDataLoading()) {\r\n            <ng-container *ngTemplateOutlet=\"loadingIndicatorTemplate\"></ng-container>\r\n          }\r\n        }\r\n      </div>\r\n    </dx-scroll-view>\r\n  </ng-template>\r\n</dx-popup>\r\n", dependencies: [{ kind: "ngmodule", type: FontAwesomeModule }, { kind: "component", type: i2$1.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "animation", "mask", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"], outputs: ["iconChange", "titleChange", "animationChange", "maskChange", "flipChange", "sizeChange", "pullChange", "borderChange", "inverseChange", "symbolChange", "rotateChange", "fixedWidthChange", "transformChange", "a11yRoleChange"] }, { kind: "ngmodule", type: DxPopupModule }, { kind: "component", type: i2.DxPopupComponent, selector: "dx-popup", inputs: ["accessKey", "animation", "container", "contentTemplate", "deferRendering", "disabled", "dragAndResizeArea", "dragEnabled", "dragOutsideBoundary", "enableBodyScroll", "focusStateEnabled", "fullScreen", "height", "hideOnOutsideClick", "hideOnParentScroll", "hint", "hoverStateEnabled", "maxHeight", "maxWidth", "minHeight", "minWidth", "position", "resizeEnabled", "restorePosition", "rtlEnabled", "shading", "shadingColor", "showCloseButton", "showTitle", "tabIndex", "title", "titleTemplate", "toolbarItems", "visible", "width", "wrapperAttr"], outputs: ["onContentReady", "onDisposing", "onHidden", "onHiding", "onInitialized", "onOptionChanged", "onResize", "onResizeEnd", "onResizeStart", "onShowing", "onShown", "onTitleRendered", "accessKeyChange", "animationChange", "containerChange", "contentTemplateChange", "deferRenderingChange", "disabledChange", "dragAndResizeAreaChange", "dragEnabledChange", "dragOutsideBoundaryChange", "enableBodyScrollChange", "focusStateEnabledChange", "fullScreenChange", "heightChange", "hideOnOutsideClickChange", "hideOnParentScrollChange", "hintChange", "hoverStateEnabledChange", "maxHeightChange", "maxWidthChange", "minHeightChange", "minWidthChange", "positionChange", "resizeEnabledChange", "restorePositionChange", "rtlEnabledChange", "shadingChange", "shadingColorChange", "showCloseButtonChange", "showTitleChange", "tabIndexChange", "titleChange", "titleTemplateChange", "toolbarItemsChange", "visibleChange", "widthChange", "wrapperAttrChange"] }, { kind: "directive", type: i3.DxTemplateDirective, selector: "[dxTemplate]", inputs: ["dxTemplateOf"] }, { kind: "ngmodule", type: DxTextBoxModule }, { kind: "component", type: i2.DxTextBoxComponent, selector: "dx-text-box", inputs: ["accessKey", "activeStateEnabled", "buttons", "disabled", "elementAttr", "focusStateEnabled", "height", "hint", "hoverStateEnabled", "inputAttr", "isDirty", "isValid", "label", "labelMode", "mask", "maskChar", "maskInvalidMessage", "maskRules", "maxLength", "mode", "name", "placeholder", "readOnly", "rtlEnabled", "showClearButton", "showMaskMode", "spellcheck", "stylingMode", "tabIndex", "text", "useMaskedValue", "validationError", "validationErrors", "validationMessageMode", "validationMessagePosition", "validationStatus", "value", "valueChangeEvent", "visible", "width"], outputs: ["onChange", "onContentReady", "onCopy", "onCut", "onDisposing", "onEnterKey", "onFocusIn", "onFocusOut", "onInitialized", "onInput", "onKeyDown", "onKeyUp", "onOptionChanged", "onPaste", "onValueChanged", "accessKeyChange", "activeStateEnabledChange", "buttonsChange", "disabledChange", "elementAttrChange", "focusStateEnabledChange", "heightChange", "hintChange", "hoverStateEnabledChange", "inputAttrChange", "isDirtyChange", "isValidChange", "labelChange", "labelModeChange", "maskChange", "maskCharChange", "maskInvalidMessageChange", "maskRulesChange", "maxLengthChange", "modeChange", "nameChange", "placeholderChange", "readOnlyChange", "rtlEnabledChange", "showClearButtonChange", "showMaskModeChange", "spellcheckChange", "stylingModeChange", "tabIndexChange", "textChange", "useMaskedValueChange", "validationErrorChange", "validationErrorsChange", "validationMessageModeChange", "validationMessagePositionChange", "validationStatusChange", "valueChange", "valueChangeEventChange", "visibleChange", "widthChange", "onBlur"] }, { kind: "ngmodule", type: DxScrollViewModule }, { kind: "component", type: i2.DxScrollViewComponent, selector: "dx-scroll-view", inputs: ["bounceEnabled", "direction", "disabled", "elementAttr", "height", "pulledDownText", "pullingDownText", "reachBottomText", "refreshingText", "rtlEnabled", "scrollByContent", "scrollByThumb", "showScrollbar", "useNative", "width"], outputs: ["onDisposing", "onInitialized", "onOptionChanged", "onPullDown", "onReachBottom", "onScroll", "onUpdated", "bounceEnabledChange", "directionChange", "disabledChange", "elementAttrChange", "heightChange", "pulledDownTextChange", "pullingDownTextChange", "reachBottomTextChange", "refreshingTextChange", "rtlEnabledChange", "scrollByContentChange", "scrollByThumbChange", "showScrollbarChange", "useNativeChange", "widthChange"] }, { kind: "ngmodule", type: DxLoadIndicatorModule }, { kind: "component", type: i2.DxLoadIndicatorComponent, selector: "dx-load-indicator", inputs: ["animationType", "elementAttr", "height", "hint", "indicatorSrc", "rtlEnabled", "visible", "width"], outputs: ["onContentReady", "onDisposing", "onInitialized", "onOptionChanged", "animationTypeChange", "elementAttrChange", "heightChange", "hintChange", "indicatorSrcChange", "rtlEnabledChange", "visibleChange", "widthChange"] }, { kind: "component", type: EmployeeMainInfoCardComponent, selector: "app-employee-main-info-card", inputs: ["employeeMainInfo", "searchValue", "showGrade", "showPropertySymbol", "showChangeEmployeeButton", "alignCenter"], outputs: ["ChangeEmployeeButtonHandler"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: HighlightPipe, name: "highlight" }, { kind: "pipe", type: HRTranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: MyTeamSubordinatesPopupComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: MyTeamPopupComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'hr-my-team-subordinates-popup', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, imports: [
+            args: [{ selector: 'hr-my-team-popup', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, imports: [
                         FontAwesomeModule,
                         DxPopupModule,
                         DxTextBoxModule,
@@ -5866,11 +5862,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImpo
                         NgTemplateOutlet,
                         HighlightPipe,
                         HRTranslatePipe,
-                    ], template: "<dx-popup\r\n  [visible]=\"isPopupVisible()\"\r\n  [width]=\"'755px'\"\r\n  [height]=\"'680px'\"\r\n  [showCloseButton]=\"true\"\r\n  [showTitle]=\"true\"\r\n  [title]=\"'MyTeam' | translate\"\r\n  contentTemplate=\"popup-content\"\r\n  shadingColor=\"rgba(0,0,0,0.4)\"\r\n  (onShown)=\"loadPage(true)\"\r\n  (onHiding)=\"closePopup()\"\r\n>\r\n  <div *dxTemplate=\"let data of 'popup-content'\">\r\n    <ng-template #employeeCardTemplate let-employee>\r\n      <div [class]=\"employeeCardClass()\">\r\n        <div class=\"row g-0 w-100 align-items-center flex-nowrap\">\r\n          <div [class]=\"employeeInfoColumnClass()\">\r\n            <app-employee-main-info-card\r\n              [employeeMainInfo]=\"toEmployeeMainInfo(employee)\"\r\n              [searchValue]=\"searchValue()\"\r\n              [showPropertySymbol]=\"true\"\r\n              [showChangeEmployeeButton]=\"false\"\r\n            ></app-employee-main-info-card>\r\n          </div>\r\n          <div [class]=\"contactColumnClass()\">\r\n            <div [class]=\"contactContainerClass()\">\r\n              <span [class]=\"contactTitleClass()\">{{ 'ContactInfo' | translate }}:</span>\r\n              <span [class]=\"contactRowClass()\">\r\n                <fa-icon [icon]=\"phoneIcon()\" [class]=\"contactIconClass()\"></fa-icon>\r\n                <span [innerHTML]=\"employee.MobileNumber ?? '-'\"></span>\r\n              </span>\r\n              <span [class]=\"contactRowClass()\">\r\n                <fa-icon [icon]=\"emailIcon()\" [class]=\"contactIconClass()\"></fa-icon>\r\n                <span [class]=\"emailTextClass()\" [title]=\"getEmployeeEmail(employee)\" [innerHTML]=\"getEmployeeEmail(employee)\"></span>\r\n              </span>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </ng-template>\r\n\r\n    <div [class]=\"headerRowClass()\">\r\n      <div [class]=\"switchContainerClass()\">\r\n        <input\r\n          [class]=\"switchInputClass()\"\r\n          type=\"checkbox\"\r\n          role=\"switch\"\r\n          id=\"myTeamDirectOnlySwitch\"\r\n          [checked]=\"showAllSubordinates()\"\r\n          (change)=\"onToggleChange($event)\"\r\n        />\r\n        <label [class]=\"switchLabelClass()\" for=\"myTeamDirectOnlySwitch\">\r\n          {{ 'ShowAllSubordinates' | translate }}\r\n        </label>\r\n      </div>\r\n      <dx-text-box\r\n        [value]=\"searchValue()\"\r\n        [placeholder]=\"'Search' | translate\"\r\n        [width]=\"'250px'\"\r\n        mode=\"search\"\r\n        (onValueChanged)=\"onSearchChanged($event.value)\"\r\n      ></dx-text-box>\r\n    </div>\r\n\r\n    <dx-scroll-view\r\n      #dataScrollView\r\n      [height]=\"500\"\r\n      [width]=\"'100%'\"\r\n      [elementAttr]=\"{ class: scrollViewClass() }\"\r\n      [scrollByContent]=\"true\"\r\n      [scrollByThumb]=\"true\"\r\n      [showScrollbar]=\"'always'\"\r\n      [bounceEnabled]=\"false\"\r\n      (onReachBottom)=\"onReachBottom($event)\"\r\n    >\r\n      <div [class]=\"groupedListClass()\">\r\n        @if (isDataLoading() && items().length === 0) {\r\n          <div [class]=\"loadingContainerClass()\">\r\n            <dx-load-indicator [visible]=\"true\" [class]=\"loadingIndicatorClass()\"></dx-load-indicator>\r\n          </div>\r\n        } @else if (items().length === 0) {\r\n          <div [class]=\"emptyStateClass()\">\r\n            {{ 'NoDataToDisplay' | translate }}\r\n          </div>\r\n        } @else {\r\n          @for (group of items(); track group.adminUnitName) {\r\n            @if (showAllSubordinates()) {\r\n              <div [class]=\"groupHeaderClass()\" [innerHTML]=\"group.adminUnitName | highlight: searchValue()\"></div>\r\n            }\r\n            @for (emp of group.employees; track emp.EmployeeNumber) {\r\n              <ng-container *ngTemplateOutlet=\"employeeCardTemplate; context: { $implicit: emp }\"></ng-container>\r\n            }\r\n          }\r\n          @if (isDataLoading()) {\r\n            <div [class]=\"loadingContainerClass()\">\r\n              <dx-load-indicator [visible]=\"true\" [class]=\"loadingIndicatorClass()\"></dx-load-indicator>\r\n            </div>\r\n          }\r\n        }\r\n      </div>\r\n    </dx-scroll-view>\r\n  </div>\r\n</dx-popup>\r\n" }]
+                    ], template: "<dx-popup\r\n  [visible]=\"isPopupVisible()\"\r\n  [width]=\"'755px'\"\r\n  [height]=\"'680px'\"\r\n  [showCloseButton]=\"true\"\r\n  [showTitle]=\"true\"\r\n  [title]=\"'MyTeam' | translate\"\r\n  contentTemplate=\"popup-content\"\r\n  shadingColor=\"rgba(0,0,0,0.4)\"\r\n  (onShown)=\"loadPage(true)\"\r\n  (onHiding)=\"closePopup()\"\r\n>\r\n  <ng-template dxTemplate=\"popup-content\">\r\n    <ng-template #loadingIndicatorTemplate>\r\n      <div [class]=\"loadingContainerClass()\">\r\n        <dx-load-indicator [visible]=\"true\" [class]=\"loadingIndicatorClass()\"></dx-load-indicator>\r\n      </div>\r\n    </ng-template>\r\n\r\n    <ng-template #employeeCardTemplate let-employee>\r\n      <div [class]=\"employeeCardClass()\">\r\n        <div class=\"row g-0 w-100 align-items-center flex-nowrap\">\r\n          <div [class]=\"employeeInfoColumnClass()\">\r\n            <app-employee-main-info-card\r\n              [employeeMainInfo]=\"toEmployeeMainInfo(employee)\"\r\n              [searchValue]=\"searchValue()\"\r\n              [showGrade]=\"showGrade()\"\r\n              [showPropertySymbol]=\"true\"\r\n              [showChangeEmployeeButton]=\"false\"\r\n            ></app-employee-main-info-card>\r\n          </div>\r\n          <div [class]=\"contactColumnClass()\">\r\n            <div [class]=\"contactContainerClass()\">\r\n              <span [class]=\"contactTitleClass()\">{{ 'ContactInfo' | translate }}:</span>\r\n              <span [class]=\"contactRowClass()\">\r\n                <fa-icon [icon]=\"emailIcon()\" [class]=\"contactIconClass()\"></fa-icon>\r\n                <span [class]=\"emailTextClass()\" [title]=\"getEmployeeEmail(employee)\" [innerHTML]=\"getEmployeeEmail(employee)\"></span>\r\n              </span>\r\n              <span [class]=\"contactRowClass()\">\r\n                <fa-icon [icon]=\"phoneIcon()\" [class]=\"contactIconClass()\"></fa-icon>\r\n                <span [innerHTML]=\"employee.MobileNumber ?? '-'\"></span>\r\n              </span>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </ng-template>\r\n\r\n    <div [class]=\"headerRowClass()\">\r\n      <div [class]=\"switchContainerClass()\">\r\n        <input\r\n          [class]=\"switchInputClass()\"\r\n          type=\"checkbox\"\r\n          role=\"switch\"\r\n          id=\"myTeamDirectOnlySwitch\"\r\n          [checked]=\"showAllSubordinates()\"\r\n          (change)=\"onToggleChange($event)\"\r\n        />\r\n        <label [class]=\"switchLabelClass()\" for=\"myTeamDirectOnlySwitch\">\r\n          {{ 'ShowAllSubordinates' | translate }}\r\n        </label>\r\n      </div>\r\n      <dx-text-box\r\n        [value]=\"searchValue()\"\r\n        [placeholder]=\"'Search...' | translate\"\r\n        [width]=\"'250px'\"\r\n        mode=\"search\"\r\n        (onValueChanged)=\"onSearchChanged($event.value)\"\r\n      ></dx-text-box>\r\n    </div>\r\n\r\n    <dx-scroll-view\r\n      #dataScrollView\r\n      [height]=\"500\"\r\n      [width]=\"'100%'\"\r\n      [elementAttr]=\"{ class: scrollViewClass() }\"\r\n      [scrollByContent]=\"true\"\r\n      [scrollByThumb]=\"true\"\r\n      [showScrollbar]=\"'always'\"\r\n      [bounceEnabled]=\"false\"\r\n      (onReachBottom)=\"onReachBottom($event)\"\r\n    >\r\n      <div [class]=\"groupedListClass()\">\r\n        @if (isDataLoading() && items().length === 0) {\r\n          <ng-container *ngTemplateOutlet=\"loadingIndicatorTemplate\"></ng-container>\r\n        } @else if (items().length === 0) {\r\n          <div [class]=\"emptyStateClass()\">\r\n            {{ 'NoDataToDisplay' | translate }}\r\n          </div>\r\n        } @else {\r\n          @for (group of items(); track group.adminUnitName) {\r\n            @if (showAllSubordinates()) {\r\n              <div [class]=\"groupHeaderClass()\" [innerHTML]=\"group.adminUnitName | highlight: searchValue()\"></div>\r\n            }\r\n            @for (emp of group.employees; track emp.EmployeeNumber) {\r\n              <ng-container *ngTemplateOutlet=\"employeeCardTemplate; context: { $implicit: emp }\"></ng-container>\r\n            }\r\n          }\r\n          @if (isDataLoading()) {\r\n            <ng-container *ngTemplateOutlet=\"loadingIndicatorTemplate\"></ng-container>\r\n          }\r\n        }\r\n      </div>\r\n    </dx-scroll-view>\r\n  </ng-template>\r\n</dx-popup>\r\n" }]
         }], propDecorators: { dataScrollView: [{
                 type: ViewChild,
                 args: ['dataScrollView']
-            }], baseUrl: [{ type: i0.Input, args: [{ isSignal: true, alias: "baseUrl", required: true }] }], isLoadingChanged: [{ type: i0.Output, args: ["isLoadingChanged"] }], errorOccurred: [{ type: i0.Output, args: ["errorOccurred"] }], phoneIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "phoneIcon", required: false }] }], emailIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "emailIcon", required: false }] }], headerRowClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "headerRowClass", required: false }] }], switchContainerClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "switchContainerClass", required: false }] }], switchInputClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "switchInputClass", required: false }] }], switchLabelClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "switchLabelClass", required: false }] }], scrollViewClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "scrollViewClass", required: false }] }], emptyStateClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyStateClass", required: false }] }], groupHeaderClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "groupHeaderClass", required: false }] }], employeeCardClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "employeeCardClass", required: false }] }], contactContainerClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "contactContainerClass", required: false }] }], contactTitleClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "contactTitleClass", required: false }] }], contactRowClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "contactRowClass", required: false }] }], contactIconClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "contactIconClass", required: false }] }], emailTextClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "emailTextClass", required: false }] }], groupedListClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "groupedListClass", required: false }] }], loadingContainerClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "loadingContainerClass", required: false }] }], loadingIndicatorClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "loadingIndicatorClass", required: false }] }], employeeInfoColumnClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "employeeInfoColumnClass", required: false }] }], contactColumnClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "contactColumnClass", required: false }] }], pageSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "pageSize", required: false }] }] } });
+            }], baseUrl: [{ type: i0.Input, args: [{ isSignal: true, alias: "baseUrl", required: true }] }], isLoadingChanged: [{ type: i0.Output, args: ["isLoadingChanged"] }], errorOccurred: [{ type: i0.Output, args: ["errorOccurred"] }], showGrade: [{ type: i0.Input, args: [{ isSignal: true, alias: "showGrade", required: false }] }], phoneIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "phoneIcon", required: false }] }], emailIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "emailIcon", required: false }] }], headerRowClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "headerRowClass", required: false }] }], switchContainerClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "switchContainerClass", required: false }] }], switchInputClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "switchInputClass", required: false }] }], switchLabelClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "switchLabelClass", required: false }] }], scrollViewClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "scrollViewClass", required: false }] }], emptyStateClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyStateClass", required: false }] }], groupHeaderClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "groupHeaderClass", required: false }] }], employeeCardClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "employeeCardClass", required: false }] }], contactContainerClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "contactContainerClass", required: false }] }], contactTitleClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "contactTitleClass", required: false }] }], contactRowClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "contactRowClass", required: false }] }], contactIconClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "contactIconClass", required: false }] }], emailTextClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "emailTextClass", required: false }] }], groupedListClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "groupedListClass", required: false }] }], loadingContainerClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "loadingContainerClass", required: false }] }], loadingIndicatorClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "loadingIndicatorClass", required: false }] }], employeeInfoColumnClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "employeeInfoColumnClass", required: false }] }], contactColumnClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "contactColumnClass", required: false }] }], pageSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "pageSize", required: false }] }] } });
 
 /*
  * Public API Surface of shared-ui
@@ -5880,5 +5876,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { EventOption, EventTypeEnum, HRCardHeaderComponent, HRConstantsService, HREmployeeCalendarComponent, HRTranslatePipe, HRTranslateService, MainWidgetShortcut, MyCalendarWidgetComponent, MyDependentsWidgetComponent, MyMainDetailsWidgetComponent, MyNextWeekVacationInsightsWidgetComponent, MyProfileAddressWidgetComponent, MyProfileBankInfoWidgetComponent, MyProfileContactWidgetComponent, MyProfileContractWidgetComponent, MyProfileDegreesWidgetComponent, MyProfileDependentsDocumentsWidgetComponent, MyProfileEntitlementsOthersWidgetComponent, MyProfileExperiencesWidgetComponent, MyProfileIndemnityWidgetComponent, MyProfileJobInfoWidgetComponent, MyProfileLanguagesWidgetComponent, MyProfileMedicalInsuranceWidgetComponent, MyProfileOtherNationalitiesWidgetComponent, MyProfilePersonalDocumentsWidgetComponent, MyProfileSalaryWidgetComponent, MyProfileServiceChargeWidgetComponent, MyProfileTicketWidgetComponent, MyProfileVacationsWidgetComponent, MyTeamSubordinatesPopupComponent, MyUpcomingEventsWidgetComponent, ProfilePersonalInfoMainWidgetComponent, PublicHolidayWeekContext, RelativeDay, ScheduleVacationTypes, ServiceChargeEntitlementMode, VacationPopupType, myTeamSubordinatesVisible, openMyTeamSubordinatesPopup };
+export { EventOption, EventTypeEnum, HRCardHeaderComponent, HRConstantsService, HREmployeeCalendarComponent, HRTranslatePipe, HRTranslateService, MainWidgetShortcut, MyCalendarWidgetComponent, MyDependentsWidgetComponent, MyMainDetailsWidgetComponent, MyNextWeekVacationInsightsWidgetComponent, MyProfileAddressWidgetComponent, MyProfileBankInfoWidgetComponent, MyProfileContactWidgetComponent, MyProfileContractWidgetComponent, MyProfileDegreesWidgetComponent, MyProfileDependentsDocumentsWidgetComponent, MyProfileEntitlementsOthersWidgetComponent, MyProfileExperiencesWidgetComponent, MyProfileIndemnityWidgetComponent, MyProfileJobInfoWidgetComponent, MyProfileLanguagesWidgetComponent, MyProfileMedicalInsuranceWidgetComponent, MyProfileOtherNationalitiesWidgetComponent, MyProfilePersonalDocumentsWidgetComponent, MyProfileSalaryWidgetComponent, MyProfileServiceChargeWidgetComponent, MyProfileTicketWidgetComponent, MyProfileVacationsWidgetComponent, MyTeamPopupComponent, MyUpcomingEventsWidgetComponent, ProfilePersonalInfoMainWidgetComponent, PublicHolidayWeekContext, RelativeDay, ScheduleVacationTypes, ServiceChargeEntitlementMode, VacationPopupType, myTeamSubordinatesVisible, openMyTeamSubordinatesPopup };
 //# sourceMappingURL=skysoftware-co-bayan-hr-widgets-ui.mjs.map