@skysoftware-co/bayan-hr-widgets-ui 1.0.12 → 1.0.15

package/README.md

@@ -270,158 +270,37 @@ The component calls `GET {baseUrl}/hr/employee-portal/calendar` with query param
 - `MonthsCount` - Number of months to load (default: 12)
 - Header: `api-version: 2`
 
-## Profile Widgets
 
-The package also exports profile-focused widgets used in the employee profile page.
-
-## Profile Personal Info Main Widget
-
-### Usage
-```html
-<hr-profile-personal-info-main-widget
-  [baseUrl]="baseUrl"
-  (isLoadingChanged)="onMainLoadingChanged($event)">
-</hr-profile-personal-info-main-widget>
-```
-
-### Input Properties
-| Input | Type | Default Value | Description |
-|-------|------|---------------|-------------|
-| `baseUrl` | string | `''` | Base URL for API calls (required) |
-| `sectionTitle` | string | `'main'` | Section title translation key |
-| `alternateLanguage` | string | `'English'` | Alternate language label next to employee alternate name |
-| `mainIcon` | IconDefinition | `faMemoCircleInfo` | Header icon |
-| `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.
-
-## Profile Personal Info Contact Widget
-
-### Usage
-```html
-<hr-profile-personal-info-contact-widget
-  [baseUrl]="baseUrl"
-  [showEmergencyContact]="true"
-  (isLoadingChanged)="onContactLoadingChanged($event)">
-</hr-profile-personal-info-contact-widget>
-```
-
-### Input Properties
-| Input | Type | Default Value | Description |
-|-------|------|---------------|-------------|
-| `baseUrl` | string | `''` | Base URL for API calls (required) |
-| `sectionTitle` | string | `'contact'` | Section title translation key |
-| `showEmergencyContact` | boolean | `true` | Show emergency contact block |
-| `contactIcon` | IconDefinition | `faPhone` | Header icon |
-| `emergencyContactIcon` | IconDefinition | `faBolt` | Emergency contact icon |
-| `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.
-
-## Profile Personal Info Address Widget
+## My Vacation Team Widget Component
 
 ### Usage
 ```html
-<hr-profile-personal-info-address-widget
-  [baseUrl]="baseUrl"
-  (isLoadingChanged)="onAddressLoadingChanged($event)">
-</hr-profile-personal-info-address-widget>
+<hr-my-vacation-team-widget
+  [baseUrl]="environment.baseUrl"
+  [showProperty]="true"
+  (isLoadingChanged)="onLoadingChanged($event)">
+</hr-my-vacation-team-widget>
 ```
 
-### Input Properties
-| Input | Type | Default Value | Description |
-|-------|------|---------------|-------------|
-| `baseUrl` | string | `''` | Base URL for API calls (required) |
-| `sectionTitle` | string | `'address'` | Section title translation key |
-| `addressIcon` | IconDefinition | `faHouse` | Header icon |
-| `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.
-
-## Profile Personal Info Languages Widget
-
-### Usage
-```html
-<hr-profile-personal-info-languages-widget
-  [baseUrl]="baseUrl"
-  (hasDataChange)="onLanguagesDataChange($event)"
-  (isLoadingChanged)="onLanguagesLoadingChanged($event)">
-</hr-profile-personal-info-languages-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.
 
 ### Input Properties
 | Input | Type | Default Value | Description |
 |-------|------|---------------|-------------|
 | `baseUrl` | string | `''` | Base URL for API calls |
-| `sectionTitle` | string | `'languages'` | Section title translation key |
-| `languagesIcon` | IconDefinition | `faLanguage` | Header icon |
-| `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
-- `hasDataChange: EventEmitter<boolean>` - Emitted when language list has data or not.
-- `isLoadingChanged: EventEmitter<boolean>` - Emitted when loading state changes.
-
-## Profile Personal Info Other Nationalities Widget
-
-### Usage
-```html
-<hr-profile-personal-info-other-nationalities-widget
-  [baseUrl]="baseUrl"
-  (hasDataChange)="onOtherNationalitiesDataChange($event)"
-  (isLoadingChanged)="onOtherNationalitiesLoadingChanged($event)">
-</hr-profile-personal-info-other-nationalities-widget>
-```
-
-### Input Properties
-| Input | Type | Default Value | Description |
-|-------|------|---------------|-------------|
-| `baseUrl` | string | `''` | Base URL for API calls (required) |
-| `sectionTitle` | string | `'otherNationalities'` | Section title translation key |
-| `otherNationalitiesIcon` | IconDefinition | `faEarthAfrica` | Header icon |
-| `emptyStateTextKey` | string | `'ThereIsNoOtherNationalitiesYet'` | Empty state translation key |
-| `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
-- `hasDataChange: EventEmitter<boolean>` - Emitted when other nationalities list has data or not.
-- `isLoadingChanged: EventEmitter<boolean>` - Emitted when loading state changes.
-
-## Profile Bank Information Widget
-
-### Usage
-```html
-<hr-profile-bank-information-widget
-  [baseUrl]="baseUrl"
-  [currencyCode]="currencyCode"
-  [currencyDecimals]="currencyDecimals"
-  (isLoadingChanged)="onBankLoadingChanged($event)">
-</hr-profile-bank-information-widget>
-```
-
-### Input Properties
-| Input | Type | Default Value | Description |
-|-------|------|---------------|-------------|
-| `baseUrl` | string | `''` | Base URL for API calls (required) |
-| `currencyCode` | string | `''` | Currency code shown with transfer amount |
-| `currencyDecimals` | number | `2` | Decimal precision for transfer amount formatting |
-| `sectionTitle` | string | `'BankInformation'` | Section title translation key |
-| `sectionHeaderVisibility` | boolean | `true` | Show or hide the section header |
-| `language` | string | `'en'` | Language used for RTL behavior (`'ar'` enables RTL) |
-| `bankInformationIcon` | IconDefinition | `faMoneyCheckDollarPen` | Header icon |
-| `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 |
+| `showProperty` | boolean | `false` | Show employee property badge in the popup grid |
+| `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-3'` | Upcoming vacations badge container CSS class |
+| `expectedContainerClass` | string | `'border-start border-5'` | Expected to return badge container CSS class |
 
 ### Output Events
-- `isLoadingChanged: EventEmitter<boolean>` - Emitted when loading state changes.
+- `isLoadingChanged: EventEmitter<boolean>` - Emitted when loading state changes
 
-### Notes
+### API Endpoints
+- **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`
 
-- All profile widgets support extensive style class overrides similar to other widgets in this package.
-- During loading, widgets display section-based loading captions (for example: `Main is loading...`).