@skysoftware-co/bayan-hr-widgets-ui 1.0.39 → 1.0.41

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

@@ -215,6 +215,10 @@ var TotalEmployerShare$2 = "Total employer share";
 var Dependents$2 = "Dependents";
 var NotEntitled$2 = "Not entitled";
 var ThereAreNoDependentsYet$2 = "There are no dependents yet";
+var PersonalDocuments$2 = "Personal Documents";
+var ThereAreNoPersonalDocumentsYet$1 = "There are no personal documents yet";
+var ThereAreNoDependentsDocumentsYet$1 = "There are no dependents' documents yet";
+var DependentsDocuments$2 = "Dependents Documents";
 var en = {
 	ReportingTo: ReportingTo$2,
 	NotAnknown: NotAnknown$2,
@@ -367,7 +371,11 @@ var en = {
 	NotEntitled: NotEntitled$2,
 	"TicketEvery{{value}}Months": "Ticket every {{value}} months",
 	"TicketEvery{{value}}Month": "Ticket every {{value}} month",
-	ThereAreNoDependentsYet: ThereAreNoDependentsYet$2
+	ThereAreNoDependentsYet: ThereAreNoDependentsYet$2,
+	PersonalDocuments: PersonalDocuments$2,
+	ThereAreNoPersonalDocumentsYet: ThereAreNoPersonalDocumentsYet$1,
+	ThereAreNoDependentsDocumentsYet: ThereAreNoDependentsDocumentsYet$1,
+	DependentsDocuments: DependentsDocuments$2
 };
 
 var ReportingTo$1 = "مفوض الى";
@@ -456,7 +464,7 @@ var ContractType$1 = "نوع العقد";
 var ContractStartDate$1 = "تاريخ بداية العقد";
 var ContractEndDate$1 = "تاريخ نهاية العقد";
 var ContractMaritalStatus$1 = "الحالة الاجتماعية في العقد";
-var ContractDependentsCount$1 = "عدد المعالين في العقد";
+var ContractDependentsCount$1 = "عدد المعالون في العقد";
 var BasicSalary$1 = "الراتب الأساسي";
 var GrossSalary$1 = "إجمالي الراتب";
 var Points$1 = "نقاط";
@@ -487,7 +495,7 @@ var Employer$1 = "جهة العمل";
 var TerminationReason$1 = "سبب إنهاء الخدمة";
 var ThereIsNoDegreesYet$1 = "لا توجد مؤهلات علمية بعد";
 var ThereIsNoExperiencesYet$1 = "لا توجد خبرات بعد";
-var ThereIsNoDependentsYet$1 = "لا يوجد معالين حتى الآن";
+var ThereIsNoDependentsYet$1 = "لا يوجد معالون حتى الآن";
 var DependentTypeName$1 = "نوع المعال";
 var Vacations$1 = "الاجازات";
 var Indemnity$1 = "التعويض";
@@ -511,9 +519,13 @@ var NoTicketEntitlement$1 = "لا يوجد استحقاق تذكرة";
 var CoverageDate$1 = "تاريخ التغطية";
 var TotalEmployeeShare$1 = "إجمالي حصة الموظف";
 var TotalEmployerShare$1 = "إجمالي حصة صاحب العمل";
-var Dependents$1 = "المعالين";
+var Dependents$1 = "المعالون";
 var NotEntitled$1 = "غير مستحق";
-var ThereAreNoDependentsYet$1 = "لا يوجد معالين حتى الآن";
+var ThereAreNoDependentsYet$1 = "لا يوجد معالون حتى الآن";
+var PersonalDocuments$1 = "المستندات الشخصية";
+var ThereIsNoPersonalDocumentsYet = "لا توجد مستندات شخصية بعد";
+var ThereIsNoDependentsDocumentsYet = "لا توجد مستندات للمعالون بعد";
+var DependentsDocuments$1 = "مستندات المعالون";
 var ar = {
 	ReportingTo: ReportingTo$1,
 	NotAnknown: NotAnknown$1,
@@ -665,7 +677,11 @@ var ar = {
 	NotEntitled: NotEntitled$1,
 	"TicketEvery{{value}}Months": "تذكرة كل {{value}} شهر",
 	"TicketEvery{{value}}Month": "تذكرة كل {{value}} شهر",
-	ThereAreNoDependentsYet: ThereAreNoDependentsYet$1
+	ThereAreNoDependentsYet: ThereAreNoDependentsYet$1,
+	PersonalDocuments: PersonalDocuments$1,
+	ThereIsNoPersonalDocumentsYet: ThereIsNoPersonalDocumentsYet,
+	ThereIsNoDependentsDocumentsYet: ThereIsNoDependentsDocumentsYet,
+	DependentsDocuments: DependentsDocuments$1
 };
 
 var ReportingTo = "Rapport à";
@@ -788,6 +804,35 @@ var ThereIsNoDegreesYet = "Il n'y a pas encore de diplomes";
 var ThereIsNoExperiencesYet = "Il n'y a pas encore d'experiences";
 var ThereIsNoDependentsYet = "Il n'y a pas encore de personnes à charge";
 var DependentTypeName = "Type de personne à charge";
+var Vacations = "Vacances";
+var Indemnity = "Indemnité";
+var MedicalInsurance = "Assurance médicale";
+var Tickets = "Billets";
+var Others = "Autres";
+var Type = "Type";
+var Entitlement = "Droit";
+var IndemnityEligibility = "Admissibilité à l'indemnisation";
+var OvertimeEligibility = "Admissibilité aux heures supplémentaires";
+var SocialSecurityEligibility = "Admissibilité à la sécurité sociale";
+var Class = "Classe";
+var Sector = "Secteur";
+var Me = "Moi";
+var Eligible = "Admissible";
+var NotEligible = "Non éligible";
+var Member = "Membre";
+var NotMember = "Non membre";
+var NotCoveredByMedicalInsurance = "Non couvert par l'assurance médicale";
+var NoTicketEntitlement = "Aucun droit au billet";
+var CoverageDate = "Date de couverture";
+var TotalEmployeeShare = "Part totale des employés";
+var TotalEmployerShare = "Part totale de l'employeur";
+var Dependents = "Personnes à charge";
+var NotEntitled = "Non éligible au droit";
+var ThereAreNoDependentsYet = "Il n'y a pas encore de personnes à charge";
+var PersonalDocuments = "Documents personnels";
+var ThereAreNoPersonalDocumentsYet = "Il n'y a pas encore de documents personnels";
+var ThereAreNoDependentsDocumentsYet = "Il n'y a pas encore de documents pour les personnes à charge";
+var DependentsDocuments = "Documents des personnes à charge";
 var fr = {
 	ReportingTo: ReportingTo,
 	NotAnknown: NotAnknown,
@@ -911,7 +956,40 @@ var fr = {
 	ThereIsNoDegreesYet: ThereIsNoDegreesYet,
 	ThereIsNoExperiencesYet: ThereIsNoExperiencesYet,
 	ThereIsNoDependentsYet: ThereIsNoDependentsYet,
-	DependentTypeName: DependentTypeName
+	DependentTypeName: DependentTypeName,
+	Vacations: Vacations,
+	Indemnity: Indemnity,
+	MedicalInsurance: MedicalInsurance,
+	Tickets: Tickets,
+	Others: Others,
+	Type: Type,
+	Entitlement: Entitlement,
+	IndemnityEligibility: IndemnityEligibility,
+	OvertimeEligibility: OvertimeEligibility,
+	SocialSecurityEligibility: SocialSecurityEligibility,
+	Class: Class,
+	Sector: Sector,
+	Me: Me,
+	Eligible: Eligible,
+	NotEligible: NotEligible,
+	Member: Member,
+	NotMember: NotMember,
+	"There'sNoInformationInThisSectionYet": "Il n'y a pas encore d'informations dans cette section",
+	NotCoveredByMedicalInsurance: NotCoveredByMedicalInsurance,
+	NoTicketEntitlement: NoTicketEntitlement,
+	"Number": "Nombre",
+	CoverageDate: CoverageDate,
+	TotalEmployeeShare: TotalEmployeeShare,
+	TotalEmployerShare: TotalEmployerShare,
+	Dependents: Dependents,
+	NotEntitled: NotEntitled,
+	"TicketEvery{{value}}Months": "Billet tous les {{value}} mois",
+	"TicketEvery{{value}}Month": "Billet tous les {{value}} mois",
+	ThereAreNoDependentsYet: ThereAreNoDependentsYet,
+	PersonalDocuments: PersonalDocuments,
+	ThereAreNoPersonalDocumentsYet: ThereAreNoPersonalDocumentsYet,
+	ThereAreNoDependentsDocumentsYet: ThereAreNoDependentsDocumentsYet,
+	DependentsDocuments: DependentsDocuments
 };
 
 const BUILT_IN_LEXICONS = { en, ar, fr };
@@ -1282,6 +1360,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
 class ProfileDocumentsCacheService {
     baseUrl = '';
     dependentDocuments$ = null;
+    personalDocuments$ = null;
     getDependentDocuments(baseUrl) {
         return this.baseUrl === baseUrl ? this.dependentDocuments$ : null;
     }
@@ -1289,9 +1368,17 @@ class ProfileDocumentsCacheService {
         this.ensureBaseUrl(baseUrl);
         this.dependentDocuments$ = value;
     }
+    getPersonalDocuments(baseUrl) {
+        return this.baseUrl === baseUrl ? this.personalDocuments$ : null;
+    }
+    setPersonalDocuments(baseUrl, value) {
+        this.ensureBaseUrl(baseUrl);
+        this.personalDocuments$ = value;
+    }
     clear() {
         this.baseUrl = '';
         this.dependentDocuments$ = null;
+        this.personalDocuments$ = null;
     }
     ensureBaseUrl(baseUrl) {
         if (this.baseUrl && this.baseUrl !== baseUrl) {
@@ -1706,7 +1793,7 @@ class HRSelfWidgetsService {
                 return cached$;
         }
         const request$ = this.http
-            .get(`${baseUrl}/api/hr/widgets/me/profile/documents/dependents`, { headers: this.headers })
+            .get(`${baseUrl}/hr/widgets/me/profile/documents/dependents`, { headers: this.headers })
             .pipe(map(res => res?.ResponseData ?? []), shareReplay(1), catchError(error => {
             this.profileDocumentsCacheService.clear();
             return throwError(() => error);
@@ -1714,6 +1801,21 @@ class HRSelfWidgetsService {
         this.profileDocumentsCacheService.setDependentDocuments(baseUrl, request$);
         return request$;
     }
+    getPersonalDocuments(baseUrl, forceRefresh = false) {
+        if (!forceRefresh) {
+            const cached$ = this.profileDocumentsCacheService.getPersonalDocuments(baseUrl);
+            if (cached$)
+                return cached$;
+        }
+        const request$ = this.http
+            .get(`${baseUrl}/hr/widgets/me/profile/documents/personal`, { headers: this.headers })
+            .pipe(map(res => res?.ResponseData ?? []), shareReplay(1), catchError(error => {
+            this.profileDocumentsCacheService.clear();
+            return throwError(() => error);
+        }));
+        this.profileDocumentsCacheService.setPersonalDocuments(baseUrl, request$);
+        return request$;
+    }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: HRSelfWidgetsService, deps: [{ token: i1.HttpClient }, { token: BankInformationCacheService }, { token: EntitlementsCacheService }, { token: JobInformationCacheService }, { token: PersonalInformationCacheService }, { token: QualificationsCacheService }, { token: ProfileEmployeeDependentsCach }, { token: ProfileDocumentsCacheService }], target: i0.ɵɵFactoryTarget.Injectable });
     static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: HRSelfWidgetsService, providedIn: 'root' });
 }
@@ -2813,11 +2915,11 @@ class HRInfoFieldComponent {
     valueClass = 'fs-14 fw-medium';
     fallbackValue = '—';
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: HRInfoFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: HRInfoFieldComponent, isStandalone: true, selector: "hr-info-field", inputs: { labelKey: "labelKey", value: "value", labelClass: "labelClass", valueClass: "valueClass", fallbackValue: "fallbackValue" }, ngImport: i0, template: "<div [ngClass]=\"labelClass\">{{labelKey | HRTranslate}}</div>\r\n<div [ngClass]=\"valueClass\">{{value || fallbackValue}}</div>\r\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: HRTranslatePipe, name: "HRTranslate" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: HRInfoFieldComponent, isStandalone: true, selector: "hr-info-field", inputs: { labelKey: "labelKey", value: "value", labelClass: "labelClass", valueClass: "valueClass", fallbackValue: "fallbackValue" }, ngImport: i0, template: "<div [ngClass]=\"labelClass\">{{labelKey | HRTranslate}}</div>\r\n<div [ngClass]=\"valueClass\" [title]=\"value || fallbackValue\">{{value || fallbackValue}}</div>\r\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: HRTranslatePipe, name: "HRTranslate" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: HRInfoFieldComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'hr-info-field', standalone: true, imports: [CommonModule, HRTranslatePipe], template: "<div [ngClass]=\"labelClass\">{{labelKey | HRTranslate}}</div>\r\n<div [ngClass]=\"valueClass\">{{value || fallbackValue}}</div>\r\n" }]
+            args: [{ selector: 'hr-info-field', standalone: true, imports: [CommonModule, HRTranslatePipe], template: "<div [ngClass]=\"labelClass\">{{labelKey | HRTranslate}}</div>\r\n<div [ngClass]=\"valueClass\" [title]=\"value || fallbackValue\">{{value || fallbackValue}}</div>\r\n" }]
         }], propDecorators: { labelKey: [{
                 type: Input,
                 args: [{ required: true }]
@@ -3054,16 +3156,18 @@ class ProfilePersonalInfoContactWidgetComponent {
     isLoading = true;
     baseUrl = '';
     headerIconClass = 'primary-icon-xl';
-    headerTextClass = 'fs-16 mt-2 text-secondary';
+    headerTextClass = 'mt-2 field-secondary-label-lg';
     headerDividerClass = 'flex-grow-1 ms-2';
     rowClass = 'row mt-4';
-    columnClass = 'col-md-4 col-6';
-    responsiveTopSpacingColumnClass = 'col-md-4 col-6 mt-md-0 mt-4';
+    columnClass = 'col-4';
+    responsiveTopSpacingColumnClass = 'col-6 mt-4';
     topSpacingBottomMdSpacingColumnClass = 'col-md-4 col-6 mt-4 mb-md-5';
     topSpacingBottomSpacingColumnClass = 'col-md-4 col-6 mt-4 mb-5';
     labelClass = 'field-secondary-label-sm';
     valueClass = 'fs-14 fw-medium text-ellipsis-one-line';
     emergencyContactLabelClass = 'fs-14 fw-semibold';
+    emergencyContactColumnClass = 'col-md-4 col-6';
+    emergencyContactResponsiveColumnClass = 'col-md-4 col-6 mt-md-0 mt-4';
     emptyStateContainerClass = 'd-flex flex-column justify-content-center align-items-center my-5';
     emptyStateTextClass = 'field-secondary-label-md';
     contactIcon = faPhone;
@@ -3097,11 +3201,11 @@ class ProfilePersonalInfoContactWidgetComponent {
         });
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: ProfilePersonalInfoContactWidgetComponent, deps: [{ token: HRSelfWidgetsService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: ProfilePersonalInfoContactWidgetComponent, isStandalone: true, selector: "hr-profile-personal-info-contact-widget", inputs: { baseUrl: "baseUrl", headerIconClass: "headerIconClass", headerTextClass: "headerTextClass", headerDividerClass: "headerDividerClass", rowClass: "rowClass", columnClass: "columnClass", responsiveTopSpacingColumnClass: "responsiveTopSpacingColumnClass", topSpacingBottomMdSpacingColumnClass: "topSpacingBottomMdSpacingColumnClass", topSpacingBottomSpacingColumnClass: "topSpacingBottomSpacingColumnClass", labelClass: "labelClass", valueClass: "valueClass", emergencyContactLabelClass: "emergencyContactLabelClass", emptyStateContainerClass: "emptyStateContainerClass", emptyStateTextClass: "emptyStateTextClass", contactIcon: "contactIcon", emergencyContactIcon: "emergencyContactIcon", sectionTitle: "sectionTitle", showEmergencyContact: "showEmergencyContact", emergencyContactRowClass: "emergencyContactRowClass" }, outputs: { isLoadingChanged: "isLoadingChanged", errorOccurred: "errorOccurred" }, ngImport: i0, template: "<sky-section-divider [fontAwesomeIcon]=\"contactIcon\"\r\n                     [text]=\"(sectionTitle | HRTranslate|uppercase)\"\r\n                     [iconClass]=\"headerIconClass\"\r\n                     [textClass]=\"headerTextClass\"\r\n                     [dividerClass]=\"headerDividerClass\">\r\n</sky-section-divider>\r\n\r\n@if(employeePersonalInfoContactDetails){\r\n<div [ngClass]=\"rowClass\">\r\n  <div [ngClass]=\"columnClass\">\r\n    <hr-info-field [labelKey]=\"'MobileNumber'\"\r\n                   [value]=\"employeePersonalInfoContactDetails.MobileNumber\"\r\n                   [labelClass]=\"labelClass\"\r\n                   [valueClass]=\"valueClass\">\r\n    </hr-info-field>\r\n  </div>\r\n  <div [ngClass]=\"columnClass\">\r\n    <hr-info-field [labelKey]=\"'HomePhone'\"\r\n                   [value]=\"employeePersonalInfoContactDetails.HomePhone\"\r\n                   [labelClass]=\"labelClass\"\r\n                   [valueClass]=\"valueClass\">\r\n    </hr-info-field>\r\n  </div>\r\n  \r\n  <div [ngClass]=\"responsiveTopSpacingColumnClass\">\r\n    <hr-info-field [labelKey]=\"'Email'\"\r\n                   [value]=\"employeePersonalInfoContactDetails.Email\"\r\n                   [labelClass]=\"labelClass\"\r\n                   [valueClass]=\"valueClass\">\r\n    </hr-info-field>\r\n  </div>\r\n</div>\r\n@if(showEmergencyContact)\r\n{\r\n<div [ngClass]=\"rowClass\">\r\n  <div class=\"col-12\">\r\n    <div [ngClass]=\"emergencyContactLabelClass\">\r\n      &#x2022; {{'EmergencyContact' | HRTranslate}}\r\n    </div>\r\n  </div>\r\n</div>\r\n<div [ngClass]=\"emergencyContactRowClass\">\r\n  <div [ngClass]=\"columnClass\">\r\n    <hr-info-field [labelKey]=\"'Name'\"\r\n                   [value]=\"employeePersonalInfoContactDetails.EmergencyContact?.Name || employeePersonalInfoContactDetails.EmergencyContactLegacy\"\r\n                   [labelClass]=\"labelClass\"\r\n                   [valueClass]=\"valueClass\">\r\n    </hr-info-field>\r\n  </div>\r\n  <div [ngClass]=\"columnClass\">\r\n    <hr-info-field [labelKey]=\"'Relation'\"\r\n                   [value]=\"employeePersonalInfoContactDetails.EmergencyContact?.Relation\"\r\n                   [labelClass]=\"labelClass\"\r\n                   [valueClass]=\"valueClass\">\r\n    </hr-info-field>\r\n  </div>\r\n  <div [ngClass]=\"responsiveTopSpacingColumnClass\">\r\n    <hr-info-field [labelKey]=\"'Phone'\"\r\n                   [value]=\"employeePersonalInfoContactDetails.EmergencyContact?.PhoneNumber\"\r\n                   [labelClass]=\"labelClass\"\r\n                   [valueClass]=\"valueClass\">\r\n    </hr-info-field>\r\n  </div>\r\n</div>\r\n}\r\n}@else{\r\n<sky-empty-design-card [containerClass]=\"emptyStateContainerClass\"\r\n                       [cardBodyClass]=\"''\"\r\n                       [cardBodyContainerClass]=\"''\"\r\n                       [visibleIcon]=\"false\"\r\n                       [visibleQuickAction]=\"false\"\r\n                       [emptyTextClass]=\"emptyStateTextClass\"\r\n                       [emptyText]=\"isLoading ? ((sectionTitle | HRTranslate) + ' ' + ('IsLoading' | HRTranslate)) : ('ThereIsNoContactYet' | HRTranslate)\">\r\n</sky-empty-design-card>\r\n}", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: i2$1.UpperCasePipe, name: "uppercase" }, { kind: "ngmodule", type: FontAwesomeModule }, { kind: "pipe", type: HRTranslatePipe, name: "HRTranslate" }, { kind: "component", type: SkySectionDividerComponent, selector: "sky-section-divider", inputs: ["text", "fontAwesomeIcon", "textClass", "dividerClass", "iconClass"] }, { kind: "component", type: SkyEmptyDesignCardComponent, selector: "sky-empty-design-card", inputs: ["emptyIcon", "emptyIconClass", "emptyText", "emptyTextClass", "actionTitle", "actionIcon", "actionDisabled", "textColor", "disabledTitleClass", "activeTitleClass", "disabledIconClass", "activeIconClass", "actionClass", "containerClass", "cardBodyClass", "cardBodyContainerClass", "visibleIcon", "visibleQuickAction"], outputs: ["onActionClick"] }, { kind: "component", type: HRInfoFieldComponent, selector: "hr-info-field", inputs: ["labelKey", "value", "labelClass", "valueClass", "fallbackValue"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: ProfilePersonalInfoContactWidgetComponent, isStandalone: true, selector: "hr-profile-personal-info-contact-widget", inputs: { baseUrl: "baseUrl", headerIconClass: "headerIconClass", headerTextClass: "headerTextClass", headerDividerClass: "headerDividerClass", rowClass: "rowClass", columnClass: "columnClass", responsiveTopSpacingColumnClass: "responsiveTopSpacingColumnClass", topSpacingBottomMdSpacingColumnClass: "topSpacingBottomMdSpacingColumnClass", topSpacingBottomSpacingColumnClass: "topSpacingBottomSpacingColumnClass", labelClass: "labelClass", valueClass: "valueClass", emergencyContactLabelClass: "emergencyContactLabelClass", emergencyContactColumnClass: "emergencyContactColumnClass", emergencyContactResponsiveColumnClass: "emergencyContactResponsiveColumnClass", emptyStateContainerClass: "emptyStateContainerClass", emptyStateTextClass: "emptyStateTextClass", contactIcon: "contactIcon", emergencyContactIcon: "emergencyContactIcon", sectionTitle: "sectionTitle", showEmergencyContact: "showEmergencyContact", emergencyContactRowClass: "emergencyContactRowClass" }, outputs: { isLoadingChanged: "isLoadingChanged", errorOccurred: "errorOccurred" }, ngImport: i0, template: "<sky-section-divider [fontAwesomeIcon]=\"contactIcon\"\r\n                     [text]=\"(sectionTitle | HRTranslate|uppercase)\"\r\n                     [iconClass]=\"headerIconClass\"\r\n                     [textClass]=\"headerTextClass\"\r\n                     [dividerClass]=\"headerDividerClass\">\r\n</sky-section-divider>\r\n\r\n@if(employeePersonalInfoContactDetails){\r\n<div [ngClass]=\"rowClass\">\r\n  <div [ngClass]=\"columnClass\">\r\n    <hr-info-field [labelKey]=\"'MobileNumber'\"\r\n                   [value]=\"employeePersonalInfoContactDetails.MobileNumber\"\r\n                   [labelClass]=\"labelClass\"\r\n                   [valueClass]=\"valueClass\">\r\n    </hr-info-field>\r\n    <div class=\"mt-4\">\r\n      <hr-info-field [labelKey]=\"'Email'\"\r\n                     [value]=\"employeePersonalInfoContactDetails.Email\"\r\n                     [labelClass]=\"labelClass\"\r\n                     [valueClass]=\"valueClass\">\r\n      </hr-info-field>\r\n    </div>\r\n  </div>\r\n  <div [ngClass]=\"columnClass\">\r\n    <hr-info-field [labelKey]=\"'HomePhone'\"\r\n                   [value]=\"employeePersonalInfoContactDetails.HomePhone\"\r\n                   [labelClass]=\"labelClass\"\r\n                   [valueClass]=\"valueClass\">\r\n    </hr-info-field>\r\n    <div class=\"mt-4\">\r\n      <hr-info-field [labelKey]=\"'BusinessEmail'\"\r\n                     [value]=\"employeePersonalInfoContactDetails.BusinessEmail\"\r\n                     [labelClass]=\"labelClass\"\r\n                     [valueClass]=\"valueClass\">\r\n      </hr-info-field>\r\n    </div>\r\n  </div>\r\n</div>\r\n@if(showEmergencyContact)\r\n{\r\n<div [ngClass]=\"rowClass\">\r\n  <div class=\"col-12\">\r\n    <div [ngClass]=\"emergencyContactLabelClass\">\r\n      &#x2022; {{'EmergencyContact' | HRTranslate}}\r\n    </div>\r\n  </div>\r\n</div>\r\n<div [ngClass]=\"emergencyContactRowClass\">\r\n  <div [ngClass]=\"emergencyContactColumnClass\">\r\n    <hr-info-field [labelKey]=\"'Name'\"\r\n                   [value]=\"employeePersonalInfoContactDetails.EmergencyContact?.Name || employeePersonalInfoContactDetails.EmergencyContactLegacy\"\r\n                   [labelClass]=\"labelClass\"\r\n                   [valueClass]=\"valueClass\">\r\n    </hr-info-field>\r\n  </div>\r\n  <div [ngClass]=\"emergencyContactColumnClass\">\r\n    <hr-info-field [labelKey]=\"'Relation'\"\r\n                   [value]=\"employeePersonalInfoContactDetails.EmergencyContact?.Relation\"\r\n                   [labelClass]=\"labelClass\"\r\n                   [valueClass]=\"valueClass\">\r\n    </hr-info-field>\r\n  </div>\r\n  <div [ngClass]=\"emergencyContactResponsiveColumnClass\">\r\n    <hr-info-field [labelKey]=\"'Phone'\"\r\n                   [value]=\"employeePersonalInfoContactDetails.EmergencyContact?.PhoneNumber\"\r\n                   [labelClass]=\"labelClass\"\r\n                   [valueClass]=\"valueClass\">\r\n    </hr-info-field>\r\n  </div>\r\n</div>\r\n}\r\n}@else{\r\n<sky-empty-design-card [containerClass]=\"emptyStateContainerClass\"\r\n                       [cardBodyClass]=\"''\"\r\n                       [cardBodyContainerClass]=\"''\"\r\n                       [visibleIcon]=\"false\"\r\n                       [visibleQuickAction]=\"false\"\r\n                       [emptyTextClass]=\"emptyStateTextClass\"\r\n                       [emptyText]=\"isLoading ? ((sectionTitle | HRTranslate) + ' ' + ('IsLoading' | HRTranslate)) : ('ThereIsNoContactYet' | HRTranslate)\">\r\n</sky-empty-design-card>\r\n}", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: i2$1.UpperCasePipe, name: "uppercase" }, { kind: "ngmodule", type: FontAwesomeModule }, { kind: "pipe", type: HRTranslatePipe, name: "HRTranslate" }, { kind: "component", type: SkySectionDividerComponent, selector: "sky-section-divider", inputs: ["text", "fontAwesomeIcon", "textClass", "dividerClass", "iconClass"] }, { kind: "component", type: SkyEmptyDesignCardComponent, selector: "sky-empty-design-card", inputs: ["emptyIcon", "emptyIconClass", "emptyText", "emptyTextClass", "actionTitle", "actionIcon", "actionDisabled", "textColor", "disabledTitleClass", "activeTitleClass", "disabledIconClass", "activeIconClass", "actionClass", "containerClass", "cardBodyClass", "cardBodyContainerClass", "visibleIcon", "visibleQuickAction"], outputs: ["onActionClick"] }, { kind: "component", type: HRInfoFieldComponent, selector: "hr-info-field", inputs: ["labelKey", "value", "labelClass", "valueClass", "fallbackValue"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: ProfilePersonalInfoContactWidgetComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'hr-profile-personal-info-contact-widget', standalone: true, imports: [CommonModule, FontAwesomeModule, HRTranslatePipe, SkySectionDividerComponent, SkyEmptyDesignCardComponent, HRInfoFieldComponent], template: "<sky-section-divider [fontAwesomeIcon]=\"contactIcon\"\r\n                     [text]=\"(sectionTitle | HRTranslate|uppercase)\"\r\n                     [iconClass]=\"headerIconClass\"\r\n                     [textClass]=\"headerTextClass\"\r\n                     [dividerClass]=\"headerDividerClass\">\r\n</sky-section-divider>\r\n\r\n@if(employeePersonalInfoContactDetails){\r\n<div [ngClass]=\"rowClass\">\r\n  <div [ngClass]=\"columnClass\">\r\n    <hr-info-field [labelKey]=\"'MobileNumber'\"\r\n                   [value]=\"employeePersonalInfoContactDetails.MobileNumber\"\r\n                   [labelClass]=\"labelClass\"\r\n                   [valueClass]=\"valueClass\">\r\n    </hr-info-field>\r\n  </div>\r\n  <div [ngClass]=\"columnClass\">\r\n    <hr-info-field [labelKey]=\"'HomePhone'\"\r\n                   [value]=\"employeePersonalInfoContactDetails.HomePhone\"\r\n                   [labelClass]=\"labelClass\"\r\n                   [valueClass]=\"valueClass\">\r\n    </hr-info-field>\r\n  </div>\r\n  \r\n  <div [ngClass]=\"responsiveTopSpacingColumnClass\">\r\n    <hr-info-field [labelKey]=\"'Email'\"\r\n                   [value]=\"employeePersonalInfoContactDetails.Email\"\r\n                   [labelClass]=\"labelClass\"\r\n                   [valueClass]=\"valueClass\">\r\n    </hr-info-field>\r\n  </div>\r\n</div>\r\n@if(showEmergencyContact)\r\n{\r\n<div [ngClass]=\"rowClass\">\r\n  <div class=\"col-12\">\r\n    <div [ngClass]=\"emergencyContactLabelClass\">\r\n      &#x2022; {{'EmergencyContact' | HRTranslate}}\r\n    </div>\r\n  </div>\r\n</div>\r\n<div [ngClass]=\"emergencyContactRowClass\">\r\n  <div [ngClass]=\"columnClass\">\r\n    <hr-info-field [labelKey]=\"'Name'\"\r\n                   [value]=\"employeePersonalInfoContactDetails.EmergencyContact?.Name || employeePersonalInfoContactDetails.EmergencyContactLegacy\"\r\n                   [labelClass]=\"labelClass\"\r\n                   [valueClass]=\"valueClass\">\r\n    </hr-info-field>\r\n  </div>\r\n  <div [ngClass]=\"columnClass\">\r\n    <hr-info-field [labelKey]=\"'Relation'\"\r\n                   [value]=\"employeePersonalInfoContactDetails.EmergencyContact?.Relation\"\r\n                   [labelClass]=\"labelClass\"\r\n                   [valueClass]=\"valueClass\">\r\n    </hr-info-field>\r\n  </div>\r\n  <div [ngClass]=\"responsiveTopSpacingColumnClass\">\r\n    <hr-info-field [labelKey]=\"'Phone'\"\r\n                   [value]=\"employeePersonalInfoContactDetails.EmergencyContact?.PhoneNumber\"\r\n                   [labelClass]=\"labelClass\"\r\n                   [valueClass]=\"valueClass\">\r\n    </hr-info-field>\r\n  </div>\r\n</div>\r\n}\r\n}@else{\r\n<sky-empty-design-card [containerClass]=\"emptyStateContainerClass\"\r\n                       [cardBodyClass]=\"''\"\r\n                       [cardBodyContainerClass]=\"''\"\r\n                       [visibleIcon]=\"false\"\r\n                       [visibleQuickAction]=\"false\"\r\n                       [emptyTextClass]=\"emptyStateTextClass\"\r\n                       [emptyText]=\"isLoading ? ((sectionTitle | HRTranslate) + ' ' + ('IsLoading' | HRTranslate)) : ('ThereIsNoContactYet' | HRTranslate)\">\r\n</sky-empty-design-card>\r\n}" }]
+            args: [{ selector: 'hr-profile-personal-info-contact-widget', standalone: true, imports: [CommonModule, FontAwesomeModule, HRTranslatePipe, SkySectionDividerComponent, SkyEmptyDesignCardComponent, HRInfoFieldComponent], template: "<sky-section-divider [fontAwesomeIcon]=\"contactIcon\"\r\n                     [text]=\"(sectionTitle | HRTranslate|uppercase)\"\r\n                     [iconClass]=\"headerIconClass\"\r\n                     [textClass]=\"headerTextClass\"\r\n                     [dividerClass]=\"headerDividerClass\">\r\n</sky-section-divider>\r\n\r\n@if(employeePersonalInfoContactDetails){\r\n<div [ngClass]=\"rowClass\">\r\n  <div [ngClass]=\"columnClass\">\r\n    <hr-info-field [labelKey]=\"'MobileNumber'\"\r\n                   [value]=\"employeePersonalInfoContactDetails.MobileNumber\"\r\n                   [labelClass]=\"labelClass\"\r\n                   [valueClass]=\"valueClass\">\r\n    </hr-info-field>\r\n    <div class=\"mt-4\">\r\n      <hr-info-field [labelKey]=\"'Email'\"\r\n                     [value]=\"employeePersonalInfoContactDetails.Email\"\r\n                     [labelClass]=\"labelClass\"\r\n                     [valueClass]=\"valueClass\">\r\n      </hr-info-field>\r\n    </div>\r\n  </div>\r\n  <div [ngClass]=\"columnClass\">\r\n    <hr-info-field [labelKey]=\"'HomePhone'\"\r\n                   [value]=\"employeePersonalInfoContactDetails.HomePhone\"\r\n                   [labelClass]=\"labelClass\"\r\n                   [valueClass]=\"valueClass\">\r\n    </hr-info-field>\r\n    <div class=\"mt-4\">\r\n      <hr-info-field [labelKey]=\"'BusinessEmail'\"\r\n                     [value]=\"employeePersonalInfoContactDetails.BusinessEmail\"\r\n                     [labelClass]=\"labelClass\"\r\n                     [valueClass]=\"valueClass\">\r\n      </hr-info-field>\r\n    </div>\r\n  </div>\r\n</div>\r\n@if(showEmergencyContact)\r\n{\r\n<div [ngClass]=\"rowClass\">\r\n  <div class=\"col-12\">\r\n    <div [ngClass]=\"emergencyContactLabelClass\">\r\n      &#x2022; {{'EmergencyContact' | HRTranslate}}\r\n    </div>\r\n  </div>\r\n</div>\r\n<div [ngClass]=\"emergencyContactRowClass\">\r\n  <div [ngClass]=\"emergencyContactColumnClass\">\r\n    <hr-info-field [labelKey]=\"'Name'\"\r\n                   [value]=\"employeePersonalInfoContactDetails.EmergencyContact?.Name || employeePersonalInfoContactDetails.EmergencyContactLegacy\"\r\n                   [labelClass]=\"labelClass\"\r\n                   [valueClass]=\"valueClass\">\r\n    </hr-info-field>\r\n  </div>\r\n  <div [ngClass]=\"emergencyContactColumnClass\">\r\n    <hr-info-field [labelKey]=\"'Relation'\"\r\n                   [value]=\"employeePersonalInfoContactDetails.EmergencyContact?.Relation\"\r\n                   [labelClass]=\"labelClass\"\r\n                   [valueClass]=\"valueClass\">\r\n    </hr-info-field>\r\n  </div>\r\n  <div [ngClass]=\"emergencyContactResponsiveColumnClass\">\r\n    <hr-info-field [labelKey]=\"'Phone'\"\r\n                   [value]=\"employeePersonalInfoContactDetails.EmergencyContact?.PhoneNumber\"\r\n                   [labelClass]=\"labelClass\"\r\n                   [valueClass]=\"valueClass\">\r\n    </hr-info-field>\r\n  </div>\r\n</div>\r\n}\r\n}@else{\r\n<sky-empty-design-card [containerClass]=\"emptyStateContainerClass\"\r\n                       [cardBodyClass]=\"''\"\r\n                       [cardBodyContainerClass]=\"''\"\r\n                       [visibleIcon]=\"false\"\r\n                       [visibleQuickAction]=\"false\"\r\n                       [emptyTextClass]=\"emptyStateTextClass\"\r\n                       [emptyText]=\"isLoading ? ((sectionTitle | HRTranslate) + ' ' + ('IsLoading' | HRTranslate)) : ('ThereIsNoContactYet' | HRTranslate)\">\r\n</sky-empty-design-card>\r\n}" }]
         }], ctorParameters: () => [{ type: HRSelfWidgetsService }], propDecorators: { baseUrl: [{
                 type: Input,
                 args: [{ required: true }]
@@ -3127,6 +3231,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
                 type: Input
             }], emergencyContactLabelClass: [{
                 type: Input
+            }], emergencyContactColumnClass: [{
+                type: Input
+            }], emergencyContactResponsiveColumnClass: [{
+                type: Input
             }], emptyStateContainerClass: [{
                 type: Input
             }], emptyStateTextClass: [{
@@ -4437,6 +4545,7 @@ class ProfileEntitlementsIndemnityWidgetComponent {
     emptyStateTextClass = 'field-secondary-label-md';
     isLoadingChanged = new EventEmitter();
     errorOccurred = new EventEmitter();
+    hasDataChanged = new EventEmitter();
     indemnityDetails = null;
     isLoading = true;
     constructor(selfWidgetsService) {
@@ -4455,18 +4564,20 @@ class ProfileEntitlementsIndemnityWidgetComponent {
             next: (data) => {
                 this.indemnityDetails = data;
                 this.isLoading = false;
+                this.hasDataChanged.emit(!!this.indemnityDetails);
                 this.isLoadingChanged.emit(false);
             },
             error: (error) => {
                 this.indemnityDetails = null;
                 this.isLoading = false;
+                this.hasDataChanged.emit(false);
                 this.errorOccurred.emit(error?.error?.ResponseData?.Errors?.[0]?.Message);
                 this.isLoadingChanged.emit(false);
             }
         });
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: ProfileEntitlementsIndemnityWidgetComponent, deps: [{ token: HRSelfWidgetsService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: ProfileEntitlementsIndemnityWidgetComponent, isStandalone: true, selector: "hr-profile-entitlements-indemnity-widget", inputs: { baseUrl: "baseUrl", currencyCode: "currencyCode", currencyDecimals: "currencyDecimals", sectionTitle: "sectionTitle", indemnityIcon: "indemnityIcon", headerIconClass: "headerIconClass", headerTextClass: "headerTextClass", headerDividerClass: "headerDividerClass", rowClass: "rowClass", columnClass: "columnClass", topSpacingColumnClass: "topSpacingColumnClass", labelClass: "labelClass", valueClass: "valueClass", dateFormat: "dateFormat", emptyStateContainerClass: "emptyStateContainerClass", emptyStateTextClass: "emptyStateTextClass" }, outputs: { isLoadingChanged: "isLoadingChanged", errorOccurred: "errorOccurred" }, ngImport: i0, template: "<sky-section-divider [fontAwesomeIcon]=\"indemnityIcon\"\r\n                     [text]=\"(sectionTitle | HRTranslate | uppercase)\"\r\n                     [iconClass]=\"headerIconClass\"\r\n                     [textClass]=\"headerTextClass\"\r\n                     [dividerClass]=\"headerDividerClass\">\r\n</sky-section-divider>\r\n\r\n@if(indemnityDetails){\r\n<div [class]=\"rowClass\">\r\n  <div [class]=\"columnClass\">\r\n    <hr-info-field labelKey=\"IndemnityEligibility\"\r\n                   [value]=\"(indemnityDetails.IsEligibleForIndemnity ? 'Eligible' : 'NotEligible') | HRTranslate\"\r\n                   [labelClass]=\"labelClass\"\r\n                   [valueClass]=\"valueClass\">\r\n    </hr-info-field>\r\n  </div>\r\n  <div [class]=\"columnClass\">\r\n    <hr-info-field labelKey=\"ServiceYears\"\r\n                   [value]=\"'' + (indemnityDetails.IndemnityServiceYears ?? '')\"\r\n                   [labelClass]=\"labelClass\"\r\n                   [valueClass]=\"valueClass\">\r\n    </hr-info-field>\r\n  </div>\r\n\r\n  <div [class]=\"topSpacingColumnClass\">\r\n    <hr-info-field labelKey=\"StartDate\"\r\n                   [value]=\"indemnityDetails.IndemnityStartDate | date: dateFormat\"\r\n                   [labelClass]=\"labelClass\"\r\n                   [valueClass]=\"valueClass\">\r\n    </hr-info-field>\r\n  </div>\r\n</div>\r\n}@else{\r\n<sky-empty-design-card [containerClass]=\"emptyStateContainerClass\"\r\n                       [cardBodyClass]=\"''\"\r\n                       [cardBodyContainerClass]=\"''\"\r\n                       [visibleIcon]=\"false\"\r\n                       [visibleQuickAction]=\"false\"\r\n                       [emptyTextClass]=\"emptyStateTextClass\"\r\n                       [emptyText]=\"isLoading ? ((sectionTitle | HRTranslate) + ' ' + ('IsLoading' | HRTranslate)) : ('There\\'sNoInformationInThisSectionYet' | HRTranslate)\">\r\n</sky-empty-design-card>\r\n}\r\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i2$1.UpperCasePipe, name: "uppercase" }, { kind: "pipe", type: i2$1.DatePipe, name: "date" }, { kind: "pipe", type: HRTranslatePipe, name: "HRTranslate" }, { kind: "component", type: SkySectionDividerComponent, selector: "sky-section-divider", inputs: ["text", "fontAwesomeIcon", "textClass", "dividerClass", "iconClass"] }, { kind: "component", type: SkyEmptyDesignCardComponent, selector: "sky-empty-design-card", inputs: ["emptyIcon", "emptyIconClass", "emptyText", "emptyTextClass", "actionTitle", "actionIcon", "actionDisabled", "textColor", "disabledTitleClass", "activeTitleClass", "disabledIconClass", "activeIconClass", "actionClass", "containerClass", "cardBodyClass", "cardBodyContainerClass", "visibleIcon", "visibleQuickAction"], outputs: ["onActionClick"] }, { kind: "component", type: HRInfoFieldComponent, selector: "hr-info-field", inputs: ["labelKey", "value", "labelClass", "valueClass", "fallbackValue"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: ProfileEntitlementsIndemnityWidgetComponent, isStandalone: true, selector: "hr-profile-entitlements-indemnity-widget", inputs: { baseUrl: "baseUrl", currencyCode: "currencyCode", currencyDecimals: "currencyDecimals", sectionTitle: "sectionTitle", indemnityIcon: "indemnityIcon", headerIconClass: "headerIconClass", headerTextClass: "headerTextClass", headerDividerClass: "headerDividerClass", rowClass: "rowClass", columnClass: "columnClass", topSpacingColumnClass: "topSpacingColumnClass", labelClass: "labelClass", valueClass: "valueClass", dateFormat: "dateFormat", emptyStateContainerClass: "emptyStateContainerClass", emptyStateTextClass: "emptyStateTextClass" }, outputs: { isLoadingChanged: "isLoadingChanged", errorOccurred: "errorOccurred", hasDataChanged: "hasDataChanged" }, ngImport: i0, template: "<sky-section-divider [fontAwesomeIcon]=\"indemnityIcon\"\r\n                     [text]=\"(sectionTitle | HRTranslate | uppercase)\"\r\n                     [iconClass]=\"headerIconClass\"\r\n                     [textClass]=\"headerTextClass\"\r\n                     [dividerClass]=\"headerDividerClass\">\r\n</sky-section-divider>\r\n\r\n@if(indemnityDetails){\r\n<div [class]=\"rowClass\">\r\n  <div [class]=\"columnClass\">\r\n    <hr-info-field labelKey=\"IndemnityEligibility\"\r\n                   [value]=\"(indemnityDetails.IsEligibleForIndemnity ? 'Eligible' : 'NotEligible') | HRTranslate\"\r\n                   [labelClass]=\"labelClass\"\r\n                   [valueClass]=\"valueClass\">\r\n    </hr-info-field>\r\n  </div>\r\n  <div [class]=\"columnClass\">\r\n    <hr-info-field labelKey=\"ServiceYears\"\r\n                   [value]=\"'' + (indemnityDetails.IndemnityServiceYears ?? '')\"\r\n                   [labelClass]=\"labelClass\"\r\n                   [valueClass]=\"valueClass\">\r\n    </hr-info-field>\r\n  </div>\r\n\r\n  <div [class]=\"topSpacingColumnClass\">\r\n    <hr-info-field labelKey=\"StartDate\"\r\n                   [value]=\"indemnityDetails.IndemnityStartDate | date: dateFormat\"\r\n                   [labelClass]=\"labelClass\"\r\n                   [valueClass]=\"valueClass\">\r\n    </hr-info-field>\r\n  </div>\r\n</div>\r\n}@else{\r\n<sky-empty-design-card [containerClass]=\"emptyStateContainerClass\"\r\n                       [cardBodyClass]=\"''\"\r\n                       [cardBodyContainerClass]=\"''\"\r\n                       [visibleIcon]=\"false\"\r\n                       [visibleQuickAction]=\"false\"\r\n                       [emptyTextClass]=\"emptyStateTextClass\"\r\n                       [emptyText]=\"isLoading ? ((sectionTitle | HRTranslate) + ' ' + ('IsLoading' | HRTranslate)) : ('There\\'sNoInformationInThisSectionYet' | HRTranslate)\">\r\n</sky-empty-design-card>\r\n}\r\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i2$1.UpperCasePipe, name: "uppercase" }, { kind: "pipe", type: i2$1.DatePipe, name: "date" }, { kind: "pipe", type: HRTranslatePipe, name: "HRTranslate" }, { kind: "component", type: SkySectionDividerComponent, selector: "sky-section-divider", inputs: ["text", "fontAwesomeIcon", "textClass", "dividerClass", "iconClass"] }, { kind: "component", type: SkyEmptyDesignCardComponent, selector: "sky-empty-design-card", inputs: ["emptyIcon", "emptyIconClass", "emptyText", "emptyTextClass", "actionTitle", "actionIcon", "actionDisabled", "textColor", "disabledTitleClass", "activeTitleClass", "disabledIconClass", "activeIconClass", "actionClass", "containerClass", "cardBodyClass", "cardBodyContainerClass", "visibleIcon", "visibleQuickAction"], outputs: ["onActionClick"] }, { kind: "component", type: HRInfoFieldComponent, selector: "hr-info-field", inputs: ["labelKey", "value", "labelClass", "valueClass", "fallbackValue"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: ProfileEntitlementsIndemnityWidgetComponent, decorators: [{
             type: Component,
@@ -4508,6 +4619,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
                 type: Output
             }], errorOccurred: [{
                 type: Output
+            }], hasDataChanged: [{
+                type: Output
             }] } });
 
 class HRTicketCardComponent {
@@ -4578,6 +4691,7 @@ class ProfileEntitlementsTicketWidgetComponent {
     errorOccurred = new EventEmitter();
     ticketDetails = null;
     isLoading = true;
+    hasData = true;
     constructor(selfWidgetsService, translatePipe) {
         this.selfWidgetsService = selfWidgetsService;
         this.translatePipe = translatePipe;
@@ -4595,11 +4709,13 @@ class ProfileEntitlementsTicketWidgetComponent {
             next: (data) => {
                 this.ticketDetails = data;
                 this.isLoading = false;
+                this.hasData = !!this.ticketDetails?.EmployeeTicketDetails || (this.ticketDetails?.DependentTicketDetails?.length ?? 0) > 0;
                 this.isLoadingChanged.emit(false);
             },
             error: (error) => {
                 this.ticketDetails = null;
                 this.isLoading = false;
+                this.hasData = false;
                 this.errorOccurred.emit(error?.error?.ResponseData?.Errors?.[0]?.Message);
                 this.isLoadingChanged.emit(false);
             }
@@ -4620,11 +4736,11 @@ class ProfileEntitlementsTicketWidgetComponent {
             return this.translatePipe.transform('NotEntitled');
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: ProfileEntitlementsTicketWidgetComponent, deps: [{ token: HRSelfWidgetsService }, { token: HRTranslatePipe }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: ProfileEntitlementsTicketWidgetComponent, isStandalone: true, selector: "hr-profile-entitlements-ticket-widget", inputs: { baseUrl: "baseUrl", sectionTitle: "sectionTitle", ticketsIcon: "ticketsIcon", headerIconClass: "headerIconClass", headerTextClass: "headerTextClass", headerDividerClass: "headerDividerClass", emptyStateContainerClass: "emptyStateContainerClass", emptyStateTextClass: "emptyStateTextClass", columnClass: "columnClass", cardHeight: "cardHeight", cardClass: "cardClass", nameClass: "nameClass", subtitleClass: "subtitleClass", labelClass: "labelClass", valueClass: "valueClass" }, outputs: { isLoadingChanged: "isLoadingChanged", errorOccurred: "errorOccurred" }, ngImport: i0, template: "<sky-section-divider [fontAwesomeIcon]=\"ticketsIcon\"\r\n                     [text]=\"(sectionTitle | HRTranslate | uppercase)\"\r\n                     [iconClass]=\"headerIconClass\"\r\n                     [textClass]=\"headerTextClass\"\r\n                     [dividerClass]=\"headerDividerClass\">\r\n</sky-section-divider>\r\n\r\n@if(ticketDetails){\r\n@if(!ticketDetails.EmployeeTicketDetails && ticketDetails.DependentTicketDetails?.length == 0){\r\n<sky-empty-design-card [containerClass]=\"emptyStateContainerClass\"\r\n                       [cardBodyClass]=\"''\"\r\n                       [cardBodyContainerClass]=\"''\"\r\n                       [visibleIcon]=\"false\"\r\n                       [visibleQuickAction]=\"false\"\r\n                       [emptyTextClass]=\"emptyStateTextClass\"\r\n                       [emptyText]=\"'NoTicketEntitlement' | HRTranslate\">\r\n</sky-empty-design-card>\r\n}@else{\r\n<div class=\"row mb-5\">\r\n  @if(ticketDetails.EmployeeTicketDetails){\r\n  <div [class]=\"columnClass\">\r\n    <hr-ticket-card [name]=\"ticketDetails.EmployeeTicketDetails.EmployeeFirstName\"\r\n                     [entitlementText]=\"getMonthsPerTicketEntitlement(ticketDetails.EmployeeTicketDetails.MonthsPerTicketEntitlement)\"\r\n                     [ticketClassName]=\"ticketDetails.EmployeeTicketDetails.TicketClassName\"\r\n                     [ticketSectorName]=\"ticketDetails.EmployeeTicketDetails.TicketSectorName\"\r\n                     [cardClass]=\"cardClass\"\r\n                     [cardHeight]=\"cardHeight\"\r\n                     [nameClass]=\"nameClass\"\r\n                     [subtitleClass]=\"subtitleClass\"\r\n                     [labelClass]=\"labelClass\"\r\n                     [valueClass]=\"valueClass\">\r\n    </hr-ticket-card>\r\n  </div>\r\n  }\r\n  @for (dependent of ticketDetails.DependentTicketDetails; track dependent;){\r\n  <div [class]=\"columnClass\">\r\n    <hr-ticket-card [name]=\"dependent.DependentName\"\r\n                     [typeName]=\"dependent.DependentTypeName\"\r\n                     [entitlementText]=\"getMonthsPerTicketEntitlement(dependent.MonthsPerTicketEntitlement)\"\r\n                     [isDependent]=\"true\"\r\n                     [cardClass]=\"cardClass\"\r\n                     [cardHeight]=\"cardHeight\"\r\n                     [nameClass]=\"nameClass\"\r\n                     [subtitleClass]=\"subtitleClass\">\r\n    </hr-ticket-card>\r\n  </div>\r\n  }\r\n</div>\r\n}\r\n}@else{\r\n<sky-empty-design-card [containerClass]=\"emptyStateContainerClass\"\r\n                       [cardBodyClass]=\"''\"\r\n                       [cardBodyContainerClass]=\"''\"\r\n                       [visibleIcon]=\"false\"\r\n                       [visibleQuickAction]=\"false\"\r\n                       [emptyTextClass]=\"emptyStateTextClass\"\r\n                       [emptyText]=\"isLoading ? ((sectionTitle | HRTranslate) + ' ' + ('IsLoading' | HRTranslate)) : ('NoTicketEntitlement' | HRTranslate)\">\r\n</sky-empty-design-card>\r\n}\r\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i2$1.UpperCasePipe, name: "uppercase" }, { kind: "pipe", type: HRTranslatePipe, name: "HRTranslate" }, { kind: "component", type: SkySectionDividerComponent, selector: "sky-section-divider", inputs: ["text", "fontAwesomeIcon", "textClass", "dividerClass", "iconClass"] }, { kind: "component", type: SkyEmptyDesignCardComponent, selector: "sky-empty-design-card", inputs: ["emptyIcon", "emptyIconClass", "emptyText", "emptyTextClass", "actionTitle", "actionIcon", "actionDisabled", "textColor", "disabledTitleClass", "activeTitleClass", "disabledIconClass", "activeIconClass", "actionClass", "containerClass", "cardBodyClass", "cardBodyContainerClass", "visibleIcon", "visibleQuickAction"], outputs: ["onActionClick"] }, { kind: "component", type: HRTicketCardComponent, selector: "hr-ticket-card", inputs: ["name", "typeName", "entitlementText", "ticketClassName", "ticketSectorName", "isDependent", "cardClass", "cardHeight", "nameClass", "subtitleClass", "labelClass", "valueClass"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: ProfileEntitlementsTicketWidgetComponent, isStandalone: true, selector: "hr-profile-entitlements-ticket-widget", inputs: { baseUrl: "baseUrl", sectionTitle: "sectionTitle", ticketsIcon: "ticketsIcon", headerIconClass: "headerIconClass", headerTextClass: "headerTextClass", headerDividerClass: "headerDividerClass", emptyStateContainerClass: "emptyStateContainerClass", emptyStateTextClass: "emptyStateTextClass", columnClass: "columnClass", cardHeight: "cardHeight", cardClass: "cardClass", nameClass: "nameClass", subtitleClass: "subtitleClass", labelClass: "labelClass", valueClass: "valueClass" }, outputs: { isLoadingChanged: "isLoadingChanged", errorOccurred: "errorOccurred" }, ngImport: i0, template: "@if(hasData){\r\n<sky-section-divider [fontAwesomeIcon]=\"ticketsIcon\"\r\n                     [text]=\"(sectionTitle | HRTranslate | uppercase)\"\r\n                     [iconClass]=\"headerIconClass\"\r\n                     [textClass]=\"headerTextClass\"\r\n                     [dividerClass]=\"headerDividerClass\">\r\n</sky-section-divider>\r\n\r\n@if(ticketDetails){\r\n@if(!ticketDetails.EmployeeTicketDetails && ticketDetails.DependentTicketDetails?.length == 0){\r\n<sky-empty-design-card [containerClass]=\"emptyStateContainerClass\"\r\n                       [cardBodyClass]=\"''\"\r\n                       [cardBodyContainerClass]=\"''\"\r\n                       [visibleIcon]=\"false\"\r\n                       [visibleQuickAction]=\"false\"\r\n                       [emptyTextClass]=\"emptyStateTextClass\"\r\n                       [emptyText]=\"'NoTicketEntitlement' | HRTranslate\">\r\n</sky-empty-design-card>\r\n}@else{\r\n<div class=\"row mb-5\">\r\n  @if(ticketDetails.EmployeeTicketDetails){\r\n  <div [class]=\"columnClass\" [style.height.px]=\"cardHeight\">\r\n    <hr-ticket-card [name]=\"ticketDetails.EmployeeTicketDetails.EmployeeFirstName\"\r\n                     [entitlementText]=\"getMonthsPerTicketEntitlement(ticketDetails.EmployeeTicketDetails.MonthsPerTicketEntitlement)\"\r\n                     [ticketClassName]=\"ticketDetails.EmployeeTicketDetails.TicketClassName\"\r\n                     [ticketSectorName]=\"ticketDetails.EmployeeTicketDetails.TicketSectorName\"\r\n                     [cardClass]=\"cardClass\"\r\n                     [cardHeight]=\"cardHeight\"\r\n                     [nameClass]=\"nameClass\"\r\n                     [subtitleClass]=\"subtitleClass\"\r\n                     [labelClass]=\"labelClass\"\r\n                     [valueClass]=\"valueClass\">\r\n    </hr-ticket-card>\r\n  </div>\r\n  }\r\n  @for (dependent of ticketDetails.DependentTicketDetails; track dependent;){\r\n  <div [class]=\"columnClass\" [style.height.px]=\"cardHeight\">\r\n    <hr-ticket-card [name]=\"dependent.DependentName\"\r\n                     [typeName]=\"dependent.DependentTypeName\"\r\n                     [entitlementText]=\"getMonthsPerTicketEntitlement(dependent.MonthsPerTicketEntitlement)\"\r\n                     [isDependent]=\"true\"\r\n                     [cardClass]=\"cardClass\"\r\n                     [cardHeight]=\"cardHeight\"\r\n                     [nameClass]=\"nameClass\"\r\n                     [subtitleClass]=\"subtitleClass\">\r\n    </hr-ticket-card>\r\n  </div>\r\n  }\r\n</div>\r\n}\r\n}@else{\r\n<sky-empty-design-card [containerClass]=\"emptyStateContainerClass\"\r\n                       [cardBodyClass]=\"''\"\r\n                       [cardBodyContainerClass]=\"''\"\r\n                       [visibleIcon]=\"false\"\r\n                       [visibleQuickAction]=\"false\"\r\n                       [emptyTextClass]=\"emptyStateTextClass\"\r\n                       [emptyText]=\"isLoading ? ((sectionTitle | HRTranslate) + ' ' + ('IsLoading' | HRTranslate)) : ('NoTicketEntitlement' | HRTranslate)\">\r\n</sky-empty-design-card>\r\n}\r\n}\r\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i2$1.UpperCasePipe, name: "uppercase" }, { kind: "pipe", type: HRTranslatePipe, name: "HRTranslate" }, { kind: "component", type: SkySectionDividerComponent, selector: "sky-section-divider", inputs: ["text", "fontAwesomeIcon", "textClass", "dividerClass", "iconClass"] }, { kind: "component", type: SkyEmptyDesignCardComponent, selector: "sky-empty-design-card", inputs: ["emptyIcon", "emptyIconClass", "emptyText", "emptyTextClass", "actionTitle", "actionIcon", "actionDisabled", "textColor", "disabledTitleClass", "activeTitleClass", "disabledIconClass", "activeIconClass", "actionClass", "containerClass", "cardBodyClass", "cardBodyContainerClass", "visibleIcon", "visibleQuickAction"], outputs: ["onActionClick"] }, { kind: "component", type: HRTicketCardComponent, selector: "hr-ticket-card", inputs: ["name", "typeName", "entitlementText", "ticketClassName", "ticketSectorName", "isDependent", "cardClass", "cardHeight", "nameClass", "subtitleClass", "labelClass", "valueClass"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: ProfileEntitlementsTicketWidgetComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'hr-profile-entitlements-ticket-widget', standalone: true, imports: [CommonModule, HRTranslatePipe, SkySectionDividerComponent, SkyEmptyDesignCardComponent, HRTicketCardComponent], template: "<sky-section-divider [fontAwesomeIcon]=\"ticketsIcon\"\r\n                     [text]=\"(sectionTitle | HRTranslate | uppercase)\"\r\n                     [iconClass]=\"headerIconClass\"\r\n                     [textClass]=\"headerTextClass\"\r\n                     [dividerClass]=\"headerDividerClass\">\r\n</sky-section-divider>\r\n\r\n@if(ticketDetails){\r\n@if(!ticketDetails.EmployeeTicketDetails && ticketDetails.DependentTicketDetails?.length == 0){\r\n<sky-empty-design-card [containerClass]=\"emptyStateContainerClass\"\r\n                       [cardBodyClass]=\"''\"\r\n                       [cardBodyContainerClass]=\"''\"\r\n                       [visibleIcon]=\"false\"\r\n                       [visibleQuickAction]=\"false\"\r\n                       [emptyTextClass]=\"emptyStateTextClass\"\r\n                       [emptyText]=\"'NoTicketEntitlement' | HRTranslate\">\r\n</sky-empty-design-card>\r\n}@else{\r\n<div class=\"row mb-5\">\r\n  @if(ticketDetails.EmployeeTicketDetails){\r\n  <div [class]=\"columnClass\">\r\n    <hr-ticket-card [name]=\"ticketDetails.EmployeeTicketDetails.EmployeeFirstName\"\r\n                     [entitlementText]=\"getMonthsPerTicketEntitlement(ticketDetails.EmployeeTicketDetails.MonthsPerTicketEntitlement)\"\r\n                     [ticketClassName]=\"ticketDetails.EmployeeTicketDetails.TicketClassName\"\r\n                     [ticketSectorName]=\"ticketDetails.EmployeeTicketDetails.TicketSectorName\"\r\n                     [cardClass]=\"cardClass\"\r\n                     [cardHeight]=\"cardHeight\"\r\n                     [nameClass]=\"nameClass\"\r\n                     [subtitleClass]=\"subtitleClass\"\r\n                     [labelClass]=\"labelClass\"\r\n                     [valueClass]=\"valueClass\">\r\n    </hr-ticket-card>\r\n  </div>\r\n  }\r\n  @for (dependent of ticketDetails.DependentTicketDetails; track dependent;){\r\n  <div [class]=\"columnClass\">\r\n    <hr-ticket-card [name]=\"dependent.DependentName\"\r\n                     [typeName]=\"dependent.DependentTypeName\"\r\n                     [entitlementText]=\"getMonthsPerTicketEntitlement(dependent.MonthsPerTicketEntitlement)\"\r\n                     [isDependent]=\"true\"\r\n                     [cardClass]=\"cardClass\"\r\n                     [cardHeight]=\"cardHeight\"\r\n                     [nameClass]=\"nameClass\"\r\n                     [subtitleClass]=\"subtitleClass\">\r\n    </hr-ticket-card>\r\n  </div>\r\n  }\r\n</div>\r\n}\r\n}@else{\r\n<sky-empty-design-card [containerClass]=\"emptyStateContainerClass\"\r\n                       [cardBodyClass]=\"''\"\r\n                       [cardBodyContainerClass]=\"''\"\r\n                       [visibleIcon]=\"false\"\r\n                       [visibleQuickAction]=\"false\"\r\n                       [emptyTextClass]=\"emptyStateTextClass\"\r\n                       [emptyText]=\"isLoading ? ((sectionTitle | HRTranslate) + ' ' + ('IsLoading' | HRTranslate)) : ('NoTicketEntitlement' | HRTranslate)\">\r\n</sky-empty-design-card>\r\n}\r\n" }]
+            args: [{ selector: 'hr-profile-entitlements-ticket-widget', standalone: true, imports: [CommonModule, HRTranslatePipe, SkySectionDividerComponent, SkyEmptyDesignCardComponent, HRTicketCardComponent], template: "@if(hasData){\r\n<sky-section-divider [fontAwesomeIcon]=\"ticketsIcon\"\r\n                     [text]=\"(sectionTitle | HRTranslate | uppercase)\"\r\n                     [iconClass]=\"headerIconClass\"\r\n                     [textClass]=\"headerTextClass\"\r\n                     [dividerClass]=\"headerDividerClass\">\r\n</sky-section-divider>\r\n\r\n@if(ticketDetails){\r\n@if(!ticketDetails.EmployeeTicketDetails && ticketDetails.DependentTicketDetails?.length == 0){\r\n<sky-empty-design-card [containerClass]=\"emptyStateContainerClass\"\r\n                       [cardBodyClass]=\"''\"\r\n                       [cardBodyContainerClass]=\"''\"\r\n                       [visibleIcon]=\"false\"\r\n                       [visibleQuickAction]=\"false\"\r\n                       [emptyTextClass]=\"emptyStateTextClass\"\r\n                       [emptyText]=\"'NoTicketEntitlement' | HRTranslate\">\r\n</sky-empty-design-card>\r\n}@else{\r\n<div class=\"row mb-5\">\r\n  @if(ticketDetails.EmployeeTicketDetails){\r\n  <div [class]=\"columnClass\" [style.height.px]=\"cardHeight\">\r\n    <hr-ticket-card [name]=\"ticketDetails.EmployeeTicketDetails.EmployeeFirstName\"\r\n                     [entitlementText]=\"getMonthsPerTicketEntitlement(ticketDetails.EmployeeTicketDetails.MonthsPerTicketEntitlement)\"\r\n                     [ticketClassName]=\"ticketDetails.EmployeeTicketDetails.TicketClassName\"\r\n                     [ticketSectorName]=\"ticketDetails.EmployeeTicketDetails.TicketSectorName\"\r\n                     [cardClass]=\"cardClass\"\r\n                     [cardHeight]=\"cardHeight\"\r\n                     [nameClass]=\"nameClass\"\r\n                     [subtitleClass]=\"subtitleClass\"\r\n                     [labelClass]=\"labelClass\"\r\n                     [valueClass]=\"valueClass\">\r\n    </hr-ticket-card>\r\n  </div>\r\n  }\r\n  @for (dependent of ticketDetails.DependentTicketDetails; track dependent;){\r\n  <div [class]=\"columnClass\" [style.height.px]=\"cardHeight\">\r\n    <hr-ticket-card [name]=\"dependent.DependentName\"\r\n                     [typeName]=\"dependent.DependentTypeName\"\r\n                     [entitlementText]=\"getMonthsPerTicketEntitlement(dependent.MonthsPerTicketEntitlement)\"\r\n                     [isDependent]=\"true\"\r\n                     [cardClass]=\"cardClass\"\r\n                     [cardHeight]=\"cardHeight\"\r\n                     [nameClass]=\"nameClass\"\r\n                     [subtitleClass]=\"subtitleClass\">\r\n    </hr-ticket-card>\r\n  </div>\r\n  }\r\n</div>\r\n}\r\n}@else{\r\n<sky-empty-design-card [containerClass]=\"emptyStateContainerClass\"\r\n                       [cardBodyClass]=\"''\"\r\n                       [cardBodyContainerClass]=\"''\"\r\n                       [visibleIcon]=\"false\"\r\n                       [visibleQuickAction]=\"false\"\r\n                       [emptyTextClass]=\"emptyStateTextClass\"\r\n                       [emptyText]=\"isLoading ? ((sectionTitle | HRTranslate) + ' ' + ('IsLoading' | HRTranslate)) : ('NoTicketEntitlement' | HRTranslate)\">\r\n</sky-empty-design-card>\r\n}\r\n}\r\n" }]
         }], ctorParameters: () => [{ type: HRSelfWidgetsService }, { type: HRTranslatePipe }], propDecorators: { baseUrl: [{
                 type: Input,
                 args: [{ required: true }]
@@ -4769,11 +4885,11 @@ class ProfileEntitlementsMedicalInsuranceWidgetComponent {
         ];
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: ProfileEntitlementsMedicalInsuranceWidgetComponent, deps: [{ token: HRSelfWidgetsService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: ProfileEntitlementsMedicalInsuranceWidgetComponent, isStandalone: true, selector: "hr-profile-entitlements-medical-insurance-widget", inputs: { baseUrl: "baseUrl", sectionTitle: "sectionTitle", medicalInsuranceIcon: "medicalInsuranceIcon", headerIconClass: "headerIconClass", headerTextClass: "headerTextClass", headerDividerClass: "headerDividerClass", labelClass: "labelClass", valueClass: "valueClass", columnClass: "columnClass", cardHeight: "cardHeight", cardClass: "cardClass", nameClass: "nameClass", dateFormat: "dateFormat", emptyStateContainerClass: "emptyStateContainerClass", emptyStateTextClass: "emptyStateTextClass" }, outputs: { isLoadingChanged: "isLoadingChanged", errorOccurred: "errorOccurred" }, ngImport: i0, template: "<sky-section-divider [fontAwesomeIcon]=\"medicalInsuranceIcon\"\r\n                     [text]=\"(sectionTitle | HRTranslate | uppercase)\"\r\n                     [iconClass]=\"headerIconClass\"\r\n                     [textClass]=\"headerTextClass\"\r\n                     [dividerClass]=\"headerDividerClass\">\r\n</sky-section-divider>\r\n\r\n@if(medicalInsuranceDetails){\r\n<div class=\"row mb-5\">\r\n  @if(medicalInsuranceDetails.EmployeeMedicalInsurance){\r\n  <div [class]=\"columnClass\">\r\n    <hr-medical-insurance-card [name]=\"medicalInsuranceDetails.EmployeeMedicalInsurance.EmployeeFirstName\"\r\n                                [fields]=\"employeeFields\"\r\n                                [cardClass]=\"cardClass\"\r\n                                [cardHeight]=\"cardHeight\"\r\n                                [nameClass]=\"nameClass\"\r\n                                [labelClass]=\"labelClass\"\r\n                                [valueClass]=\"valueClass\">\r\n    </hr-medical-insurance-card>\r\n  </div>\r\n  }\r\n  @for (dependent of medicalInsuranceDetails.DependentsMedicalInsurance; track dependent){\r\n  <div [class]=\"columnClass\">\r\n    <hr-medical-insurance-card [name]=\"dependent.DependentName\"\r\n                                [typeName]=\"dependent.DependentTypeName\"\r\n                                [isDependent]=\"true\"\r\n                                [fields]=\"getDependentFields(dependent)\"\r\n                                [cardClass]=\"cardClass\"\r\n                                [cardHeight]=\"cardHeight\"\r\n                                [nameClass]=\"nameClass\"\r\n                                [labelClass]=\"labelClass\"\r\n                                [valueClass]=\"valueClass\">\r\n    </hr-medical-insurance-card>\r\n  </div>\r\n  }\r\n</div>\r\n}@else{\r\n<sky-empty-design-card [containerClass]=\"emptyStateContainerClass\"\r\n                       [cardBodyClass]=\"''\"\r\n                       [cardBodyContainerClass]=\"''\"\r\n                       [visibleIcon]=\"false\"\r\n                       [visibleQuickAction]=\"false\"\r\n                       [emptyTextClass]=\"emptyStateTextClass\"\r\n                       [emptyText]=\"isLoading ? ((sectionTitle | HRTranslate) + ' ' + ('IsLoading' | HRTranslate)) : ('NotCoveredByMedicalInsurance' | HRTranslate)\">\r\n</sky-empty-design-card>\r\n}\r\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i2$1.UpperCasePipe, name: "uppercase" }, { kind: "pipe", type: HRTranslatePipe, name: "HRTranslate" }, { kind: "component", type: SkySectionDividerComponent, selector: "sky-section-divider", inputs: ["text", "fontAwesomeIcon", "textClass", "dividerClass", "iconClass"] }, { kind: "component", type: SkyEmptyDesignCardComponent, selector: "sky-empty-design-card", inputs: ["emptyIcon", "emptyIconClass", "emptyText", "emptyTextClass", "actionTitle", "actionIcon", "actionDisabled", "textColor", "disabledTitleClass", "activeTitleClass", "disabledIconClass", "activeIconClass", "actionClass", "containerClass", "cardBodyClass", "cardBodyContainerClass", "visibleIcon", "visibleQuickAction"], outputs: ["onActionClick"] }, { kind: "component", type: HRMedicalInsuranceCardComponent, selector: "hr-medical-insurance-card", inputs: ["name", "typeName", "isDependent", "fields", "cardClass", "cardHeight", "nameClass", "labelClass", "valueClass"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: ProfileEntitlementsMedicalInsuranceWidgetComponent, isStandalone: true, selector: "hr-profile-entitlements-medical-insurance-widget", inputs: { baseUrl: "baseUrl", sectionTitle: "sectionTitle", medicalInsuranceIcon: "medicalInsuranceIcon", headerIconClass: "headerIconClass", headerTextClass: "headerTextClass", headerDividerClass: "headerDividerClass", labelClass: "labelClass", valueClass: "valueClass", columnClass: "columnClass", cardHeight: "cardHeight", cardClass: "cardClass", nameClass: "nameClass", dateFormat: "dateFormat", emptyStateContainerClass: "emptyStateContainerClass", emptyStateTextClass: "emptyStateTextClass" }, outputs: { isLoadingChanged: "isLoadingChanged", errorOccurred: "errorOccurred" }, ngImport: i0, template: "<sky-section-divider [fontAwesomeIcon]=\"medicalInsuranceIcon\"\r\n                     [text]=\"(sectionTitle | HRTranslate | uppercase)\"\r\n                     [iconClass]=\"headerIconClass\"\r\n                     [textClass]=\"headerTextClass\"\r\n                     [dividerClass]=\"headerDividerClass\">\r\n</sky-section-divider>\r\n\r\n@if(medicalInsuranceDetails){\r\n<div class=\"row mb-5\">\r\n  @if(medicalInsuranceDetails.EmployeeMedicalInsurance){\r\n  <div [class]=\"columnClass\"  [style.height.px]=\"cardHeight\">\r\n    <hr-medical-insurance-card [name]=\"medicalInsuranceDetails.EmployeeMedicalInsurance.EmployeeFirstName\"\r\n                                [fields]=\"employeeFields\"\r\n                                [cardClass]=\"cardClass\"\r\n                                [cardHeight]=\"cardHeight\"\r\n                                [nameClass]=\"nameClass\"\r\n                                [labelClass]=\"labelClass\"\r\n                                [valueClass]=\"valueClass\">\r\n    </hr-medical-insurance-card>\r\n  </div>\r\n  }\r\n  @for (dependent of medicalInsuranceDetails.DependentsMedicalInsurance; track dependent){\r\n  <div [class]=\"columnClass\"  [style.height.px]=\"cardHeight\">\r\n    <hr-medical-insurance-card [name]=\"dependent.DependentName\"\r\n                                [typeName]=\"dependent.DependentTypeName\"\r\n                                [isDependent]=\"true\"\r\n                                [fields]=\"getDependentFields(dependent)\"\r\n                                [cardClass]=\"cardClass\"\r\n                                [cardHeight]=\"cardHeight\"\r\n                                [nameClass]=\"nameClass\"\r\n                                [labelClass]=\"labelClass\"\r\n                                [valueClass]=\"valueClass\">\r\n    </hr-medical-insurance-card>\r\n  </div>\r\n  }\r\n</div>\r\n}@else{\r\n<sky-empty-design-card [containerClass]=\"emptyStateContainerClass\"\r\n                       [cardBodyClass]=\"''\"\r\n                       [cardBodyContainerClass]=\"''\"\r\n                       [visibleIcon]=\"false\"\r\n                       [visibleQuickAction]=\"false\"\r\n                       [emptyTextClass]=\"emptyStateTextClass\"\r\n                       [emptyText]=\"isLoading ? ((sectionTitle | HRTranslate) + ' ' + ('IsLoading' | HRTranslate)) : ('NotCoveredByMedicalInsurance' | HRTranslate)\">\r\n</sky-empty-design-card>\r\n}\r\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i2$1.UpperCasePipe, name: "uppercase" }, { kind: "pipe", type: HRTranslatePipe, name: "HRTranslate" }, { kind: "component", type: SkySectionDividerComponent, selector: "sky-section-divider", inputs: ["text", "fontAwesomeIcon", "textClass", "dividerClass", "iconClass"] }, { kind: "component", type: SkyEmptyDesignCardComponent, selector: "sky-empty-design-card", inputs: ["emptyIcon", "emptyIconClass", "emptyText", "emptyTextClass", "actionTitle", "actionIcon", "actionDisabled", "textColor", "disabledTitleClass", "activeTitleClass", "disabledIconClass", "activeIconClass", "actionClass", "containerClass", "cardBodyClass", "cardBodyContainerClass", "visibleIcon", "visibleQuickAction"], outputs: ["onActionClick"] }, { kind: "component", type: HRMedicalInsuranceCardComponent, selector: "hr-medical-insurance-card", inputs: ["name", "typeName", "isDependent", "fields", "cardClass", "cardHeight", "nameClass", "labelClass", "valueClass"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: ProfileEntitlementsMedicalInsuranceWidgetComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'hr-profile-entitlements-medical-insurance-widget', standalone: true, imports: [CommonModule, HRTranslatePipe, SkySectionDividerComponent, SkyEmptyDesignCardComponent, HRMedicalInsuranceCardComponent], template: "<sky-section-divider [fontAwesomeIcon]=\"medicalInsuranceIcon\"\r\n                     [text]=\"(sectionTitle | HRTranslate | uppercase)\"\r\n                     [iconClass]=\"headerIconClass\"\r\n                     [textClass]=\"headerTextClass\"\r\n                     [dividerClass]=\"headerDividerClass\">\r\n</sky-section-divider>\r\n\r\n@if(medicalInsuranceDetails){\r\n<div class=\"row mb-5\">\r\n  @if(medicalInsuranceDetails.EmployeeMedicalInsurance){\r\n  <div [class]=\"columnClass\">\r\n    <hr-medical-insurance-card [name]=\"medicalInsuranceDetails.EmployeeMedicalInsurance.EmployeeFirstName\"\r\n                                [fields]=\"employeeFields\"\r\n                                [cardClass]=\"cardClass\"\r\n                                [cardHeight]=\"cardHeight\"\r\n                                [nameClass]=\"nameClass\"\r\n                                [labelClass]=\"labelClass\"\r\n                                [valueClass]=\"valueClass\">\r\n    </hr-medical-insurance-card>\r\n  </div>\r\n  }\r\n  @for (dependent of medicalInsuranceDetails.DependentsMedicalInsurance; track dependent){\r\n  <div [class]=\"columnClass\">\r\n    <hr-medical-insurance-card [name]=\"dependent.DependentName\"\r\n                                [typeName]=\"dependent.DependentTypeName\"\r\n                                [isDependent]=\"true\"\r\n                                [fields]=\"getDependentFields(dependent)\"\r\n                                [cardClass]=\"cardClass\"\r\n                                [cardHeight]=\"cardHeight\"\r\n                                [nameClass]=\"nameClass\"\r\n                                [labelClass]=\"labelClass\"\r\n                                [valueClass]=\"valueClass\">\r\n    </hr-medical-insurance-card>\r\n  </div>\r\n  }\r\n</div>\r\n}@else{\r\n<sky-empty-design-card [containerClass]=\"emptyStateContainerClass\"\r\n                       [cardBodyClass]=\"''\"\r\n                       [cardBodyContainerClass]=\"''\"\r\n                       [visibleIcon]=\"false\"\r\n                       [visibleQuickAction]=\"false\"\r\n                       [emptyTextClass]=\"emptyStateTextClass\"\r\n                       [emptyText]=\"isLoading ? ((sectionTitle | HRTranslate) + ' ' + ('IsLoading' | HRTranslate)) : ('NotCoveredByMedicalInsurance' | HRTranslate)\">\r\n</sky-empty-design-card>\r\n}\r\n" }]
+            args: [{ selector: 'hr-profile-entitlements-medical-insurance-widget', standalone: true, imports: [CommonModule, HRTranslatePipe, SkySectionDividerComponent, SkyEmptyDesignCardComponent, HRMedicalInsuranceCardComponent], template: "<sky-section-divider [fontAwesomeIcon]=\"medicalInsuranceIcon\"\r\n                     [text]=\"(sectionTitle | HRTranslate | uppercase)\"\r\n                     [iconClass]=\"headerIconClass\"\r\n                     [textClass]=\"headerTextClass\"\r\n                     [dividerClass]=\"headerDividerClass\">\r\n</sky-section-divider>\r\n\r\n@if(medicalInsuranceDetails){\r\n<div class=\"row mb-5\">\r\n  @if(medicalInsuranceDetails.EmployeeMedicalInsurance){\r\n  <div [class]=\"columnClass\"  [style.height.px]=\"cardHeight\">\r\n    <hr-medical-insurance-card [name]=\"medicalInsuranceDetails.EmployeeMedicalInsurance.EmployeeFirstName\"\r\n                                [fields]=\"employeeFields\"\r\n                                [cardClass]=\"cardClass\"\r\n                                [cardHeight]=\"cardHeight\"\r\n                                [nameClass]=\"nameClass\"\r\n                                [labelClass]=\"labelClass\"\r\n                                [valueClass]=\"valueClass\">\r\n    </hr-medical-insurance-card>\r\n  </div>\r\n  }\r\n  @for (dependent of medicalInsuranceDetails.DependentsMedicalInsurance; track dependent){\r\n  <div [class]=\"columnClass\"  [style.height.px]=\"cardHeight\">\r\n    <hr-medical-insurance-card [name]=\"dependent.DependentName\"\r\n                                [typeName]=\"dependent.DependentTypeName\"\r\n                                [isDependent]=\"true\"\r\n                                [fields]=\"getDependentFields(dependent)\"\r\n                                [cardClass]=\"cardClass\"\r\n                                [cardHeight]=\"cardHeight\"\r\n                                [nameClass]=\"nameClass\"\r\n                                [labelClass]=\"labelClass\"\r\n                                [valueClass]=\"valueClass\">\r\n    </hr-medical-insurance-card>\r\n  </div>\r\n  }\r\n</div>\r\n}@else{\r\n<sky-empty-design-card [containerClass]=\"emptyStateContainerClass\"\r\n                       [cardBodyClass]=\"''\"\r\n                       [cardBodyContainerClass]=\"''\"\r\n                       [visibleIcon]=\"false\"\r\n                       [visibleQuickAction]=\"false\"\r\n                       [emptyTextClass]=\"emptyStateTextClass\"\r\n                       [emptyText]=\"isLoading ? ((sectionTitle | HRTranslate) + ' ' + ('IsLoading' | HRTranslate)) : ('NotCoveredByMedicalInsurance' | HRTranslate)\">\r\n</sky-empty-design-card>\r\n}\r\n" }]
         }], ctorParameters: () => [{ type: HRSelfWidgetsService }], propDecorators: { baseUrl: [{
                 type: Input,
                 args: [{ required: true }]
@@ -4958,13 +5074,137 @@ class ProfileDependentsDocumentsWidgetComponent {
         this.attachmentDownloaded.emit(attachments);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: ProfileDependentsDocumentsWidgetComponent, deps: [{ token: HRSelfWidgetsService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: ProfileDependentsDocumentsWidgetComponent, isStandalone: true, selector: "hr-profile-dependents-documents-widget", inputs: { baseUrl: "baseUrl", sectionTitle: "sectionTitle", icon: "icon", viewIcon: "viewIcon", downloadIcon: "downloadIcon", headerIconClass: "headerIconClass", headerTextClass: "headerTextClass", headerDividerClass: "headerDividerClass", valueClass: "valueClass", viewIconClass: "viewIconClass", downloadIconClass: "downloadIconClass", emptyStateContainerClass: "emptyStateContainerClass", emptyStateTextClass: "emptyStateTextClass", cardClass: "cardClass", rowClass: "rowClass", rowPtClass: "rowPtClass", columnClass: "columnClass", responsiveTopSpacingColClass: "responsiveTopSpacingColClass", topSpacingColClass: "topSpacingColClass", labelClass: "labelClass", actionsColumnClass: "actionsColumnClass" }, outputs: { isLoadingChanged: "isLoadingChanged", attachmentViewed: "attachmentViewed", attachmentDownloaded: "attachmentDownloaded", errorOccurred: "errorOccurred" }, ngImport: i0, template: "<sky-section-divider [fontAwesomeIcon]=\"icon\"\r\n                     [text]=\"(sectionTitle | HRTranslate | uppercase)\"\r\n                     [iconClass]=\"headerIconClass\"\r\n                     [textClass]=\"headerTextClass\"\r\n                     [dividerClass]=\"headerDividerClass\">\r\n</sky-section-divider>\r\n\r\n<div class=\"mt-4\">\r\n\r\n  @if(groups.length) {\r\n\r\n  @for(group of groups; track group; let first = $first) {\r\n\r\n  <div [class]=\"cardClass\" [class.mt-3]=\"!first\">\r\n\r\n    <div class=\"px-3 pt-3\">\r\n      <span class=\"text-dark fs-16\" [title]=\"group.DependentName\">\r\n        {{ group.DependentName }}\r\n      </span>\r\n      <span class=\"text-dark fs-16 mx-1\">\r\n        ({{ group.DependentTypeName }})\r\n      </span>\r\n\r\n    </div>\r\n\r\n    @for(doc of group.Documents; track doc; let last = $last) {\r\n\r\n    <div [ngClass]=\"[rowClass, rowPtClass]\">\r\n\r\n      <div [class]=\"columnClass\">\r\n        <hr-info-field [labelKey]=\"'Type'\"\r\n                       [value]=\"doc.DocumentTypeName\"\r\n                       [labelClass]=\"labelClass\"\r\n                       [valueClass]=\"valueClass\">\r\n        </hr-info-field>\r\n      </div>\r\n\r\n      <div [class]=\"columnClass\">\r\n        <hr-info-field [labelKey]=\"'IssueDate'\"\r\n                       [value]=\"doc.IssueDate ? (doc.IssueDate | date:'dd/MM/yyyy') : '-'\"\r\n                       [labelClass]=\"labelClass\"\r\n                       [valueClass]=\"valueClass\">\r\n        </hr-info-field>\r\n      </div>\r\n\r\n      <div [class]=\"responsiveTopSpacingColClass\">\r\n        <hr-info-field [labelKey]=\"'ExpiryDate'\"\r\n                       [value]=\"doc.ExpiryDate ? (doc.ExpiryDate | date:'dd/MM/yyyy') : '-'\"\r\n                       [labelClass]=\"labelClass\"\r\n                       [valueClass]=\"valueClass\">\r\n        </hr-info-field>\r\n      </div>\r\n      @if(last) {\r\n      <div [class]=\"actionsColumnClass\">\r\n        @if(doc.Attachments?.length) {\r\n\r\n        @if(doc.Attachments.length === 1) {\r\n        <fa-icon [icon]=\"viewIcon\"\r\n                 [class]=\"viewIconClass\"\r\n                 (click)=\"onAttachmentView(doc)\">\r\n        </fa-icon>\r\n        }\r\n\r\n        <fa-icon [icon]=\"downloadIcon\"\r\n                 [class]=\"downloadIconClass\"\r\n                 (click)=\"onDownload(group)\">\r\n        </fa-icon>\r\n\r\n        }\r\n\r\n      </div>\r\n      }\r\n\r\n    </div>\r\n\r\n    }\r\n\r\n  </div>\r\n\r\n  }\r\n\r\n  } @else {\r\n\r\n  <sky-empty-design-card [visibleIcon]=\"false\"\r\n                         [visibleQuickAction]=\"false\"\r\n                         [containerClass]=\"emptyStateContainerClass\"\r\n                         [emptyTextClass]=\"emptyStateTextClass\"\r\n                         [emptyText]=\"isLoading ? ((sectionTitle | HRTranslate) + ' ' + ('IsLoading' | HRTranslate)) : ('ThereIsNoDependentsDocumentsYet' | HRTranslate)\">\r\n  </sky-empty-design-card>\r\n\r\n  }\r\n\r\n</div>\r\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: i2$1.UpperCasePipe, name: "uppercase" }, { kind: "pipe", type: i2$1.DatePipe, name: "date" }, { kind: "component", type: SkySectionDividerComponent, selector: "sky-section-divider", inputs: ["text", "fontAwesomeIcon", "textClass", "dividerClass", "iconClass"] }, { kind: "pipe", type: HRTranslatePipe, name: "HRTranslate" }, { kind: "component", type: SkyEmptyDesignCardComponent, selector: "sky-empty-design-card", inputs: ["emptyIcon", "emptyIconClass", "emptyText", "emptyTextClass", "actionTitle", "actionIcon", "actionDisabled", "textColor", "disabledTitleClass", "activeTitleClass", "disabledIconClass", "activeIconClass", "actionClass", "containerClass", "cardBodyClass", "cardBodyContainerClass", "visibleIcon", "visibleQuickAction"], outputs: ["onActionClick"] }, { kind: "ngmodule", type: FontAwesomeModule }, { kind: "component", type: i3.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "animation", "mask", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }, { kind: "component", type: HRInfoFieldComponent, selector: "hr-info-field", inputs: ["labelKey", "value", "labelClass", "valueClass", "fallbackValue"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: ProfileDependentsDocumentsWidgetComponent, isStandalone: true, selector: "hr-profile-dependents-documents-widget", inputs: { baseUrl: "baseUrl", sectionTitle: "sectionTitle", icon: "icon", viewIcon: "viewIcon", downloadIcon: "downloadIcon", headerIconClass: "headerIconClass", headerTextClass: "headerTextClass", headerDividerClass: "headerDividerClass", valueClass: "valueClass", viewIconClass: "viewIconClass", downloadIconClass: "downloadIconClass", emptyStateContainerClass: "emptyStateContainerClass", emptyStateTextClass: "emptyStateTextClass", cardClass: "cardClass", rowClass: "rowClass", rowPtClass: "rowPtClass", columnClass: "columnClass", responsiveTopSpacingColClass: "responsiveTopSpacingColClass", topSpacingColClass: "topSpacingColClass", labelClass: "labelClass", actionsColumnClass: "actionsColumnClass" }, outputs: { isLoadingChanged: "isLoadingChanged", attachmentViewed: "attachmentViewed", attachmentDownloaded: "attachmentDownloaded", errorOccurred: "errorOccurred" }, ngImport: i0, template: "<sky-section-divider [fontAwesomeIcon]=\"icon\"\r\n                     [text]=\"(sectionTitle | HRTranslate | uppercase)\"\r\n                     [iconClass]=\"headerIconClass\"\r\n                     [textClass]=\"headerTextClass\"\r\n                     [dividerClass]=\"headerDividerClass\">\r\n</sky-section-divider>\r\n\r\n<div class=\"mt-4\">\r\n\r\n  @if(groups.length) {\r\n\r\n  @for(group of groups; track group; let first = $first) {\r\n\r\n  <div [class]=\"cardClass\" [class.mt-3]=\"!first\">\r\n\r\n    <div class=\"px-3 pt-3\">\r\n      <span class=\"text-dark fs-16\" [title]=\"group.DependentName\">\r\n        {{ group.DependentName }}\r\n      </span>\r\n      <span class=\"text-dark fs-16 mx-1\">\r\n        ({{ group.DependentTypeName }})\r\n      </span>\r\n\r\n    </div>\r\n\r\n    @for(doc of group.Documents; track doc; let last = $last) {\r\n\r\n    <div [ngClass]=\"[rowClass, rowPtClass]\">\r\n\r\n      <div [class]=\"columnClass\">\r\n        <hr-info-field [labelKey]=\"'Type'\"\r\n                       [value]=\"doc.DocumentTypeName\"\r\n                       [labelClass]=\"labelClass\"\r\n                       [valueClass]=\"valueClass\">\r\n        </hr-info-field>\r\n      </div>\r\n\r\n      <div [class]=\"columnClass\">\r\n        <hr-info-field [labelKey]=\"'IssueDate'\"\r\n                       [value]=\"doc.IssueDate ? (doc.IssueDate | date:'dd/MM/yyyy') : '-'\"\r\n                       [labelClass]=\"labelClass\"\r\n                       [valueClass]=\"valueClass\">\r\n        </hr-info-field>\r\n      </div>\r\n\r\n      <div [class]=\"responsiveTopSpacingColClass\">\r\n        <hr-info-field [labelKey]=\"'ExpiryDate'\"\r\n                       [value]=\"doc.ExpiryDate ? (doc.ExpiryDate | date:'dd/MM/yyyy') : '-'\"\r\n                       [labelClass]=\"labelClass\"\r\n                       [valueClass]=\"valueClass\">\r\n        </hr-info-field>\r\n      </div>\r\n      @if(last) {\r\n      <div [class]=\"actionsColumnClass\">\r\n        @if(doc.Attachments?.length) {\r\n\r\n        @if(doc.Attachments.length === 1) {\r\n        <fa-icon [icon]=\"viewIcon\"\r\n                 [class]=\"viewIconClass\"\r\n                 (click)=\"onAttachmentView(doc)\">\r\n        </fa-icon>\r\n        }\r\n\r\n        <fa-icon [icon]=\"downloadIcon\"\r\n                 [class]=\"downloadIconClass\"\r\n                 (click)=\"onDownload(group)\">\r\n        </fa-icon>\r\n\r\n        }\r\n\r\n      </div>\r\n      }\r\n\r\n    </div>\r\n\r\n    }\r\n\r\n  </div>\r\n\r\n  }\r\n\r\n  } @else {\r\n\r\n  <sky-empty-design-card [visibleIcon]=\"false\"\r\n                         [visibleQuickAction]=\"false\"\r\n                         [containerClass]=\"emptyStateContainerClass\"\r\n                         [emptyTextClass]=\"emptyStateTextClass\"\r\n                         [emptyText]=\"isLoading ? ((sectionTitle | HRTranslate) + ' ' + ('IsLoading' | HRTranslate)) : ('ThereAreNoDependentsDocumentsYet' | HRTranslate)\">\r\n  </sky-empty-design-card>\r\n\r\n  }\r\n\r\n</div>\r\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: i2$1.UpperCasePipe, name: "uppercase" }, { kind: "pipe", type: i2$1.DatePipe, name: "date" }, { kind: "component", type: SkySectionDividerComponent, selector: "sky-section-divider", inputs: ["text", "fontAwesomeIcon", "textClass", "dividerClass", "iconClass"] }, { kind: "pipe", type: HRTranslatePipe, name: "HRTranslate" }, { kind: "component", type: SkyEmptyDesignCardComponent, selector: "sky-empty-design-card", inputs: ["emptyIcon", "emptyIconClass", "emptyText", "emptyTextClass", "actionTitle", "actionIcon", "actionDisabled", "textColor", "disabledTitleClass", "activeTitleClass", "disabledIconClass", "activeIconClass", "actionClass", "containerClass", "cardBodyClass", "cardBodyContainerClass", "visibleIcon", "visibleQuickAction"], outputs: ["onActionClick"] }, { kind: "ngmodule", type: FontAwesomeModule }, { kind: "component", type: i3.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "animation", "mask", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }, { kind: "component", type: HRInfoFieldComponent, selector: "hr-info-field", inputs: ["labelKey", "value", "labelClass", "valueClass", "fallbackValue"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: ProfileDependentsDocumentsWidgetComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'hr-profile-dependents-documents-widget', standalone: true, imports: [CommonModule, SkySectionDividerComponent, HRTranslatePipe, SkyEmptyDesignCardComponent, FontAwesomeModule, HRInfoFieldComponent], template: "<sky-section-divider [fontAwesomeIcon]=\"icon\"\r\n                     [text]=\"(sectionTitle | HRTranslate | uppercase)\"\r\n                     [iconClass]=\"headerIconClass\"\r\n                     [textClass]=\"headerTextClass\"\r\n                     [dividerClass]=\"headerDividerClass\">\r\n</sky-section-divider>\r\n\r\n<div class=\"mt-4\">\r\n\r\n  @if(groups.length) {\r\n\r\n  @for(group of groups; track group; let first = $first) {\r\n\r\n  <div [class]=\"cardClass\" [class.mt-3]=\"!first\">\r\n\r\n    <div class=\"px-3 pt-3\">\r\n      <span class=\"text-dark fs-16\" [title]=\"group.DependentName\">\r\n        {{ group.DependentName }}\r\n      </span>\r\n      <span class=\"text-dark fs-16 mx-1\">\r\n        ({{ group.DependentTypeName }})\r\n      </span>\r\n\r\n    </div>\r\n\r\n    @for(doc of group.Documents; track doc; let last = $last) {\r\n\r\n    <div [ngClass]=\"[rowClass, rowPtClass]\">\r\n\r\n      <div [class]=\"columnClass\">\r\n        <hr-info-field [labelKey]=\"'Type'\"\r\n                       [value]=\"doc.DocumentTypeName\"\r\n                       [labelClass]=\"labelClass\"\r\n                       [valueClass]=\"valueClass\">\r\n        </hr-info-field>\r\n      </div>\r\n\r\n      <div [class]=\"columnClass\">\r\n        <hr-info-field [labelKey]=\"'IssueDate'\"\r\n                       [value]=\"doc.IssueDate ? (doc.IssueDate | date:'dd/MM/yyyy') : '-'\"\r\n                       [labelClass]=\"labelClass\"\r\n                       [valueClass]=\"valueClass\">\r\n        </hr-info-field>\r\n      </div>\r\n\r\n      <div [class]=\"responsiveTopSpacingColClass\">\r\n        <hr-info-field [labelKey]=\"'ExpiryDate'\"\r\n                       [value]=\"doc.ExpiryDate ? (doc.ExpiryDate | date:'dd/MM/yyyy') : '-'\"\r\n                       [labelClass]=\"labelClass\"\r\n                       [valueClass]=\"valueClass\">\r\n        </hr-info-field>\r\n      </div>\r\n      @if(last) {\r\n      <div [class]=\"actionsColumnClass\">\r\n        @if(doc.Attachments?.length) {\r\n\r\n        @if(doc.Attachments.length === 1) {\r\n        <fa-icon [icon]=\"viewIcon\"\r\n                 [class]=\"viewIconClass\"\r\n                 (click)=\"onAttachmentView(doc)\">\r\n        </fa-icon>\r\n        }\r\n\r\n        <fa-icon [icon]=\"downloadIcon\"\r\n                 [class]=\"downloadIconClass\"\r\n                 (click)=\"onDownload(group)\">\r\n        </fa-icon>\r\n\r\n        }\r\n\r\n      </div>\r\n      }\r\n\r\n    </div>\r\n\r\n    }\r\n\r\n  </div>\r\n\r\n  }\r\n\r\n  } @else {\r\n\r\n  <sky-empty-design-card [visibleIcon]=\"false\"\r\n                         [visibleQuickAction]=\"false\"\r\n                         [containerClass]=\"emptyStateContainerClass\"\r\n                         [emptyTextClass]=\"emptyStateTextClass\"\r\n                         [emptyText]=\"isLoading ? ((sectionTitle | HRTranslate) + ' ' + ('IsLoading' | HRTranslate)) : ('ThereIsNoDependentsDocumentsYet' | HRTranslate)\">\r\n  </sky-empty-design-card>\r\n\r\n  }\r\n\r\n</div>\r\n" }]
+            args: [{ selector: 'hr-profile-dependents-documents-widget', standalone: true, imports: [CommonModule, SkySectionDividerComponent, HRTranslatePipe, SkyEmptyDesignCardComponent, FontAwesomeModule, HRInfoFieldComponent], template: "<sky-section-divider [fontAwesomeIcon]=\"icon\"\r\n                     [text]=\"(sectionTitle | HRTranslate | uppercase)\"\r\n                     [iconClass]=\"headerIconClass\"\r\n                     [textClass]=\"headerTextClass\"\r\n                     [dividerClass]=\"headerDividerClass\">\r\n</sky-section-divider>\r\n\r\n<div class=\"mt-4\">\r\n\r\n  @if(groups.length) {\r\n\r\n  @for(group of groups; track group; let first = $first) {\r\n\r\n  <div [class]=\"cardClass\" [class.mt-3]=\"!first\">\r\n\r\n    <div class=\"px-3 pt-3\">\r\n      <span class=\"text-dark fs-16\" [title]=\"group.DependentName\">\r\n        {{ group.DependentName }}\r\n      </span>\r\n      <span class=\"text-dark fs-16 mx-1\">\r\n        ({{ group.DependentTypeName }})\r\n      </span>\r\n\r\n    </div>\r\n\r\n    @for(doc of group.Documents; track doc; let last = $last) {\r\n\r\n    <div [ngClass]=\"[rowClass, rowPtClass]\">\r\n\r\n      <div [class]=\"columnClass\">\r\n        <hr-info-field [labelKey]=\"'Type'\"\r\n                       [value]=\"doc.DocumentTypeName\"\r\n                       [labelClass]=\"labelClass\"\r\n                       [valueClass]=\"valueClass\">\r\n        </hr-info-field>\r\n      </div>\r\n\r\n      <div [class]=\"columnClass\">\r\n        <hr-info-field [labelKey]=\"'IssueDate'\"\r\n                       [value]=\"doc.IssueDate ? (doc.IssueDate | date:'dd/MM/yyyy') : '-'\"\r\n                       [labelClass]=\"labelClass\"\r\n                       [valueClass]=\"valueClass\">\r\n        </hr-info-field>\r\n      </div>\r\n\r\n      <div [class]=\"responsiveTopSpacingColClass\">\r\n        <hr-info-field [labelKey]=\"'ExpiryDate'\"\r\n                       [value]=\"doc.ExpiryDate ? (doc.ExpiryDate | date:'dd/MM/yyyy') : '-'\"\r\n                       [labelClass]=\"labelClass\"\r\n                       [valueClass]=\"valueClass\">\r\n        </hr-info-field>\r\n      </div>\r\n      @if(last) {\r\n      <div [class]=\"actionsColumnClass\">\r\n        @if(doc.Attachments?.length) {\r\n\r\n        @if(doc.Attachments.length === 1) {\r\n        <fa-icon [icon]=\"viewIcon\"\r\n                 [class]=\"viewIconClass\"\r\n                 (click)=\"onAttachmentView(doc)\">\r\n        </fa-icon>\r\n        }\r\n\r\n        <fa-icon [icon]=\"downloadIcon\"\r\n                 [class]=\"downloadIconClass\"\r\n                 (click)=\"onDownload(group)\">\r\n        </fa-icon>\r\n\r\n        }\r\n\r\n      </div>\r\n      }\r\n\r\n    </div>\r\n\r\n    }\r\n\r\n  </div>\r\n\r\n  }\r\n\r\n  } @else {\r\n\r\n  <sky-empty-design-card [visibleIcon]=\"false\"\r\n                         [visibleQuickAction]=\"false\"\r\n                         [containerClass]=\"emptyStateContainerClass\"\r\n                         [emptyTextClass]=\"emptyStateTextClass\"\r\n                         [emptyText]=\"isLoading ? ((sectionTitle | HRTranslate) + ' ' + ('IsLoading' | HRTranslate)) : ('ThereAreNoDependentsDocumentsYet' | HRTranslate)\">\r\n  </sky-empty-design-card>\r\n\r\n  }\r\n\r\n</div>\r\n" }]
+        }], ctorParameters: () => [{ type: HRSelfWidgetsService }], propDecorators: { baseUrl: [{
+                type: Input
+            }], sectionTitle: [{
+                type: Input
+            }], icon: [{
+                type: Input
+            }], viewIcon: [{
+                type: Input
+            }], downloadIcon: [{
+                type: Input
+            }], headerIconClass: [{
+                type: Input
+            }], headerTextClass: [{
+                type: Input
+            }], headerDividerClass: [{
+                type: Input
+            }], valueClass: [{
+                type: Input
+            }], viewIconClass: [{
+                type: Input
+            }], downloadIconClass: [{
+                type: Input
+            }], emptyStateContainerClass: [{
+                type: Input
+            }], emptyStateTextClass: [{
+                type: Input
+            }], cardClass: [{
+                type: Input
+            }], rowClass: [{
+                type: Input
+            }], rowPtClass: [{
+                type: Input
+            }], columnClass: [{
+                type: Input
+            }], responsiveTopSpacingColClass: [{
+                type: Input
+            }], topSpacingColClass: [{
+                type: Input
+            }], labelClass: [{
+                type: Input
+            }], actionsColumnClass: [{
+                type: Input
+            }], isLoadingChanged: [{
+                type: Output
+            }], attachmentViewed: [{
+                type: Output
+            }], attachmentDownloaded: [{
+                type: Output
+            }], errorOccurred: [{
+                type: Output
+            }] } });
+
+class ProfilePersonalDocumentsWidgetComponent {
+    service;
+    documents = [];
+    isLoading = true;
+    baseUrl = '';
+    employeeName = '';
+    sectionTitle = 'PersonalDocuments';
+    icon = faFileLines;
+    viewIcon = faEye;
+    downloadIcon = faFolderArrowDown;
+    headerIconClass = 'primary-icon-xl';
+    headerTextClass = 'fs-16 mt-2 text-secondary';
+    headerDividerClass = 'flex-grow-1 ms-2';
+    valueClass = 'text-dark-gray fs-14';
+    viewIconClass = 'fs-15 text-dark cursor-pointer';
+    downloadIconClass = 'fs-15 mx-3 text-dark cursor-pointer';
+    emptyStateContainerClass = 'd-flex flex-column justify-content-center align-items-center my-5';
+    emptyStateTextClass = 'field-secondary-label-md';
+    cardClass = 'mt-4 card-shadow position-relative';
+    rowClass = 'row px-4 pb-3';
+    rowPtClass = 'pt-3';
+    columnClass = 'col-md-3 col-6';
+    responsiveTopSpacingColClass = 'col-md-3 col-6 mt-md-0 mt-4';
+    topSpacingColClass = 'col-md-3 col-6 mt-4';
+    labelClass = 'field-secondary-label-sm mb-1';
+    actionsColumnClass = 'col-2 align-items-end mt-3';
+    isLoadingChanged = new EventEmitter();
+    attachmentViewed = new EventEmitter();
+    attachmentDownloaded = new EventEmitter();
+    errorOccurred = new EventEmitter();
+    constructor(service) {
+        this.service = service;
+    }
+    ngOnInit() {
+        if (!this.baseUrl) {
+            this.isLoading = false;
+            return;
+        }
+        this.isLoadingChanged.emit(true);
+        this.service.getPersonalDocuments(this.baseUrl).subscribe({
+            next: (res) => {
+                this.documents = res ?? [];
+                this.isLoading = false;
+                this.isLoadingChanged.emit(false);
+            },
+            error: (error) => {
+                this.documents = [];
+                this.isLoading = false;
+                this.errorOccurred.emit(error.error.ResponseData.Errors[0].Message);
+                this.isLoadingChanged.emit(false);
+            }
+        });
+    }
+    onAttachmentView(doc) {
+        if (doc.Attachments?.length) {
+            this.attachmentViewed.emit(doc.Attachments[0]);
+        }
+    }
+    onDownload(doc) {
+        const attachments = doc.Attachments ?? [];
+        if (!attachments.length)
+            return;
+        this.attachmentDownloaded.emit(attachments);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: ProfilePersonalDocumentsWidgetComponent, deps: [{ token: HRSelfWidgetsService }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: ProfilePersonalDocumentsWidgetComponent, isStandalone: true, selector: "hr-profile-personal-documents-widget", inputs: { baseUrl: "baseUrl", employeeName: "employeeName", sectionTitle: "sectionTitle", icon: "icon", viewIcon: "viewIcon", downloadIcon: "downloadIcon", headerIconClass: "headerIconClass", headerTextClass: "headerTextClass", headerDividerClass: "headerDividerClass", valueClass: "valueClass", viewIconClass: "viewIconClass", downloadIconClass: "downloadIconClass", emptyStateContainerClass: "emptyStateContainerClass", emptyStateTextClass: "emptyStateTextClass", cardClass: "cardClass", rowClass: "rowClass", rowPtClass: "rowPtClass", columnClass: "columnClass", responsiveTopSpacingColClass: "responsiveTopSpacingColClass", topSpacingColClass: "topSpacingColClass", labelClass: "labelClass", actionsColumnClass: "actionsColumnClass" }, outputs: { isLoadingChanged: "isLoadingChanged", attachmentViewed: "attachmentViewed", attachmentDownloaded: "attachmentDownloaded", errorOccurred: "errorOccurred" }, ngImport: i0, template: "<sky-section-divider [fontAwesomeIcon]=\"icon\"\r\n                     [text]=\"(sectionTitle | HRTranslate | uppercase)\"\r\n                     [iconClass]=\"headerIconClass\"\r\n                     [textClass]=\"headerTextClass\"\r\n                     [dividerClass]=\"headerDividerClass\">\r\n</sky-section-divider>\r\n\r\n<div class=\"mt-4\">\r\n  @if(documents.length) {\r\n  <div [class]=\"cardClass\">\r\n    <div class=\"px-3 pt-3\">\r\n      <span class=\"text-dark fs-16\">\r\n        {{ employeeName }}\r\n      </span>\r\n      <span class=\"text-dark fs-16 mx-1\">\r\n        ({{ 'Me' | HRTranslate }})\r\n      </span>\r\n    </div>\r\n    @for(doc of documents; track doc; let last = $last) {\r\n    <div [ngClass]=\"[rowClass, rowPtClass]\">\r\n      <div [class]=\"columnClass\" [title]=\"doc.DocumentTypeName\">\r\n        <hr-info-field [labelKey]=\"'Type'\"\r\n                       [value]=\"doc.DocumentTypeName\"\r\n                       [labelClass]=\"labelClass\"\r\n                       [valueClass]=\"valueClass\">\r\n        </hr-info-field>\r\n      </div>\r\n      <div [class]=\"columnClass\" [title]=\"doc.DocumentNumber\">\r\n        <hr-info-field [labelKey]=\"'DocumentNumber'\"\r\n                       [value]=\"doc.DocumentNumber || '-'\"\r\n                       [labelClass]=\"labelClass\"\r\n                       [valueClass]=\"valueClass\">\r\n        </hr-info-field>\r\n      </div>\r\n      <div [class]=\"responsiveTopSpacingColClass\" [title]=\"doc.IssueDate\">\r\n        <hr-info-field [labelKey]=\"'IssueDate'\"\r\n                       [value]=\"doc.IssueDate ? (doc.IssueDate | date:'dd/MM/yyyy') : '-'\"\r\n                       [labelClass]=\"labelClass\"\r\n                       [valueClass]=\"valueClass\">\r\n        </hr-info-field>\r\n      </div>\r\n      <div [class]=\"responsiveTopSpacingColClass\" [title]=\"doc.ExpiryDate\">\r\n        <hr-info-field [labelKey]=\"'ExpiryDate'\"\r\n                       [value]=\"doc.ExpiryDate ? (doc.ExpiryDate | date:'dd/MM/yyyy') : '-'\"\r\n                       [labelClass]=\"labelClass\"\r\n                       [valueClass]=\"valueClass\">\r\n        </hr-info-field>\r\n      </div>\r\n      @if(last) {\r\n      <div [class]=\"actionsColumnClass\">\r\n        @if(doc.Attachments?.length) {\r\n        @if(doc.Attachments.length === 1) {\r\n        <fa-icon [icon]=\"viewIcon\"\r\n                 [class]=\"viewIconClass\"\r\n                 (click)=\"onAttachmentView(doc)\">\r\n        </fa-icon>\r\n        }\r\n        <fa-icon [icon]=\"downloadIcon\"\r\n                 [class]=\"downloadIconClass\"\r\n                 (click)=\"onDownload(doc)\">\r\n        </fa-icon>\r\n        }\r\n      </div>\r\n      }\r\n    </div>\r\n    }\r\n  </div>\r\n  } @else {\r\n  <sky-empty-design-card [visibleIcon]=\"false\"\r\n                         [visibleQuickAction]=\"false\"\r\n                         [containerClass]=\"emptyStateContainerClass\"\r\n                         [emptyTextClass]=\"emptyStateTextClass\"\r\n                         [emptyText]=\"isLoading ? ((sectionTitle | HRTranslate) + ' ' + ('IsLoading' | HRTranslate)) : ('ThereAreNoPersonalDocumentsYet' | HRTranslate)\">\r\n  </sky-empty-design-card>\r\n  }\r\n</div>\r\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: i2$1.UpperCasePipe, name: "uppercase" }, { kind: "pipe", type: i2$1.DatePipe, name: "date" }, { kind: "component", type: SkySectionDividerComponent, selector: "sky-section-divider", inputs: ["text", "fontAwesomeIcon", "textClass", "dividerClass", "iconClass"] }, { kind: "pipe", type: HRTranslatePipe, name: "HRTranslate" }, { kind: "component", type: SkyEmptyDesignCardComponent, selector: "sky-empty-design-card", inputs: ["emptyIcon", "emptyIconClass", "emptyText", "emptyTextClass", "actionTitle", "actionIcon", "actionDisabled", "textColor", "disabledTitleClass", "activeTitleClass", "disabledIconClass", "activeIconClass", "actionClass", "containerClass", "cardBodyClass", "cardBodyContainerClass", "visibleIcon", "visibleQuickAction"], outputs: ["onActionClick"] }, { kind: "ngmodule", type: FontAwesomeModule }, { kind: "component", type: i3.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "animation", "mask", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }, { kind: "component", type: HRInfoFieldComponent, selector: "hr-info-field", inputs: ["labelKey", "value", "labelClass", "valueClass", "fallbackValue"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: ProfilePersonalDocumentsWidgetComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'hr-profile-personal-documents-widget', standalone: true, imports: [CommonModule, SkySectionDividerComponent, HRTranslatePipe, SkyEmptyDesignCardComponent, FontAwesomeModule, HRInfoFieldComponent], template: "<sky-section-divider [fontAwesomeIcon]=\"icon\"\r\n                     [text]=\"(sectionTitle | HRTranslate | uppercase)\"\r\n                     [iconClass]=\"headerIconClass\"\r\n                     [textClass]=\"headerTextClass\"\r\n                     [dividerClass]=\"headerDividerClass\">\r\n</sky-section-divider>\r\n\r\n<div class=\"mt-4\">\r\n  @if(documents.length) {\r\n  <div [class]=\"cardClass\">\r\n    <div class=\"px-3 pt-3\">\r\n      <span class=\"text-dark fs-16\">\r\n        {{ employeeName }}\r\n      </span>\r\n      <span class=\"text-dark fs-16 mx-1\">\r\n        ({{ 'Me' | HRTranslate }})\r\n      </span>\r\n    </div>\r\n    @for(doc of documents; track doc; let last = $last) {\r\n    <div [ngClass]=\"[rowClass, rowPtClass]\">\r\n      <div [class]=\"columnClass\" [title]=\"doc.DocumentTypeName\">\r\n        <hr-info-field [labelKey]=\"'Type'\"\r\n                       [value]=\"doc.DocumentTypeName\"\r\n                       [labelClass]=\"labelClass\"\r\n                       [valueClass]=\"valueClass\">\r\n        </hr-info-field>\r\n      </div>\r\n      <div [class]=\"columnClass\" [title]=\"doc.DocumentNumber\">\r\n        <hr-info-field [labelKey]=\"'DocumentNumber'\"\r\n                       [value]=\"doc.DocumentNumber || '-'\"\r\n                       [labelClass]=\"labelClass\"\r\n                       [valueClass]=\"valueClass\">\r\n        </hr-info-field>\r\n      </div>\r\n      <div [class]=\"responsiveTopSpacingColClass\" [title]=\"doc.IssueDate\">\r\n        <hr-info-field [labelKey]=\"'IssueDate'\"\r\n                       [value]=\"doc.IssueDate ? (doc.IssueDate | date:'dd/MM/yyyy') : '-'\"\r\n                       [labelClass]=\"labelClass\"\r\n                       [valueClass]=\"valueClass\">\r\n        </hr-info-field>\r\n      </div>\r\n      <div [class]=\"responsiveTopSpacingColClass\" [title]=\"doc.ExpiryDate\">\r\n        <hr-info-field [labelKey]=\"'ExpiryDate'\"\r\n                       [value]=\"doc.ExpiryDate ? (doc.ExpiryDate | date:'dd/MM/yyyy') : '-'\"\r\n                       [labelClass]=\"labelClass\"\r\n                       [valueClass]=\"valueClass\">\r\n        </hr-info-field>\r\n      </div>\r\n      @if(last) {\r\n      <div [class]=\"actionsColumnClass\">\r\n        @if(doc.Attachments?.length) {\r\n        @if(doc.Attachments.length === 1) {\r\n        <fa-icon [icon]=\"viewIcon\"\r\n                 [class]=\"viewIconClass\"\r\n                 (click)=\"onAttachmentView(doc)\">\r\n        </fa-icon>\r\n        }\r\n        <fa-icon [icon]=\"downloadIcon\"\r\n                 [class]=\"downloadIconClass\"\r\n                 (click)=\"onDownload(doc)\">\r\n        </fa-icon>\r\n        }\r\n      </div>\r\n      }\r\n    </div>\r\n    }\r\n  </div>\r\n  } @else {\r\n  <sky-empty-design-card [visibleIcon]=\"false\"\r\n                         [visibleQuickAction]=\"false\"\r\n                         [containerClass]=\"emptyStateContainerClass\"\r\n                         [emptyTextClass]=\"emptyStateTextClass\"\r\n                         [emptyText]=\"isLoading ? ((sectionTitle | HRTranslate) + ' ' + ('IsLoading' | HRTranslate)) : ('ThereAreNoPersonalDocumentsYet' | HRTranslate)\">\r\n  </sky-empty-design-card>\r\n  }\r\n</div>\r\n" }]
         }], ctorParameters: () => [{ type: HRSelfWidgetsService }], propDecorators: { baseUrl: [{
                 type: Input
+            }], employeeName: [{
+                type: Input
             }], sectionTitle: [{
                 type: Input
             }], icon: [{
@@ -5023,5 +5263,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { DependentsWidgetComponent, EventOption, EventTypeEnum, HRCardHeaderComponent, HRConstantsService, HREmployeeCalendarComponent, HRHighlightPipe, HRMedicalInsuranceCardComponent, HRTranslatePipe, HRTranslateService, MainWidgetShortcut, MyCalendarWidgetComponent, MyMainDetailsWidgetComponent, MyNextWeekVacationInsightsWidgetComponent, MyUpcomingEventsWidgetComponent, ProfileBankInfoWidgetComponent, ProfileDegreesWidgetComponent, ProfileDependentsDocumentsWidgetComponent, ProfileEntitlementsIndemnityWidgetComponent, ProfileEntitlementsMedicalInsuranceWidgetComponent, ProfileEntitlementsOthersWidgetComponent, ProfileEntitlementsTicketWidgetComponent, ProfileEntitlementsVacationsWidgetComponent, ProfileExperiencesWidgetComponent, ProfileJobInfoContractWidgetComponent, ProfileJobInfoMainWidgetComponent, ProfileJobInfoSalaryWidgetComponent, ProfileJobInfoServiceChargeWidgetComponent, ProfilePersonalInfoAddressWidgetComponent, ProfilePersonalInfoContactWidgetComponent, ProfilePersonalInfoLanguagesWidgetComponent, ProfilePersonalInfoMainWidgetComponent, ProfilePersonalInfoOtherNationalitiesWidgetComponent, PublicHolidayWeekContext, RelativeDay, ScheduleVacationTypes, ServiceChargeEntitlementMode, VacationPopupType };
+export { DependentsWidgetComponent, EventOption, EventTypeEnum, HRCardHeaderComponent, HRConstantsService, HREmployeeCalendarComponent, HRHighlightPipe, HRMedicalInsuranceCardComponent, HRTranslatePipe, HRTranslateService, MainWidgetShortcut, MyCalendarWidgetComponent, MyMainDetailsWidgetComponent, MyNextWeekVacationInsightsWidgetComponent, MyUpcomingEventsWidgetComponent, ProfileBankInfoWidgetComponent, ProfileDegreesWidgetComponent, ProfileDependentsDocumentsWidgetComponent, ProfileEntitlementsIndemnityWidgetComponent, ProfileEntitlementsMedicalInsuranceWidgetComponent, ProfileEntitlementsOthersWidgetComponent, ProfileEntitlementsTicketWidgetComponent, ProfileEntitlementsVacationsWidgetComponent, ProfileExperiencesWidgetComponent, ProfileJobInfoContractWidgetComponent, ProfileJobInfoMainWidgetComponent, ProfileJobInfoSalaryWidgetComponent, ProfileJobInfoServiceChargeWidgetComponent, ProfilePersonalDocumentsWidgetComponent, ProfilePersonalInfoAddressWidgetComponent, ProfilePersonalInfoContactWidgetComponent, ProfilePersonalInfoLanguagesWidgetComponent, ProfilePersonalInfoMainWidgetComponent, ProfilePersonalInfoOtherNationalitiesWidgetComponent, PublicHolidayWeekContext, RelativeDay, ScheduleVacationTypes, ServiceChargeEntitlementMode, VacationPopupType };
 //# sourceMappingURL=skysoftware-co-bayan-hr-widgets-ui.mjs.map