@skysoftware-co/bayan-hr-widgets-ui 1.0.33 → 1.0.34

package/README.md

@@ -31,7 +31,7 @@ components:
 1. My Main Details Widget
 2. My Upcoming Events Widget
 3. My Calendar Widget
-
+ 
 ## Dependencies
 This library depends on `@skysoftware-co/bayan-components-ui` package which provides:
 - Employee Badge Component
@@ -243,6 +243,7 @@ This component displays an employee calendar showing vacations, public holidays,
 |-------|------|---------------|-------------|
 | `baseUrl` | string | `''` | Base URL for API calls |
 | `headerContainerClass` | string | `''` | Additional CSS class for the header container |
+| `datasource` | `ScheduleRequestsResponse \| null` | `null` | External datasource for pending requests. When provided, pending vacation requests are merged with calendar vacations (consecutive same-type vacations are combined), and pending event requests are added as events. The calendar reactively updates whenever this input changes after the initial calendar data has loaded. |
 | `publicHolidayColor` | string | from `HRConstantsService`: `'#249EA0'` | Color for public holidays |
 | `dayOffColor` | string | from `HRConstantsService`: `'#FCCF5A'` | Color for days off |
 | `eventsColor` | string | from `HRConstantsService`: `'#e67e0f'` | Color for events |
@@ -271,15 +272,15 @@ The component calls `GET {baseUrl}/hr/employee-portal/calendar` with query param
 - Header: `api-version: 2`
 
 
-## My Next Week Vacation Insights Widget Component
+## My Vacation Team Widget Component
 
 ### Usage
 ```html
-<hr-my-next-week-vacation-insights-widget
+<hr-my-vacation-team-widget
   [baseUrl]="environment.baseUrl"
   [showProperty]="true"
   (isLoadingChanged)="onLoadingChanged($event)">
-</hr-my-next-week-vacation-insights-widget>
+</hr-my-vacation-team-widget>
 ```
 
 This component displays a "Next Week Vacation Insights" card showing two badges: **Upcoming Vacations** and **Expected To Return** counts for team subordinates. Clicking a badge opens a popup with a paginated, searchable data grid listing the relevant employees. It uses `SkyWidgetSectionItemComponent` from `@skysoftware-co/sky-components-ui` for badge display and `BayanEmployeeBadgeComponent` from `@skysoftware-co/bayan-components-ui` for employee photos in the popup.
@@ -289,22 +290,20 @@ This component displays a "Next Week Vacation Insights" card showing two badges:
 |-------|------|---------------|-------------|
 | `baseUrl` | string | `''` | Base URL for API calls |
 | `showProperty` | boolean | `false` | Show employee property badge in the popup grid |
-| `cardClass` | string | `'card rounded rounded-4 card-shadow border-top-0 h-100 p-4'` | Card container CSS class |
-| `titleClass` | string | `'table-header-lg fw-meduim mb-3 mt-2'` | Card title CSS class |
+| `cardClass` | string | `'card rounded rounded-4 card-shadow p-16 border-top-0 h-100 p-4'` | Card container CSS class |
+| `titleClass` | string | `'table-header-lg fw-meduim'` | Card title CSS class |
 | `valueClass` | string | `'fs-24 mt-1 link-dark hover-primary text-decoration-none'` | Badge value CSS class (clickable) |
 | `disabledValueClass` | string | `'fs-24 mt-1 text-muted pe-none text-decoration-none'` | Badge value CSS class when count is 0 |
-| `upcomingContainerClass` | string | `'border-start border-5 mb-4'` | Upcoming vacations badge container CSS class |
+| `upcomingContainerClass` | string | `'border-start border-5 mb-3'` | Upcoming vacations badge container CSS class |
 | `expectedContainerClass` | string | `'border-start border-5'` | Expected to return badge container CSS class |
-| `firstRowClass` | string | `'mb-4'` | CSS class for the first badge row wrapper |
-| `secondRowClass` | string | `'mt-3'` | CSS class for the second badge row wrapper |
 
 ### Output Events
 - `isLoadingChanged: EventEmitter<boolean>` - Emitted when loading state changes
 
 ### API Endpoints
-- **Summary**: `GET {baseUrl}/hr/widgets/me/team/next-week-vacation-insights/summary?ShowDirectSubordinatesOnly=false`
-- **Upcoming list**: `GET {baseUrl}/hr/widgets/me/team/next-week-vacation-insights/upcoming-vacations`
-- **Expected to return list**: `GET {baseUrl}/hr/widgets/me/team/next-week-vacation-insights/expected-to-return`
+- **Summary**: `GET {baseUrl}/hr/widgets/me/team/subordinates/vacations/summary?ShowDirectSubordinatesOnly=false`
+- **Upcoming list**: `GET {baseUrl}/hr/widgets/me/team/subordinates/vacations/upcoming`
+- **Expected to return list**: `GET {baseUrl}/hr/widgets/me/team/subordinates/vacations/expected-to-return`
 
 ## Profile Widgets
 
@@ -345,6 +344,92 @@ The package also exports profile-focused widgets used in the employee profile pa
 - `isLoadingChanged: EventEmitter<boolean>` - Emitted when loading state changes.
 - `errorOccurred: EventEmitter<string>` - Emitted when API request fails.
 
+## Profile Experiences Widget
+
+### Usage
+```html
+<hr-profile-experiences-widget
+  [baseUrl]="baseUrl"
+  (isLoadingChanged)="onExperiencesLoadingChanged($event)">
+</hr-profile-experiences-widget>
+```
+
+### Input Properties
+| Input | Type | Default Value | Description |
+|-------|------|---------------|-------------|
+| `baseUrl` | string | `''` | Base URL for API calls. |
+| `sectionTitle` | string | `'experiences'` | Section title translation key. |
+| `experienceIcon` | IconDefinition | `faUsersRays` | Header icon. |
+| `viewIcon` | IconDefinition | `faEye` | Attachment view icon. |
+| `downloadIcon` | IconDefinition | `faFolderArrowDown` | Attachment download icon. |
+| `headerIconClass` | string | `'primary-icon-xl'` | Header icon CSS class. |
+| `headerTextClass` | string | `'fs-16 mt-2 text-secondary'` | Header text CSS class. |
+| `headerDividerClass` | string | `'flex-grow-1 ms-2'` | Header divider CSS class. |
+| `rowClass` | string | `'mt-4'` | Main row CSS class. |
+| `rowMarginBottomClass` | string | `'mb-5'` | Bottom spacing class when experiences exist. |
+| `rowMarginBottomEmptyClass` | string | `'mb-4'` | Bottom spacing class when list is empty. |
+| `headerRowClass` | string | `'row col-10'` | Header labels row CSS class. |
+| `actionsSpacerClass` | string | `'col-2'` | Spacer column class between labels and actions area. |
+| `itemRowClass` | string | `'row'` | Backward-compatible row class input (not used in current template loop). |
+| `itemColumnsWrapperClass` | string | `'row col-10 mt-3'` | Per-item columns wrapper CSS class. |
+| `itemColumnClass` | string | `'col-3'` | Column CSS class. |
+| `labelClass` | string | `'field-secondary-label-sm text-ellipsis-one-line'` | Header label CSS class. |
+| `valueClass` | string | `'text-dark-gray fs-14 text-ellipsis-one-line'` | Value text CSS class. |
+| `actionsColumnClass` | string | `'col-2 align-items-end mt-3'` | Attachment action column CSS class. |
+| `viewIconClass` | string | `'fs-15 text-dark cursor-pointer'` | View icon CSS class. |
+| `downloadIconClass` | string | `'fs-15 mx-3 text-dark cursor-pointer'` | Download icon CSS class. |
+| `emptyStateContainerClass` | string | `'d-flex flex-column justify-content-center align-items-center my-5'` | Empty/loading container CSS class. |
+| `emptyStateTextClass` | string | `'field-secondary-label-md'` | Empty/loading text CSS class. |
+
+### Output Events
+- `isLoadingChanged: EventEmitter<boolean>` - Emitted when loading state changes.
+- `attachmentViewed: EventEmitter<any>` - Emitted when attachment view icon is clicked.
+- `attachmentDownloaded: EventEmitter<any>` - Emitted when attachment download icon is clicked.
+- `errorOccurred: EventEmitter<string>` - Emitted when API request fails.
+
+## Profile Degrees Widget
+
+### Usage
+```html
+<hr-profile-degrees-widget
+  [baseUrl]="baseUrl"
+  (isLoadingChanged)="onDegreesLoadingChanged($event)">
+</hr-profile-degrees-widget>
+```
+
+### Input Properties
+| Input | Type | Default Value | Description |
+|-------|------|---------------|-------------|
+| `baseUrl` | string | `''` | Base URL for API calls. |
+| `sectionTitle` | string | `'Degrees'` | Section title translation key. |
+| `degreesIcon` | IconDefinition | `faFileCertificate` | Header icon. |
+| `viewIcon` | IconDefinition | `faEye` | Attachment view icon. |
+| `downloadIcon` | IconDefinition | `faFolderArrowDown` | Attachment download icon. |
+| `headerIconClass` | string | `'primary-icon-xl'` | Header icon CSS class. |
+| `headerTextClass` | string | `'fs-16 mt-2 text-secondary'` | Header text CSS class. |
+| `headerDividerClass` | string | `'flex-grow-1 ms-2'` | Header divider CSS class. |
+| `rowClass` | string | `'mt-4'` | Main row CSS class. |
+| `rowMarginBottomClass` | string | `'mb-5'` | Bottom spacing class when degrees exist. |
+| `rowMarginBottomEmptyClass` | string | `'mb-4'` | Bottom spacing class when list is empty. |
+| `headerRowClass` | string | `'row col-10'` | Header labels row CSS class. |
+| `actionsSpacerClass` | string | `'col-2'` | Spacer column class between labels and actions area. |
+| `itemRowClass` | string | `'row'` | Backward-compatible row class input (not used in current template loop). |
+| `itemColumnsWrapperClass` | string | `'row col-10 mt-3'` | Per-item columns wrapper CSS class. |
+| `itemColumnClass` | string | `'col-3'` | Column CSS class. |
+| `labelClass` | string | `'field-secondary-label-sm text-ellipsis-one-line'` | Header label CSS class. |
+| `valueClass` | string | `'text-dark-gray fs-14 text-ellipsis-one-line'` | Value text CSS class. |
+| `actionsColumnClass` | string | `'col-2 align-items-end mt-3'` | Attachment action column CSS class. |
+| `viewIconClass` | string | `'fs-15 text-dark cursor-pointer'` | View icon CSS class. |
+| `downloadIconClass` | string | `'fs-15 mx-3 text-dark cursor-pointer'` | Download icon CSS class. |
+| `emptyStateContainerClass` | string | `'d-flex flex-column justify-content-center align-items-center my-5'` | Empty/loading container CSS class. |
+| `emptyStateTextClass` | string | `'field-secondary-label-md'` | Empty/loading text CSS class. |
+
+### Output Events
+- `isLoadingChanged: EventEmitter<boolean>` - Emitted when loading state changes.
+- `attachmentViewed: EventEmitter<any>` - Emitted when attachment view icon is clicked.
+- `attachmentDownloaded: EventEmitter<any>` - Emitted when attachment download icon is clicked.
+- `errorOccurred: EventEmitter<string>` - Emitted when API request fails.
+
 ## Profile Personal Info Contact Widget
 
 ### Usage

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

@@ -188,6 +188,8 @@ var Employer$2 = "Employer";
 var TerminationReason$2 = "Termination reason";
 var ThereIsNoDegreesYet$2 = "There are no degrees yet";
 var ThereIsNoExperiencesYet$2 = "There are no experiences yet";
+var ThereIsNoDependentsYet$2 = "There are no dependents yet";
+var DependentTypeName$2 = "Dependent Type";
 var en = {
 	ReportingTo: ReportingTo$2,
 	NotAnknown: NotAnknown$2,
@@ -301,7 +303,7 @@ var en = {
 	Degrees: Degrees$2,
 	degrees: degrees$2,
 	experiences: experiences$2,
-	"Degree/Year": "Degree / Year",
+	"Degree/Year": "Degree/Year",
 	Country: Country$2,
 	Specialty: Specialty$2,
 	Institute: Institute$2,
@@ -309,7 +311,9 @@ var en = {
 	Employer: Employer$2,
 	TerminationReason: TerminationReason$2,
 	ThereIsNoDegreesYet: ThereIsNoDegreesYet$2,
-	ThereIsNoExperiencesYet: ThereIsNoExperiencesYet$2
+	ThereIsNoExperiencesYet: ThereIsNoExperiencesYet$2,
+	ThereIsNoDependentsYet: ThereIsNoDependentsYet$2,
+	DependentTypeName: DependentTypeName$2
 };
 
 var ReportingTo$1 = "مفوض الى";
@@ -410,7 +414,7 @@ var ThereIsNoJobMainYet$1 = "لا توجد معلومات وظيفية بعد";
 var ThereIsNoJobContractYet$1 = "لا توجد معلومات عقد بعد";
 var ThereIsNoJobSalaryYet$1 = "لا توجد معلومات راتب بعد";
 var ThereIsNoJobServiceChargeYet$1 = "لا توجد معلومات مستحقات نهاية الخدمة بعد";
-var NextWeekVacationInsights$1 = "ملخص إجازات الأسبوع القادم";
+var NextWeekVacationInsights$1 = "رؤى إجازات الأسبوع القادم";
 var UpcomingVacations$1 = "الإجازات القادمة";
 var ExpectedToReturn$1 = "المتوقع عودتهم";
 var Employee$1 = "الموظف";
@@ -429,6 +433,8 @@ var Employer$1 = "جهة العمل";
 var TerminationReason$1 = "سبب إنهاء الخدمة";
 var ThereIsNoDegreesYet$1 = "لا توجد مؤهلات علمية بعد";
 var ThereIsNoExperiencesYet$1 = "لا توجد خبرات بعد";
+var ThereIsNoDependentsYet$1 = "لا يوجد معالين حتى الآن";
+var DependentTypeName$1 = "نوع المعال";
 var ar = {
 	ReportingTo: ReportingTo$1,
 	NotAnknown: NotAnknown$1,
@@ -549,7 +555,9 @@ var ar = {
 	Employer: Employer$1,
 	TerminationReason: TerminationReason$1,
 	ThereIsNoDegreesYet: ThereIsNoDegreesYet$1,
-	ThereIsNoExperiencesYet: ThereIsNoExperiencesYet$1
+	ThereIsNoExperiencesYet: ThereIsNoExperiencesYet$1,
+	ThereIsNoDependentsYet: ThereIsNoDependentsYet$1,
+	DependentTypeName: DependentTypeName$1
 };
 
 var ReportingTo = "Rapport à";
@@ -670,6 +678,8 @@ var Employer = "Employeur";
 var TerminationReason = "Motif de fin de service";
 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 fr = {
 	ReportingTo: ReportingTo,
 	NotAnknown: NotAnknown,
@@ -791,7 +801,9 @@ var fr = {
 	Employer: Employer,
 	TerminationReason: TerminationReason,
 	ThereIsNoDegreesYet: ThereIsNoDegreesYet,
-	ThereIsNoExperiencesYet: ThereIsNoExperiencesYet
+	ThereIsNoExperiencesYet: ThereIsNoExperiencesYet,
+	ThereIsNoDependentsYet: ThereIsNoDependentsYet,
+	DependentTypeName: DependentTypeName
 };
 
 const BUILT_IN_LEXICONS = { en, ar, fr };
@@ -1112,6 +1124,35 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
                 }]
         }] });
 
+class ProfileEmployeeDependentsCach {
+    baseUrl = '';
+    dependents$ = null;
+    clear() {
+        this.baseUrl = '';
+    }
+    ensureBaseUrl(baseUrl) {
+        if (this.baseUrl && this.baseUrl !== baseUrl) {
+            this.clear();
+        }
+        this.baseUrl = baseUrl;
+    }
+    setDependents(baseUrl, value) {
+        this.ensureBaseUrl(baseUrl);
+        this.dependents$ = value;
+    }
+    getDependents(baseUrl) {
+        return this.baseUrl === baseUrl ? this.dependents$ : null;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: ProfileEmployeeDependentsCach, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: ProfileEmployeeDependentsCach, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: ProfileEmployeeDependentsCach, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
+        }] });
+
 class HRSelfWidgetsService {
     http;
     bankInformationCacheService;
@@ -1119,14 +1160,16 @@ class HRSelfWidgetsService {
     jobInformationCacheService;
     personalInformationCacheService;
     qualificationsCacheService;
+    profileEmployeeDependentsCachService;
     headers = { 'api-version': '1' };
-    constructor(http, bankInformationCacheService, entitlementsCacheService, jobInformationCacheService, personalInformationCacheService, qualificationsCacheService) {
+    constructor(http, bankInformationCacheService, entitlementsCacheService, jobInformationCacheService, personalInformationCacheService, qualificationsCacheService, profileEmployeeDependentsCachService) {
         this.http = http;
         this.bankInformationCacheService = bankInformationCacheService;
         this.entitlementsCacheService = entitlementsCacheService;
         this.jobInformationCacheService = jobInformationCacheService;
         this.personalInformationCacheService = personalInformationCacheService;
         this.qualificationsCacheService = qualificationsCacheService;
+        this.profileEmployeeDependentsCachService = profileEmployeeDependentsCachService;
     }
     getMainDetails(baseUrl) {
         return this.http.get(`${baseUrl}/hr/widgets/me/main-details`, {
@@ -1431,6 +1474,22 @@ class HRSelfWidgetsService {
         this.qualificationsCacheService.setDegrees(baseUrl, request$);
         return request$;
     }
+    getEmployeeDependents(baseUrl, forceRefresh = false) {
+        if (!forceRefresh) {
+            const cachedRequest$ = this.profileEmployeeDependentsCachService.getDependents(baseUrl);
+            if (cachedRequest$) {
+                return cachedRequest$;
+            }
+        }
+        const request$ = this.http
+            .get(`${baseUrl}/hr/widgets/me/profile/dependents`, { headers: this.headers })
+            .pipe(map((response) => response?.ResponseData ?? []), shareReplay(1), catchError((error) => {
+            this.profileEmployeeDependentsCachService.clear();
+            return throwError(() => error);
+        }));
+        this.profileEmployeeDependentsCachService.setDependents(baseUrl, request$);
+        return request$;
+    }
     getEmployeeExperiences(baseUrl, forceRefresh = false) {
         if (!forceRefresh) {
             const cached = this.qualificationsCacheService.getExperiences(baseUrl);
@@ -1446,7 +1505,7 @@ class HRSelfWidgetsService {
         this.qualificationsCacheService.setExperiences(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 }], target: i0.ɵɵFactoryTarget.Injectable });
+    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 }], target: i0.ɵɵFactoryTarget.Injectable });
     static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: HRSelfWidgetsService, providedIn: 'root' });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: HRSelfWidgetsService, decorators: [{
@@ -1454,7 +1513,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
             args: [{
                     providedIn: 'root'
                 }]
-        }], ctorParameters: () => [{ type: i1.HttpClient }, { type: BankInformationCacheService }, { type: EntitlementsCacheService }, { type: JobInformationCacheService }, { type: PersonalInformationCacheService }, { type: QualificationsCacheService }] });
+        }], ctorParameters: () => [{ type: i1.HttpClient }, { type: BankInformationCacheService }, { type: EntitlementsCacheService }, { type: JobInformationCacheService }, { type: PersonalInformationCacheService }, { type: QualificationsCacheService }, { type: ProfileEmployeeDependentsCach }] });
 
 class HRConstantsService {
     defaultVacationBalanceColor = '#727070';