@skysoftware-co/bayan-hr-widgets-ui 1.0.0 → 1.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,5 +1,5 @@
1
1
  import * as i0 from '@angular/core';
2
- import { Injectable, EventEmitter, Input, Output, Component } from '@angular/core';
2
+ import { Injectable, Pipe, EventEmitter, Input, Output, Component, inject } from '@angular/core';
3
3
  import * as i1$1 from 'devextreme-angular';
4
4
  import { DxTooltipModule, DxPopupModule, DxScrollViewModule, DxLoadPanelModule } from 'devextreme-angular';
5
5
  import { NgClass, DecimalPipe, DatePipe, LowerCasePipe, CommonModule } from '@angular/common';
@@ -44,6 +44,221 @@ var EventTypeEnum;
44
44
  EventTypeEnum[EventTypeEnum["PublicHolidays"] = 2] = "PublicHolidays";
45
45
  })(EventTypeEnum || (EventTypeEnum = {}));
46
46
 
47
+ var ReportingTo$2 = "Reporting to";
48
+ var NotAnknown$2 = "N\\A";
49
+ var ServiceYears$2 = "Service years";
50
+ var More$2 = "More";
51
+ var day$2 = "day";
52
+ var days$2 = "days";
53
+ var Years$2 = "Years";
54
+ var Months$2 = "Months";
55
+ var UpcomingEvents$2 = "Upcoming events";
56
+ var Birthday$2 = "Birthday";
57
+ var PublicHoliday$2 = "Public holiday";
58
+ var During$2 = "during";
59
+ var isIn$2 = "Is in";
60
+ var is$2 = "Is";
61
+ var In$2 = "In";
62
+ var NoEvents$2 = "There are no events";
63
+ var All$2 = "All";
64
+ var ViewAll$2 = "View all";
65
+ var WeekendDayNotDefined$2 = "Weekend day is not defined.";
66
+ var Today$2 = "Today";
67
+ var Tomorrow$2 = "Tomorrow";
68
+ var InTwoDays$2 = "In 2 days";
69
+ var ThisWeek$2 = "This week";
70
+ var NextWeek$2 = "Next week";
71
+ var en = {
72
+ ReportingTo: ReportingTo$2,
73
+ NotAnknown: NotAnknown$2,
74
+ ServiceYears: ServiceYears$2,
75
+ More: More$2,
76
+ day: day$2,
77
+ days: days$2,
78
+ Years: Years$2,
79
+ Months: Months$2,
80
+ UpcomingEvents: UpcomingEvents$2,
81
+ Birthday: Birthday$2,
82
+ PublicHoliday: PublicHoliday$2,
83
+ During: During$2,
84
+ isIn: isIn$2,
85
+ is: is$2,
86
+ In: In$2,
87
+ NoEvents: NoEvents$2,
88
+ All: All$2,
89
+ ViewAll: ViewAll$2,
90
+ WeekendDayNotDefined: WeekendDayNotDefined$2,
91
+ Today: Today$2,
92
+ Tomorrow: Tomorrow$2,
93
+ InTwoDays: InTwoDays$2,
94
+ ThisWeek: ThisWeek$2,
95
+ NextWeek: NextWeek$2
96
+ };
97
+
98
+ var ReportingTo$1 = "مفوض الى";
99
+ var NotAnknown$1 = "غير معرف";
100
+ var ServiceYears$1 = "سنوات الخدمة";
101
+ var More$1 = "المزيد";
102
+ var day$1 = "يوم";
103
+ var days$1 = "أيام";
104
+ var Years$1 = "سنوات";
105
+ var Months$1 = "اشهر";
106
+ var UpcomingEvents$1 = "الأحداث القادمة";
107
+ var Birthday$1 = "عيد ميلاد";
108
+ var PublicHoliday$1 = "اجازة عامة";
109
+ var During$1 = "خلال";
110
+ var isIn$1 = "هو في";
111
+ var is$1 = "يكون";
112
+ var In$1 = "في";
113
+ var NoEvents$1 = "لا توجد أحداث";
114
+ var All$1 = "الكل";
115
+ var ViewAll$1 = "عرض الكل";
116
+ var WeekendDayNotDefined$1 = "يوم عطلة نهاية الأسبوع غير محدد";
117
+ var Today$1 = "اليوم";
118
+ var Tomorrow$1 = "غداً";
119
+ var InTwoDays$1 = "بعد يومين";
120
+ var ThisWeek$1 = "هذا الأسبوع";
121
+ var NextWeek$1 = "الأسبوع القادم";
122
+ var ar = {
123
+ ReportingTo: ReportingTo$1,
124
+ NotAnknown: NotAnknown$1,
125
+ ServiceYears: ServiceYears$1,
126
+ More: More$1,
127
+ day: day$1,
128
+ days: days$1,
129
+ Years: Years$1,
130
+ Months: Months$1,
131
+ UpcomingEvents: UpcomingEvents$1,
132
+ Birthday: Birthday$1,
133
+ PublicHoliday: PublicHoliday$1,
134
+ During: During$1,
135
+ isIn: isIn$1,
136
+ is: is$1,
137
+ In: In$1,
138
+ NoEvents: NoEvents$1,
139
+ All: All$1,
140
+ ViewAll: ViewAll$1,
141
+ WeekendDayNotDefined: WeekendDayNotDefined$1,
142
+ Today: Today$1,
143
+ Tomorrow: Tomorrow$1,
144
+ InTwoDays: InTwoDays$1,
145
+ ThisWeek: ThisWeek$1,
146
+ NextWeek: NextWeek$1
147
+ };
148
+
149
+ var ReportingTo = "Rapport à";
150
+ var NotAnknown = "N/A";
151
+ var ServiceYears = "Années de service";
152
+ var More = "Plus";
153
+ var day = "jour";
154
+ var days = "Jours";
155
+ var Years = "Années";
156
+ var Months = "Mois";
157
+ var UpcomingEvents = "Événements à venir";
158
+ var Birthday = "Anniversaire";
159
+ var PublicHoliday = "Jour férié";
160
+ var During = "Pendant";
161
+ var isIn = "Est dans";
162
+ var is = "est";
163
+ var In = "Dans";
164
+ var NoEvents = "Il n'y a pas d'événements";
165
+ var All = "Toute";
166
+ var ViewAll = "Tout voir";
167
+ var WeekendDayNotDefined = "Le jour de week-end n'est pas défini.";
168
+ var Today = "Aujourd'hui";
169
+ var Tomorrow = "Demain";
170
+ var InTwoDays = "Dans 2 jours";
171
+ var ThisWeek = "Cette semaine";
172
+ var NextWeek = "La semaine prochaine";
173
+ var fr = {
174
+ ReportingTo: ReportingTo,
175
+ NotAnknown: NotAnknown,
176
+ ServiceYears: ServiceYears,
177
+ More: More,
178
+ day: day,
179
+ days: days,
180
+ Years: Years,
181
+ Months: Months,
182
+ UpcomingEvents: UpcomingEvents,
183
+ Birthday: Birthday,
184
+ PublicHoliday: PublicHoliday,
185
+ During: During,
186
+ isIn: isIn,
187
+ is: is,
188
+ In: In,
189
+ NoEvents: NoEvents,
190
+ All: All,
191
+ ViewAll: ViewAll,
192
+ WeekendDayNotDefined: WeekendDayNotDefined,
193
+ Today: Today,
194
+ Tomorrow: Tomorrow,
195
+ InTwoDays: InTwoDays,
196
+ ThisWeek: ThisWeek,
197
+ NextWeek: NextWeek
198
+ };
199
+
200
+ const BUILT_IN_LEXICONS = { en, ar, fr };
201
+ class HrLexiconService {
202
+ currentLanguage = 'en';
203
+ setLanguage(language) {
204
+ this.currentLanguage = language;
205
+ }
206
+ getLanguage() {
207
+ return this.currentLanguage;
208
+ }
209
+ setLexicon(lexicon) {
210
+ localStorage.setItem('Lexicon', JSON.stringify(lexicon));
211
+ }
212
+ getBuiltInLexicon(language) {
213
+ return BUILT_IN_LEXICONS[language || this.currentLanguage] || {};
214
+ }
215
+ getLocalStorageLexicon() {
216
+ return JSON.parse(localStorage.getItem('Lexicon') || '{}');
217
+ }
218
+ lookupInBuiltIn(key) {
219
+ const lexicon = this.getBuiltInLexicon();
220
+ const foundKey = Object.keys(lexicon).find(k => k.toLowerCase() === key.toLowerCase());
221
+ return foundKey ? lexicon[foundKey] : null;
222
+ }
223
+ lookupInLocalStorage(key) {
224
+ const lexicon = this.getLocalStorageLexicon();
225
+ const foundKey = Object.keys(lexicon).find(k => k.toLowerCase() === key.toLowerCase());
226
+ return foundKey ? lexicon[foundKey] : null;
227
+ }
228
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: HrLexiconService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
229
+ static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: HrLexiconService, providedIn: 'root' });
230
+ }
231
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: HrLexiconService, decorators: [{
232
+ type: Injectable,
233
+ args: [{
234
+ providedIn: 'root'
235
+ }]
236
+ }] });
237
+
238
+ class HrTranslatePipe {
239
+ lexiconService;
240
+ constructor(lexiconService) {
241
+ this.lexiconService = lexiconService;
242
+ }
243
+ transform(key) {
244
+ if (!key)
245
+ return '';
246
+ const value = this.lexiconService.lookupInBuiltIn(key);
247
+ if (value)
248
+ return value;
249
+ return key;
250
+ }
251
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: HrTranslatePipe, deps: [{ token: HrLexiconService }], target: i0.ɵɵFactoryTarget.Pipe });
252
+ static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.20", ngImport: i0, type: HrTranslatePipe, isStandalone: true, name: "hrTranslate" });
253
+ }
254
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: HrTranslatePipe, decorators: [{
255
+ type: Pipe,
256
+ args: [{
257
+ standalone: true,
258
+ name: 'hrTranslate'
259
+ }]
260
+ }], ctorParameters: () => [{ type: HrLexiconService }] });
261
+
47
262
  class HrConstantsService {
48
263
  defaultVacationBalanceColor = '#727070';
49
264
  defaultVacationColor = '#DCDCDC';
@@ -60,6 +275,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
60
275
  class HrMyMainDetailsWidgetComponent {
61
276
  http;
62
277
  constants;
278
+ lexicon;
63
279
  employeeMainInfo = null;
64
280
  onShortcutClicked = new EventEmitter();
65
281
  isLoadingChanged = new EventEmitter();
@@ -97,14 +313,6 @@ class HrMyMainDetailsWidgetComponent {
97
313
  tooltipVacationRowClass = 'd-flex align-items-center justify-content-around fs-12 mb-2';
98
314
  tooltipVacationNameContainerClass = 'd-flex flex-grow-1 align-items-center me-5';
99
315
  tooltipVacationNameClass = 'mx-2';
100
- reportingToLabel = 'ReportingTo';
101
- emptyReportingToLabel = 'NotAnknown';
102
- serviceYearsLabel = 'ServiceYears';
103
- moreLabel = 'More';
104
- dayLabel = 'day';
105
- daysLabel = 'days';
106
- yearsLabel = 'Years';
107
- monthsLabel = 'Months';
108
316
  defaultVacationBalanceColor;
109
317
  defaultVacationColor;
110
318
  baseUrl = '';
@@ -116,9 +324,10 @@ class HrMyMainDetailsWidgetComponent {
116
324
  isMobile = false;
117
325
  isTablet = false;
118
326
  shortcuts = [];
119
- constructor(http, constants) {
327
+ constructor(http, constants, lexicon) {
120
328
  this.http = http;
121
329
  this.constants = constants;
330
+ this.lexicon = lexicon;
122
331
  this.defaultVacationBalanceColor = this.constants.defaultVacationBalanceColor;
123
332
  this.defaultVacationColor = this.constants.defaultVacationColor;
124
333
  }
@@ -138,7 +347,7 @@ class HrMyMainDetailsWidgetComponent {
138
347
  GradeName: responses.GradeName,
139
348
  PhotoPath: responses.PhotoPath,
140
349
  ReportingTo: responses.ReportingToEmployeeName,
141
- ServiceYears: `${responses.ServicePeriod.Years} ${this.yearsLabel} ${responses.ServicePeriod.Months} ${this.monthsLabel}`,
350
+ ServiceYears: `${responses.ServicePeriod.Years} ${this.lexicon.lookupInBuiltIn('Years') || 'Years'} ${responses.ServicePeriod.Months} ${this.lexicon.lookupInBuiltIn('Months') || 'Months'}`,
142
351
  VacationBalances: responses.VacationBalances,
143
352
  AttendanceUrl: responses.AttendanceReportUrl,
144
353
  VacationStatementUrl: responses.VacationStatementReportUrl,
@@ -176,13 +385,13 @@ class HrMyMainDetailsWidgetComponent {
176
385
  headers: { 'api-version': '2' }
177
386
  });
178
387
  }
179
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: HrMyMainDetailsWidgetComponent, deps: [{ token: i1.HttpClient }, { token: HrConstantsService }], target: i0.ɵɵFactoryTarget.Component });
180
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: HrMyMainDetailsWidgetComponent, isStandalone: true, selector: "hr-my-main-details-widget", inputs: { badgeClass: "badgeClass", badgeImageClass: "badgeImageClass", badgeWidth: "badgeWidth", badgeHeight: "badgeHeight", employeeInfoContainerClass: "employeeInfoContainerClass", employeeDetailsClass: "employeeDetailsClass", employeeNameContainerClass: "employeeNameContainerClass", employeeNameClass: "employeeNameClass", employeePositionClass: "employeePositionClass", employeeGradeClass: "employeeGradeClass", containerClass: "containerClass", cardBodyClass: "cardBodyClass", headerRowClass: "headerRowClass", shortcutsContainerClass: "shortcutsContainerClass", shortcutItemClass: "shortcutItemClass", shortcutIconContainerClass: "shortcutIconContainerClass", shortcutIconClass: "shortcutIconClass", shortcutTextClass: "shortcutTextClass", detailsRowClass: "detailsRowClass", reportingBlockClass: "reportingBlockClass", captionLabelClasses: "captionLabelClasses", captionLabelValueClass: "captionLabelValueClass", vacationBalancesContainerClass: "vacationBalancesContainerClass", vacationBalanceItemClass: "vacationBalanceItemClass", vacationBalanceHeaderClass: "vacationBalanceHeaderClass", vacationColorDotClass: "vacationColorDotClass", vacationTypeNameClass: "vacationTypeNameClass", vacationBalanceValueRowClass: "vacationBalanceValueRowClass", vacationBalanceValueClass: "vacationBalanceValueClass", tooltipTriggerLinkClass: "tooltipTriggerLinkClass", tooltipTriggerTextClass: "tooltipTriggerTextClass", tooltipVacationRowClass: "tooltipVacationRowClass", tooltipVacationNameContainerClass: "tooltipVacationNameContainerClass", tooltipVacationNameClass: "tooltipVacationNameClass", reportingToLabel: "reportingToLabel", emptyReportingToLabel: "emptyReportingToLabel", serviceYearsLabel: "serviceYearsLabel", moreLabel: "moreLabel", dayLabel: "dayLabel", daysLabel: "daysLabel", yearsLabel: "yearsLabel", monthsLabel: "monthsLabel", defaultVacationBalanceColor: "defaultVacationBalanceColor", defaultVacationColor: "defaultVacationColor", baseUrl: "baseUrl", isMobile: "isMobile", isTablet: "isTablet", shortcuts: "shortcuts" }, outputs: { onShortcutClicked: "onShortcutClicked", isLoadingChanged: "isLoadingChanged" }, ngImport: i0, template: "<div [class]=\"containerClass\">\r\n <div [class]=\"cardBodyClass\">\r\n <div [class]=\"headerRowClass\">\r\n <div>\r\n @if(employeeMainInfo!=null){\r\n <div [class]=\"employeeInfoContainerClass\">\r\n <bayan-employee-badge [badge]=\"employeeBadge\"\r\n [badgeClass]=\"badgeClass\"\r\n [imageClass]=\"badgeImageClass\"\r\n [width]=\"badgeWidth\"\r\n [height]=\"badgeHeight\"\r\n (employeePhotoError)=\"handleEmployeePhotoError()\"></bayan-employee-badge>\r\n\r\n <div [class]=\"employeeDetailsClass\">\r\n <div [class]=\"employeeNameContainerClass\">\r\n <div [class]=\"employeeNameClass\"\r\n data-bs-toggle=\"tooltip\" [title]=\"employeeMainInfo.EmployeeNumber+' | '+ employeeMainInfo.EmployeeName\">\r\n {{employeeMainInfo.EmployeeNumber + ' | ' + employeeMainInfo.EmployeeName}}\r\n </div>\r\n </div>\r\n @if(employeeMainInfo.PositionName != null && employeeMainInfo.PositionName != ''){\r\n <div [class]=\"employeePositionClass\"\r\n data-bs-toggle=\"tooltip\"\r\n [title]=\"employeeMainInfo.PositionName\">\r\n {{employeeMainInfo.PositionName}}\r\n </div>\r\n }\r\n @if(employeeMainInfo.GradeName !=null){\r\n <div [class]=\"employeeGradeClass\" [title]=\"employeeMainInfo.GradeName\">\r\n {{employeeMainInfo.GradeName}}\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n }\r\n </div>\r\n <div [class]=\"shortcutsContainerClass\">\r\n @for(Icon of shortcuts ; track Icon ; let i = $index;){\r\n <sky-shortcut-icon [shortcut]=\"Icon\"\r\n [itemClass]=\"shortcutItemClass\"\r\n [iconContainerClass]=\"shortcutIconContainerClass\"\r\n [iconClass]=\"shortcutIconClass\"\r\n [textClass]=\"shortcutTextClass\"\r\n (onClicked)=\"shortcutClicked($event)\"></sky-shortcut-icon>\r\n }\r\n </div>\r\n </div>\r\n <div [class]=\"detailsRowClass\" [ngClass]=\"{'flex-wrap': isMobile || isTablet}\">\r\n <div [class]=\"reportingBlockClass\" [ngClass]=\"{'mb-3': isMobile}\">\r\n <div [class]=\"captionLabelClasses + ' me-5'\">\r\n <div>\r\n {{reportingToLabel}}\r\n </div>\r\n <div [class]=\"captionLabelValueClass\">\r\n @if(employeeMainInfo?.ReportingTo){\r\n {{employeeMainInfo?.ReportingTo}}\r\n }@else{\r\n {{emptyReportingToLabel}}\r\n }\r\n </div>\r\n </div>\r\n <div [class]=\"captionLabelClasses\" [ngClass]=\"{'border-end border-1 pe-4': !isMobile}\">\r\n <div>\r\n {{serviceYearsLabel}}\r\n </div>\r\n <div [class]=\"captionLabelValueClass\">\r\n {{employeeMainInfo?.ServiceYears}}\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"flex-grow-1\" [ngClass]=\"{' ms-4': !isMobile && !isTablet, 'w-100': isTablet}\">\r\n <div [class]=\"vacationBalancesContainerClass\" [ngClass]=\"{'flex-wrap': isMobile,'w-100': isTablet}\">\r\n @for(vacationBalance of employeeMainInfo?.VacationBalances ; track vacationBalance ; let i = $index;){\r\n @if(i <= 2 || employeeMainInfo?.VacationBalances?.length == 4) {\r\n <div [class]=\"vacationBalanceItemClass\" [ngClass]=\"{'mb-2 w-40': isMobile}\">\r\n <div [class]=\"vacationBalanceHeaderClass\">\r\n <div [class]=\"vacationColorDotClass\">\r\n <div class=\"rounded rounded-circle\" style=\"height: 11px; width: 11px;\" [style.background-color]=\"vacationBalance.VacationTypeColor\"></div>\r\n </div>\r\n <div [class]=\"vacationTypeNameClass\">\r\n {{vacationBalance.VacationTypeName}}\r\n </div>\r\n </div>\r\n <div [class]=\"vacationBalanceValueRowClass\">\r\n <div [class]=\"vacationColorDotClass\">\r\n <div class=\"rounded rounded-circle invisible\" style=\"height: 11px; width: 11px;\"></div>\r\n </div>\r\n <div [class]=\"vacationBalanceValueClass\">{{vacationBalance.CurrentBalance | number:'1.2-2'}} {{vacationBalance.CurrentBalance! == 1 ? dayLabel : daysLabel}}</div>\r\n </div>\r\n </div>\r\n }\r\n }\r\n\r\n @if(employeeMainInfo?.VacationBalances && employeeMainInfo!.VacationBalances!.length > 4){\r\n <div [class]=\"vacationBalanceItemClass\">\r\n <div [class]=\"tooltipTriggerLinkClass\" id=\"otherVacationBalances\">\r\n <div [class]=\"vacationColorDotClass\">\r\n <div class=\"rounded rounded-circle\" style=\"height: 11px; width: 11px;\" [style.background-color]=\"defaultVacationBalanceColor\"></div>\r\n </div>\r\n <div [class]=\"tooltipTriggerTextClass\">\r\n +{{(employeeMainInfo!.VacationBalances!.length - 3)}} {{moreLabel}}\r\n </div>\r\n </div>\r\n <div [class]=\"vacationBalanceValueRowClass\" style=\"visibility: hidden\">\r\n <div [class]=\"vacationColorDotClass\">\r\n <div class=\"rounded rounded-circle\" style=\"height: 11px; width: 11px;\"></div>\r\n </div>\r\n <div class=\"mx-1 fw-medium fs-14 text-dark-gray\">{{moreLabel}}</div>\r\n </div>\r\n <dx-tooltip [target]=\"'#otherVacationBalances'\"\r\n [showEvent]=\"'mouseenter'\"\r\n [hideEvent]=\"'mouseleave'\">\r\n @for (vacationBalance of employeeMainInfo!.VacationBalances! ; track vacationBalance; let i = $index;){\r\n @if(i > 2){\r\n <div [class]=\"tooltipVacationRowClass\">\r\n <div [class]=\"tooltipVacationNameContainerClass\">\r\n\r\n <div [class]=\"vacationColorDotClass\">\r\n <div class=\"rounded rounded-circle\" style=\"height: 11px; width: 11px;\" [style.background-color]=\"vacationBalance.VacationTypeColor\"></div>\r\n </div>\r\n <div [class]=\"tooltipVacationNameClass\">\r\n {{vacationBalance.VacationTypeName}}\r\n </div>\r\n </div>\r\n <div>{{vacationBalance.CurrentBalance | number:'1.2-2'}} {{vacationBalance.CurrentBalance! == 1 ? dayLabel : daysLabel}}</div>\r\n </div>\r\n }\r\n }\r\n </dx-tooltip>\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n", dependencies: [{ kind: "ngmodule", type: DxTooltipModule }, { kind: "component", type: i1$1.DxTooltipComponent, selector: "dx-tooltip", inputs: ["animation", "closeOnOutsideClick", "container", "contentTemplate", "deferRendering", "disabled", "height", "hideEvent", "hideOnOutsideClick", "hideOnParentScroll", "hint", "hoverStateEnabled", "maxHeight", "maxWidth", "minHeight", "minWidth", "position", "rtlEnabled", "shading", "shadingColor", "showEvent", "target", "visible", "width", "wrapperAttr"], outputs: ["onContentReady", "onDisposing", "onHidden", "onHiding", "onInitialized", "onOptionChanged", "onShowing", "onShown", "animationChange", "closeOnOutsideClickChange", "containerChange", "contentTemplateChange", "deferRenderingChange", "disabledChange", "heightChange", "hideEventChange", "hideOnOutsideClickChange", "hideOnParentScrollChange", "hintChange", "hoverStateEnabledChange", "maxHeightChange", "maxWidthChange", "minHeightChange", "minWidthChange", "positionChange", "rtlEnabledChange", "shadingChange", "shadingColorChange", "showEventChange", "targetChange", "visibleChange", "widthChange", "wrapperAttrChange"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: FontAwesomeModule }, { kind: "pipe", type: DecimalPipe, name: "number" }, { kind: "component", type: BayanEmployeeBadgeComponent, selector: "bayan-employee-badge", inputs: ["badge", "width", "height", "imageClass", "badgeClass"], outputs: ["employeePhotoError"] }, { kind: "component", type: SkyShortcutIconComponent, selector: "sky-shortcut-icon", inputs: ["shortcut", "itemClass", "iconContainerClass", "iconClass", "textClass"], outputs: ["onClicked"] }] });
388
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: HrMyMainDetailsWidgetComponent, deps: [{ token: i1.HttpClient }, { token: HrConstantsService }, { token: HrLexiconService }], target: i0.ɵɵFactoryTarget.Component });
389
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: HrMyMainDetailsWidgetComponent, isStandalone: true, selector: "hr-my-main-details-widget", inputs: { badgeClass: "badgeClass", badgeImageClass: "badgeImageClass", badgeWidth: "badgeWidth", badgeHeight: "badgeHeight", employeeInfoContainerClass: "employeeInfoContainerClass", employeeDetailsClass: "employeeDetailsClass", employeeNameContainerClass: "employeeNameContainerClass", employeeNameClass: "employeeNameClass", employeePositionClass: "employeePositionClass", employeeGradeClass: "employeeGradeClass", containerClass: "containerClass", cardBodyClass: "cardBodyClass", headerRowClass: "headerRowClass", shortcutsContainerClass: "shortcutsContainerClass", shortcutItemClass: "shortcutItemClass", shortcutIconContainerClass: "shortcutIconContainerClass", shortcutIconClass: "shortcutIconClass", shortcutTextClass: "shortcutTextClass", detailsRowClass: "detailsRowClass", reportingBlockClass: "reportingBlockClass", captionLabelClasses: "captionLabelClasses", captionLabelValueClass: "captionLabelValueClass", vacationBalancesContainerClass: "vacationBalancesContainerClass", vacationBalanceItemClass: "vacationBalanceItemClass", vacationBalanceHeaderClass: "vacationBalanceHeaderClass", vacationColorDotClass: "vacationColorDotClass", vacationTypeNameClass: "vacationTypeNameClass", vacationBalanceValueRowClass: "vacationBalanceValueRowClass", vacationBalanceValueClass: "vacationBalanceValueClass", tooltipTriggerLinkClass: "tooltipTriggerLinkClass", tooltipTriggerTextClass: "tooltipTriggerTextClass", tooltipVacationRowClass: "tooltipVacationRowClass", tooltipVacationNameContainerClass: "tooltipVacationNameContainerClass", tooltipVacationNameClass: "tooltipVacationNameClass", defaultVacationBalanceColor: "defaultVacationBalanceColor", defaultVacationColor: "defaultVacationColor", baseUrl: "baseUrl", isMobile: "isMobile", isTablet: "isTablet", shortcuts: "shortcuts" }, outputs: { onShortcutClicked: "onShortcutClicked", isLoadingChanged: "isLoadingChanged" }, ngImport: i0, template: "<div [class]=\"containerClass\">\r\n <div [class]=\"cardBodyClass\">\r\n <div [class]=\"headerRowClass\">\r\n <div>\r\n @if(employeeMainInfo!=null){\r\n <div [class]=\"employeeInfoContainerClass\">\r\n <bayan-employee-badge [badge]=\"employeeBadge\"\r\n [badgeClass]=\"badgeClass\"\r\n [imageClass]=\"badgeImageClass\"\r\n [width]=\"badgeWidth\"\r\n [height]=\"badgeHeight\"\r\n (employeePhotoError)=\"handleEmployeePhotoError()\"></bayan-employee-badge>\r\n\r\n <div [class]=\"employeeDetailsClass\">\r\n <div [class]=\"employeeNameContainerClass\">\r\n <div [class]=\"employeeNameClass\"\r\n data-bs-toggle=\"tooltip\" [title]=\"employeeMainInfo.EmployeeNumber+' | '+ employeeMainInfo.EmployeeName\">\r\n {{employeeMainInfo.EmployeeNumber + ' | ' + employeeMainInfo.EmployeeName}}\r\n </div>\r\n </div>\r\n @if(employeeMainInfo.PositionName != null && employeeMainInfo.PositionName != ''){\r\n <div [class]=\"employeePositionClass\"\r\n data-bs-toggle=\"tooltip\"\r\n [title]=\"employeeMainInfo.PositionName\">\r\n {{employeeMainInfo.PositionName}}\r\n </div>\r\n }\r\n @if(employeeMainInfo.GradeName !=null){\r\n <div [class]=\"employeeGradeClass\" [title]=\"employeeMainInfo.GradeName\">\r\n {{employeeMainInfo.GradeName}}\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n }\r\n </div>\r\n <div [class]=\"shortcutsContainerClass\">\r\n @for(Icon of shortcuts ; track Icon ; let i = $index;){\r\n <sky-shortcut-icon [shortcut]=\"Icon\"\r\n [itemClass]=\"shortcutItemClass\"\r\n [iconContainerClass]=\"shortcutIconContainerClass\"\r\n [iconClass]=\"shortcutIconClass\"\r\n [textClass]=\"shortcutTextClass\"\r\n (onClicked)=\"shortcutClicked($event)\"></sky-shortcut-icon>\r\n }\r\n </div>\r\n </div>\r\n <div [class]=\"detailsRowClass\" [ngClass]=\"{'flex-wrap': isMobile || isTablet}\">\r\n <div [class]=\"reportingBlockClass\" [ngClass]=\"{'mb-3': isMobile}\">\r\n <div [class]=\"captionLabelClasses + ' me-5'\">\r\n <div>\r\n {{'ReportingTo' | hrTranslate}}\r\n </div>\r\n <div [class]=\"captionLabelValueClass\">\r\n @if(employeeMainInfo?.ReportingTo){\r\n {{employeeMainInfo?.ReportingTo}}\r\n }@else{\r\n {{'NotAnknown' | hrTranslate}}\r\n }\r\n </div>\r\n </div>\r\n <div [class]=\"captionLabelClasses\" [ngClass]=\"{'border-end border-1 pe-4': !isMobile}\">\r\n <div>\r\n {{'ServiceYears' | hrTranslate}}\r\n </div>\r\n <div [class]=\"captionLabelValueClass\">\r\n {{employeeMainInfo?.ServiceYears}}\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"flex-grow-1\" [ngClass]=\"{' ms-4': !isMobile && !isTablet, 'w-100': isTablet}\">\r\n <div [class]=\"vacationBalancesContainerClass\" [ngClass]=\"{'flex-wrap': isMobile,'w-100': isTablet}\">\r\n @for(vacationBalance of employeeMainInfo?.VacationBalances ; track vacationBalance ; let i = $index;){\r\n @if(i <= 2 || employeeMainInfo?.VacationBalances?.length == 4) {\r\n <div [class]=\"vacationBalanceItemClass\" [ngClass]=\"{'mb-2 w-40': isMobile}\">\r\n <div [class]=\"vacationBalanceHeaderClass\">\r\n <div [class]=\"vacationColorDotClass\">\r\n <div class=\"rounded rounded-circle\" style=\"height: 11px; width: 11px;\" [style.background-color]=\"vacationBalance.VacationTypeColor\"></div>\r\n </div>\r\n <div [class]=\"vacationTypeNameClass\">\r\n {{vacationBalance.VacationTypeName}}\r\n </div>\r\n </div>\r\n <div [class]=\"vacationBalanceValueRowClass\">\r\n <div [class]=\"vacationColorDotClass\">\r\n <div class=\"rounded rounded-circle invisible\" style=\"height: 11px; width: 11px;\"></div>\r\n </div>\r\n <div [class]=\"vacationBalanceValueClass\">{{vacationBalance.CurrentBalance | number:'1.2-2'}} {{(vacationBalance.CurrentBalance! == 1 ? 'day' : 'days') | hrTranslate}}</div>\r\n </div>\r\n </div>\r\n }\r\n }\r\n\r\n @if(employeeMainInfo?.VacationBalances && employeeMainInfo!.VacationBalances!.length > 4){\r\n <div [class]=\"vacationBalanceItemClass\">\r\n <div [class]=\"tooltipTriggerLinkClass\" id=\"otherVacationBalances\">\r\n <div [class]=\"vacationColorDotClass\">\r\n <div class=\"rounded rounded-circle\" style=\"height: 11px; width: 11px;\" [style.background-color]=\"defaultVacationBalanceColor\"></div>\r\n </div>\r\n <div [class]=\"tooltipTriggerTextClass\">\r\n +{{(employeeMainInfo!.VacationBalances!.length - 3)}} {{'More' | hrTranslate}}\r\n </div>\r\n </div>\r\n <div [class]=\"vacationBalanceValueRowClass\" style=\"visibility: hidden\">\r\n <div [class]=\"vacationColorDotClass\">\r\n <div class=\"rounded rounded-circle\" style=\"height: 11px; width: 11px;\"></div>\r\n </div>\r\n <div class=\"mx-1 fw-medium fs-14 text-dark-gray\">{{'More' | hrTranslate}}</div>\r\n </div>\r\n <dx-tooltip [target]=\"'#otherVacationBalances'\"\r\n [showEvent]=\"'mouseenter'\"\r\n [hideEvent]=\"'mouseleave'\">\r\n @for (vacationBalance of employeeMainInfo!.VacationBalances! ; track vacationBalance; let i = $index;){\r\n @if(i > 2){\r\n <div [class]=\"tooltipVacationRowClass\">\r\n <div [class]=\"tooltipVacationNameContainerClass\">\r\n\r\n <div [class]=\"vacationColorDotClass\">\r\n <div class=\"rounded rounded-circle\" style=\"height: 11px; width: 11px;\" [style.background-color]=\"vacationBalance.VacationTypeColor\"></div>\r\n </div>\r\n <div [class]=\"tooltipVacationNameClass\">\r\n {{vacationBalance.VacationTypeName}}\r\n </div>\r\n </div>\r\n <div>{{vacationBalance.CurrentBalance | number:'1.2-2'}} {{(vacationBalance.CurrentBalance! == 1 ? 'day' : 'days') | hrTranslate}}</div>\r\n </div>\r\n }\r\n }\r\n </dx-tooltip>\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n", dependencies: [{ kind: "ngmodule", type: DxTooltipModule }, { kind: "component", type: i1$1.DxTooltipComponent, selector: "dx-tooltip", inputs: ["animation", "closeOnOutsideClick", "container", "contentTemplate", "deferRendering", "disabled", "height", "hideEvent", "hideOnOutsideClick", "hideOnParentScroll", "hint", "hoverStateEnabled", "maxHeight", "maxWidth", "minHeight", "minWidth", "position", "rtlEnabled", "shading", "shadingColor", "showEvent", "target", "visible", "width", "wrapperAttr"], outputs: ["onContentReady", "onDisposing", "onHidden", "onHiding", "onInitialized", "onOptionChanged", "onShowing", "onShown", "animationChange", "closeOnOutsideClickChange", "containerChange", "contentTemplateChange", "deferRenderingChange", "disabledChange", "heightChange", "hideEventChange", "hideOnOutsideClickChange", "hideOnParentScrollChange", "hintChange", "hoverStateEnabledChange", "maxHeightChange", "maxWidthChange", "minHeightChange", "minWidthChange", "positionChange", "rtlEnabledChange", "shadingChange", "shadingColorChange", "showEventChange", "targetChange", "visibleChange", "widthChange", "wrapperAttrChange"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: FontAwesomeModule }, { kind: "pipe", type: DecimalPipe, name: "number" }, { kind: "component", type: BayanEmployeeBadgeComponent, selector: "bayan-employee-badge", inputs: ["badge", "width", "height", "imageClass", "badgeClass"], outputs: ["employeePhotoError"] }, { kind: "component", type: SkyShortcutIconComponent, selector: "sky-shortcut-icon", inputs: ["shortcut", "itemClass", "iconContainerClass", "iconClass", "textClass"], outputs: ["onClicked"] }, { kind: "pipe", type: HrTranslatePipe, name: "hrTranslate" }] });
181
390
  }
182
391
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: HrMyMainDetailsWidgetComponent, decorators: [{
183
392
  type: Component,
184
- args: [{ selector: 'hr-my-main-details-widget', standalone: true, imports: [DxTooltipModule, NgClass, FontAwesomeModule, DecimalPipe, BayanEmployeeBadgeComponent, SkyShortcutIconComponent], template: "<div [class]=\"containerClass\">\r\n <div [class]=\"cardBodyClass\">\r\n <div [class]=\"headerRowClass\">\r\n <div>\r\n @if(employeeMainInfo!=null){\r\n <div [class]=\"employeeInfoContainerClass\">\r\n <bayan-employee-badge [badge]=\"employeeBadge\"\r\n [badgeClass]=\"badgeClass\"\r\n [imageClass]=\"badgeImageClass\"\r\n [width]=\"badgeWidth\"\r\n [height]=\"badgeHeight\"\r\n (employeePhotoError)=\"handleEmployeePhotoError()\"></bayan-employee-badge>\r\n\r\n <div [class]=\"employeeDetailsClass\">\r\n <div [class]=\"employeeNameContainerClass\">\r\n <div [class]=\"employeeNameClass\"\r\n data-bs-toggle=\"tooltip\" [title]=\"employeeMainInfo.EmployeeNumber+' | '+ employeeMainInfo.EmployeeName\">\r\n {{employeeMainInfo.EmployeeNumber + ' | ' + employeeMainInfo.EmployeeName}}\r\n </div>\r\n </div>\r\n @if(employeeMainInfo.PositionName != null && employeeMainInfo.PositionName != ''){\r\n <div [class]=\"employeePositionClass\"\r\n data-bs-toggle=\"tooltip\"\r\n [title]=\"employeeMainInfo.PositionName\">\r\n {{employeeMainInfo.PositionName}}\r\n </div>\r\n }\r\n @if(employeeMainInfo.GradeName !=null){\r\n <div [class]=\"employeeGradeClass\" [title]=\"employeeMainInfo.GradeName\">\r\n {{employeeMainInfo.GradeName}}\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n }\r\n </div>\r\n <div [class]=\"shortcutsContainerClass\">\r\n @for(Icon of shortcuts ; track Icon ; let i = $index;){\r\n <sky-shortcut-icon [shortcut]=\"Icon\"\r\n [itemClass]=\"shortcutItemClass\"\r\n [iconContainerClass]=\"shortcutIconContainerClass\"\r\n [iconClass]=\"shortcutIconClass\"\r\n [textClass]=\"shortcutTextClass\"\r\n (onClicked)=\"shortcutClicked($event)\"></sky-shortcut-icon>\r\n }\r\n </div>\r\n </div>\r\n <div [class]=\"detailsRowClass\" [ngClass]=\"{'flex-wrap': isMobile || isTablet}\">\r\n <div [class]=\"reportingBlockClass\" [ngClass]=\"{'mb-3': isMobile}\">\r\n <div [class]=\"captionLabelClasses + ' me-5'\">\r\n <div>\r\n {{reportingToLabel}}\r\n </div>\r\n <div [class]=\"captionLabelValueClass\">\r\n @if(employeeMainInfo?.ReportingTo){\r\n {{employeeMainInfo?.ReportingTo}}\r\n }@else{\r\n {{emptyReportingToLabel}}\r\n }\r\n </div>\r\n </div>\r\n <div [class]=\"captionLabelClasses\" [ngClass]=\"{'border-end border-1 pe-4': !isMobile}\">\r\n <div>\r\n {{serviceYearsLabel}}\r\n </div>\r\n <div [class]=\"captionLabelValueClass\">\r\n {{employeeMainInfo?.ServiceYears}}\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"flex-grow-1\" [ngClass]=\"{' ms-4': !isMobile && !isTablet, 'w-100': isTablet}\">\r\n <div [class]=\"vacationBalancesContainerClass\" [ngClass]=\"{'flex-wrap': isMobile,'w-100': isTablet}\">\r\n @for(vacationBalance of employeeMainInfo?.VacationBalances ; track vacationBalance ; let i = $index;){\r\n @if(i <= 2 || employeeMainInfo?.VacationBalances?.length == 4) {\r\n <div [class]=\"vacationBalanceItemClass\" [ngClass]=\"{'mb-2 w-40': isMobile}\">\r\n <div [class]=\"vacationBalanceHeaderClass\">\r\n <div [class]=\"vacationColorDotClass\">\r\n <div class=\"rounded rounded-circle\" style=\"height: 11px; width: 11px;\" [style.background-color]=\"vacationBalance.VacationTypeColor\"></div>\r\n </div>\r\n <div [class]=\"vacationTypeNameClass\">\r\n {{vacationBalance.VacationTypeName}}\r\n </div>\r\n </div>\r\n <div [class]=\"vacationBalanceValueRowClass\">\r\n <div [class]=\"vacationColorDotClass\">\r\n <div class=\"rounded rounded-circle invisible\" style=\"height: 11px; width: 11px;\"></div>\r\n </div>\r\n <div [class]=\"vacationBalanceValueClass\">{{vacationBalance.CurrentBalance | number:'1.2-2'}} {{vacationBalance.CurrentBalance! == 1 ? dayLabel : daysLabel}}</div>\r\n </div>\r\n </div>\r\n }\r\n }\r\n\r\n @if(employeeMainInfo?.VacationBalances && employeeMainInfo!.VacationBalances!.length > 4){\r\n <div [class]=\"vacationBalanceItemClass\">\r\n <div [class]=\"tooltipTriggerLinkClass\" id=\"otherVacationBalances\">\r\n <div [class]=\"vacationColorDotClass\">\r\n <div class=\"rounded rounded-circle\" style=\"height: 11px; width: 11px;\" [style.background-color]=\"defaultVacationBalanceColor\"></div>\r\n </div>\r\n <div [class]=\"tooltipTriggerTextClass\">\r\n +{{(employeeMainInfo!.VacationBalances!.length - 3)}} {{moreLabel}}\r\n </div>\r\n </div>\r\n <div [class]=\"vacationBalanceValueRowClass\" style=\"visibility: hidden\">\r\n <div [class]=\"vacationColorDotClass\">\r\n <div class=\"rounded rounded-circle\" style=\"height: 11px; width: 11px;\"></div>\r\n </div>\r\n <div class=\"mx-1 fw-medium fs-14 text-dark-gray\">{{moreLabel}}</div>\r\n </div>\r\n <dx-tooltip [target]=\"'#otherVacationBalances'\"\r\n [showEvent]=\"'mouseenter'\"\r\n [hideEvent]=\"'mouseleave'\">\r\n @for (vacationBalance of employeeMainInfo!.VacationBalances! ; track vacationBalance; let i = $index;){\r\n @if(i > 2){\r\n <div [class]=\"tooltipVacationRowClass\">\r\n <div [class]=\"tooltipVacationNameContainerClass\">\r\n\r\n <div [class]=\"vacationColorDotClass\">\r\n <div class=\"rounded rounded-circle\" style=\"height: 11px; width: 11px;\" [style.background-color]=\"vacationBalance.VacationTypeColor\"></div>\r\n </div>\r\n <div [class]=\"tooltipVacationNameClass\">\r\n {{vacationBalance.VacationTypeName}}\r\n </div>\r\n </div>\r\n <div>{{vacationBalance.CurrentBalance | number:'1.2-2'}} {{vacationBalance.CurrentBalance! == 1 ? dayLabel : daysLabel}}</div>\r\n </div>\r\n }\r\n }\r\n </dx-tooltip>\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n" }]
185
- }], ctorParameters: () => [{ type: i1.HttpClient }, { type: HrConstantsService }], propDecorators: { onShortcutClicked: [{
393
+ args: [{ selector: 'hr-my-main-details-widget', standalone: true, imports: [DxTooltipModule, NgClass, FontAwesomeModule, DecimalPipe, BayanEmployeeBadgeComponent, SkyShortcutIconComponent, HrTranslatePipe], template: "<div [class]=\"containerClass\">\r\n <div [class]=\"cardBodyClass\">\r\n <div [class]=\"headerRowClass\">\r\n <div>\r\n @if(employeeMainInfo!=null){\r\n <div [class]=\"employeeInfoContainerClass\">\r\n <bayan-employee-badge [badge]=\"employeeBadge\"\r\n [badgeClass]=\"badgeClass\"\r\n [imageClass]=\"badgeImageClass\"\r\n [width]=\"badgeWidth\"\r\n [height]=\"badgeHeight\"\r\n (employeePhotoError)=\"handleEmployeePhotoError()\"></bayan-employee-badge>\r\n\r\n <div [class]=\"employeeDetailsClass\">\r\n <div [class]=\"employeeNameContainerClass\">\r\n <div [class]=\"employeeNameClass\"\r\n data-bs-toggle=\"tooltip\" [title]=\"employeeMainInfo.EmployeeNumber+' | '+ employeeMainInfo.EmployeeName\">\r\n {{employeeMainInfo.EmployeeNumber + ' | ' + employeeMainInfo.EmployeeName}}\r\n </div>\r\n </div>\r\n @if(employeeMainInfo.PositionName != null && employeeMainInfo.PositionName != ''){\r\n <div [class]=\"employeePositionClass\"\r\n data-bs-toggle=\"tooltip\"\r\n [title]=\"employeeMainInfo.PositionName\">\r\n {{employeeMainInfo.PositionName}}\r\n </div>\r\n }\r\n @if(employeeMainInfo.GradeName !=null){\r\n <div [class]=\"employeeGradeClass\" [title]=\"employeeMainInfo.GradeName\">\r\n {{employeeMainInfo.GradeName}}\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n }\r\n </div>\r\n <div [class]=\"shortcutsContainerClass\">\r\n @for(Icon of shortcuts ; track Icon ; let i = $index;){\r\n <sky-shortcut-icon [shortcut]=\"Icon\"\r\n [itemClass]=\"shortcutItemClass\"\r\n [iconContainerClass]=\"shortcutIconContainerClass\"\r\n [iconClass]=\"shortcutIconClass\"\r\n [textClass]=\"shortcutTextClass\"\r\n (onClicked)=\"shortcutClicked($event)\"></sky-shortcut-icon>\r\n }\r\n </div>\r\n </div>\r\n <div [class]=\"detailsRowClass\" [ngClass]=\"{'flex-wrap': isMobile || isTablet}\">\r\n <div [class]=\"reportingBlockClass\" [ngClass]=\"{'mb-3': isMobile}\">\r\n <div [class]=\"captionLabelClasses + ' me-5'\">\r\n <div>\r\n {{'ReportingTo' | hrTranslate}}\r\n </div>\r\n <div [class]=\"captionLabelValueClass\">\r\n @if(employeeMainInfo?.ReportingTo){\r\n {{employeeMainInfo?.ReportingTo}}\r\n }@else{\r\n {{'NotAnknown' | hrTranslate}}\r\n }\r\n </div>\r\n </div>\r\n <div [class]=\"captionLabelClasses\" [ngClass]=\"{'border-end border-1 pe-4': !isMobile}\">\r\n <div>\r\n {{'ServiceYears' | hrTranslate}}\r\n </div>\r\n <div [class]=\"captionLabelValueClass\">\r\n {{employeeMainInfo?.ServiceYears}}\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"flex-grow-1\" [ngClass]=\"{' ms-4': !isMobile && !isTablet, 'w-100': isTablet}\">\r\n <div [class]=\"vacationBalancesContainerClass\" [ngClass]=\"{'flex-wrap': isMobile,'w-100': isTablet}\">\r\n @for(vacationBalance of employeeMainInfo?.VacationBalances ; track vacationBalance ; let i = $index;){\r\n @if(i <= 2 || employeeMainInfo?.VacationBalances?.length == 4) {\r\n <div [class]=\"vacationBalanceItemClass\" [ngClass]=\"{'mb-2 w-40': isMobile}\">\r\n <div [class]=\"vacationBalanceHeaderClass\">\r\n <div [class]=\"vacationColorDotClass\">\r\n <div class=\"rounded rounded-circle\" style=\"height: 11px; width: 11px;\" [style.background-color]=\"vacationBalance.VacationTypeColor\"></div>\r\n </div>\r\n <div [class]=\"vacationTypeNameClass\">\r\n {{vacationBalance.VacationTypeName}}\r\n </div>\r\n </div>\r\n <div [class]=\"vacationBalanceValueRowClass\">\r\n <div [class]=\"vacationColorDotClass\">\r\n <div class=\"rounded rounded-circle invisible\" style=\"height: 11px; width: 11px;\"></div>\r\n </div>\r\n <div [class]=\"vacationBalanceValueClass\">{{vacationBalance.CurrentBalance | number:'1.2-2'}} {{(vacationBalance.CurrentBalance! == 1 ? 'day' : 'days') | hrTranslate}}</div>\r\n </div>\r\n </div>\r\n }\r\n }\r\n\r\n @if(employeeMainInfo?.VacationBalances && employeeMainInfo!.VacationBalances!.length > 4){\r\n <div [class]=\"vacationBalanceItemClass\">\r\n <div [class]=\"tooltipTriggerLinkClass\" id=\"otherVacationBalances\">\r\n <div [class]=\"vacationColorDotClass\">\r\n <div class=\"rounded rounded-circle\" style=\"height: 11px; width: 11px;\" [style.background-color]=\"defaultVacationBalanceColor\"></div>\r\n </div>\r\n <div [class]=\"tooltipTriggerTextClass\">\r\n +{{(employeeMainInfo!.VacationBalances!.length - 3)}} {{'More' | hrTranslate}}\r\n </div>\r\n </div>\r\n <div [class]=\"vacationBalanceValueRowClass\" style=\"visibility: hidden\">\r\n <div [class]=\"vacationColorDotClass\">\r\n <div class=\"rounded rounded-circle\" style=\"height: 11px; width: 11px;\"></div>\r\n </div>\r\n <div class=\"mx-1 fw-medium fs-14 text-dark-gray\">{{'More' | hrTranslate}}</div>\r\n </div>\r\n <dx-tooltip [target]=\"'#otherVacationBalances'\"\r\n [showEvent]=\"'mouseenter'\"\r\n [hideEvent]=\"'mouseleave'\">\r\n @for (vacationBalance of employeeMainInfo!.VacationBalances! ; track vacationBalance; let i = $index;){\r\n @if(i > 2){\r\n <div [class]=\"tooltipVacationRowClass\">\r\n <div [class]=\"tooltipVacationNameContainerClass\">\r\n\r\n <div [class]=\"vacationColorDotClass\">\r\n <div class=\"rounded rounded-circle\" style=\"height: 11px; width: 11px;\" [style.background-color]=\"vacationBalance.VacationTypeColor\"></div>\r\n </div>\r\n <div [class]=\"tooltipVacationNameClass\">\r\n {{vacationBalance.VacationTypeName}}\r\n </div>\r\n </div>\r\n <div>{{vacationBalance.CurrentBalance | number:'1.2-2'}} {{(vacationBalance.CurrentBalance! == 1 ? 'day' : 'days') | hrTranslate}}</div>\r\n </div>\r\n }\r\n }\r\n </dx-tooltip>\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n" }]
394
+ }], ctorParameters: () => [{ type: i1.HttpClient }, { type: HrConstantsService }, { type: HrLexiconService }], propDecorators: { onShortcutClicked: [{
186
395
  type: Output
187
396
  }], isLoadingChanged: [{
188
397
  type: Output
@@ -254,22 +463,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
254
463
  type: Input
255
464
  }], tooltipVacationNameClass: [{
256
465
  type: Input
257
- }], reportingToLabel: [{
258
- type: Input
259
- }], emptyReportingToLabel: [{
260
- type: Input
261
- }], serviceYearsLabel: [{
262
- type: Input
263
- }], moreLabel: [{
264
- type: Input
265
- }], dayLabel: [{
266
- type: Input
267
- }], daysLabel: [{
268
- type: Input
269
- }], yearsLabel: [{
270
- type: Input
271
- }], monthsLabel: [{
272
- type: Input
273
466
  }], defaultVacationBalanceColor: [{
274
467
  type: Input
275
468
  }], defaultVacationColor: [{
@@ -315,7 +508,6 @@ class HrEventItemComponent {
315
508
  selectedLanguage = 'en';
316
509
  selectedEventType = null;
317
510
  weekendWarningDescription = null;
318
- labels;
319
511
  eventIconClass = 'fs-6 text-primary pe-2';
320
512
  eventNameBoldClass = 'fw-medium';
321
513
  eventDescriptionClass = 'text-primary fw-medium';
@@ -330,11 +522,11 @@ class HrEventItemComponent {
330
522
  isBirthday(event) { return event.EventType === EventTypeEnum.Birthdays; }
331
523
  hasPropertyBadge(event) { return this.showProperty && !!event.PropertySymbol; }
332
524
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: HrEventItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
333
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: HrEventItemComponent, isStandalone: true, selector: "hr-event-item", inputs: { events: "events", showDates: "showDates", showProperty: "showProperty", selectedLanguage: "selectedLanguage", selectedEventType: "selectedEventType", weekendWarningDescription: "weekendWarningDescription", labels: "labels", eventIconClass: "eventIconClass", eventNameBoldClass: "eventNameBoldClass", eventDescriptionClass: "eventDescriptionClass", propertyBadgeClass: "propertyBadgeClass", noEventsTextClass: "noEventsTextClass", warningTextClass: "warningTextClass", dateFormat: "dateFormat" }, ngImport: i0, template: "@if (events.length > 0) {\r\n<div>\r\n @for (event of events; track event) {\r\n <div [class]=\"'d-flex ' + (showDates ? 'my-3' : 'my-1')\">\r\n <fa-icon [icon]=\"isBirthday(event) ? cakeCandles : treePalm\"\r\n [class]=\"eventIconClass\"\r\n [title]=\"isBirthday(event) ? labels.birthday : labels.publicHoliday\">\r\n </fa-icon>\r\n\r\n <div>\r\n @if (isBirthday(event)) {\r\n @if (hasPropertyBadge(event)) {\r\n <span [class]=\"propertyBadgeClass\" [title]=\"event.PropertyName!\">{{ event.PropertySymbol }}</span>\r\n }\r\n @if (isArabic) {\r\n <span>{{ labels.birthday }}</span>\r\n <span [class]=\"eventNameBoldClass\">{{ ' ' + event.Name + ' ' }}</span>\r\n @if (event.IsIn2Days) { <span>{{ labels.during }} </span> }\r\n } @else {\r\n <span [class]=\"eventNameBoldClass\">{{ event.Name }}'s </span>\r\n <span>{{ labels.birthday }} {{ (event.IsIn2Days ? labels.isIn : labels.is) | lowercase }} </span>\r\n }\r\n } @else {\r\n @if (isArabic) {\r\n <span [class]=\"eventNameBoldClass\">{{ event.Name }}</span> <span> {{ labels.in + ' ' }}</span>\r\n } @else {\r\n <span [class]=\"eventNameBoldClass\">{{ event.Name }} </span><span>{{ ' ' + (labels.is | lowercase) }} </span>\r\n }\r\n }\r\n\r\n <span [class]=\"eventDescriptionClass\">{{ event.Description }}</span>\r\n\r\n @if (!isBirthday(event) && showDates && event.StartDate && event.EndDate) {\r\n <span>{{ ' (' + (event.StartDate | date:dateFormat) + ' - ' + (event.EndDate | date:dateFormat) + ')' }}</span>\r\n }\r\n </div>\r\n </div>\r\n }\r\n</div>\r\n} @else {\r\n@if (weekendWarningDescription) {\r\n<div [class]=\"warningTextClass\">{{ weekendWarningDescription }}</div>\r\n} @else {\r\n<div [class]=\"noEventsTextClass\">{{ labels.noEvents }}</div>\r\n}\r\n}\r\n", dependencies: [{ kind: "ngmodule", type: FontAwesomeModule }, { kind: "component", type: i1$2.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "animation", "mask", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }, { kind: "pipe", type: DatePipe, name: "date" }, { kind: "pipe", type: LowerCasePipe, name: "lowercase" }] });
525
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: HrEventItemComponent, isStandalone: true, selector: "hr-event-item", inputs: { events: "events", showDates: "showDates", showProperty: "showProperty", selectedLanguage: "selectedLanguage", selectedEventType: "selectedEventType", weekendWarningDescription: "weekendWarningDescription", eventIconClass: "eventIconClass", eventNameBoldClass: "eventNameBoldClass", eventDescriptionClass: "eventDescriptionClass", propertyBadgeClass: "propertyBadgeClass", noEventsTextClass: "noEventsTextClass", warningTextClass: "warningTextClass", dateFormat: "dateFormat" }, ngImport: i0, template: "@if (events.length > 0) {\r\n<div>\r\n @for (event of events; track event) {\r\n <div [class]=\"'d-flex ' + (showDates ? 'my-3' : 'my-1')\">\r\n <fa-icon [icon]=\"isBirthday(event) ? cakeCandles : treePalm\"\r\n [class]=\"eventIconClass\"\r\n [title]=\"isBirthday(event) ? ('Birthday' | hrTranslate) : ('PublicHoliday' | hrTranslate)\">\r\n </fa-icon>\r\n\r\n <div>\r\n @if (isBirthday(event)) {\r\n @if (hasPropertyBadge(event)) {\r\n <span [class]=\"propertyBadgeClass\" [title]=\"event.PropertyName!\">{{ event.PropertySymbol }}</span>\r\n }\r\n @if (isArabic) {\r\n <span>{{ 'Birthday' | hrTranslate }}</span>\r\n <span [class]=\"eventNameBoldClass\">{{ ' ' + event.Name + ' ' }}</span>\r\n @if (event.IsIn2Days) { <span>{{ 'During' | hrTranslate }} </span> }\r\n } @else {\r\n <span [class]=\"eventNameBoldClass\">{{ event.Name }}'s </span>\r\n <span>{{ ('Birthday' | hrTranslate) + ' ' + ((event.IsIn2Days ? ('isIn' | hrTranslate) : ('is' | hrTranslate)) | lowercase) }} </span>\r\n }\r\n } @else {\r\n @if (isArabic) {\r\n <span [class]=\"eventNameBoldClass\">{{ event.Name }}</span> <span> {{ ('In' | hrTranslate) + ' ' }}</span>\r\n } @else {\r\n <span [class]=\"eventNameBoldClass\">{{ event.Name }} </span><span>{{ ' ' + (('is' | hrTranslate) | lowercase) }} </span>\r\n }\r\n }\r\n\r\n <span [class]=\"eventDescriptionClass\">{{ event.Description | hrTranslate }}</span>\r\n\r\n @if (!isBirthday(event) && showDates && event.StartDate && event.EndDate) {\r\n <span>{{ ' (' + (event.StartDate | date:dateFormat) + ' - ' + (event.EndDate | date:dateFormat) + ')' }}</span>\r\n }\r\n </div>\r\n </div>\r\n }\r\n</div>\r\n} @else {\r\n@if (weekendWarningDescription) {\r\n<div [class]=\"warningTextClass\">{{ weekendWarningDescription }}</div>\r\n} @else {\r\n<div [class]=\"noEventsTextClass\">{{ 'NoEvents' | hrTranslate }}</div>\r\n}\r\n}\r\n", dependencies: [{ kind: "ngmodule", type: FontAwesomeModule }, { kind: "component", type: i1$2.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "animation", "mask", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }, { kind: "pipe", type: DatePipe, name: "date" }, { kind: "pipe", type: LowerCasePipe, name: "lowercase" }, { kind: "pipe", type: HrTranslatePipe, name: "hrTranslate" }] });
334
526
  }
335
527
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: HrEventItemComponent, decorators: [{
336
528
  type: Component,
337
- args: [{ selector: 'hr-event-item', standalone: true, imports: [FontAwesomeModule, DatePipe, LowerCasePipe], template: "@if (events.length > 0) {\r\n<div>\r\n @for (event of events; track event) {\r\n <div [class]=\"'d-flex ' + (showDates ? 'my-3' : 'my-1')\">\r\n <fa-icon [icon]=\"isBirthday(event) ? cakeCandles : treePalm\"\r\n [class]=\"eventIconClass\"\r\n [title]=\"isBirthday(event) ? labels.birthday : labels.publicHoliday\">\r\n </fa-icon>\r\n\r\n <div>\r\n @if (isBirthday(event)) {\r\n @if (hasPropertyBadge(event)) {\r\n <span [class]=\"propertyBadgeClass\" [title]=\"event.PropertyName!\">{{ event.PropertySymbol }}</span>\r\n }\r\n @if (isArabic) {\r\n <span>{{ labels.birthday }}</span>\r\n <span [class]=\"eventNameBoldClass\">{{ ' ' + event.Name + ' ' }}</span>\r\n @if (event.IsIn2Days) { <span>{{ labels.during }} </span> }\r\n } @else {\r\n <span [class]=\"eventNameBoldClass\">{{ event.Name }}'s </span>\r\n <span>{{ labels.birthday }} {{ (event.IsIn2Days ? labels.isIn : labels.is) | lowercase }} </span>\r\n }\r\n } @else {\r\n @if (isArabic) {\r\n <span [class]=\"eventNameBoldClass\">{{ event.Name }}</span> <span> {{ labels.in + ' ' }}</span>\r\n } @else {\r\n <span [class]=\"eventNameBoldClass\">{{ event.Name }} </span><span>{{ ' ' + (labels.is | lowercase) }} </span>\r\n }\r\n }\r\n\r\n <span [class]=\"eventDescriptionClass\">{{ event.Description }}</span>\r\n\r\n @if (!isBirthday(event) && showDates && event.StartDate && event.EndDate) {\r\n <span>{{ ' (' + (event.StartDate | date:dateFormat) + ' - ' + (event.EndDate | date:dateFormat) + ')' }}</span>\r\n }\r\n </div>\r\n </div>\r\n }\r\n</div>\r\n} @else {\r\n@if (weekendWarningDescription) {\r\n<div [class]=\"warningTextClass\">{{ weekendWarningDescription }}</div>\r\n} @else {\r\n<div [class]=\"noEventsTextClass\">{{ labels.noEvents }}</div>\r\n}\r\n}\r\n" }]
529
+ args: [{ selector: 'hr-event-item', standalone: true, imports: [FontAwesomeModule, DatePipe, LowerCasePipe, HrTranslatePipe], template: "@if (events.length > 0) {\r\n<div>\r\n @for (event of events; track event) {\r\n <div [class]=\"'d-flex ' + (showDates ? 'my-3' : 'my-1')\">\r\n <fa-icon [icon]=\"isBirthday(event) ? cakeCandles : treePalm\"\r\n [class]=\"eventIconClass\"\r\n [title]=\"isBirthday(event) ? ('Birthday' | hrTranslate) : ('PublicHoliday' | hrTranslate)\">\r\n </fa-icon>\r\n\r\n <div>\r\n @if (isBirthday(event)) {\r\n @if (hasPropertyBadge(event)) {\r\n <span [class]=\"propertyBadgeClass\" [title]=\"event.PropertyName!\">{{ event.PropertySymbol }}</span>\r\n }\r\n @if (isArabic) {\r\n <span>{{ 'Birthday' | hrTranslate }}</span>\r\n <span [class]=\"eventNameBoldClass\">{{ ' ' + event.Name + ' ' }}</span>\r\n @if (event.IsIn2Days) { <span>{{ 'During' | hrTranslate }} </span> }\r\n } @else {\r\n <span [class]=\"eventNameBoldClass\">{{ event.Name }}'s </span>\r\n <span>{{ ('Birthday' | hrTranslate) + ' ' + ((event.IsIn2Days ? ('isIn' | hrTranslate) : ('is' | hrTranslate)) | lowercase) }} </span>\r\n }\r\n } @else {\r\n @if (isArabic) {\r\n <span [class]=\"eventNameBoldClass\">{{ event.Name }}</span> <span> {{ ('In' | hrTranslate) + ' ' }}</span>\r\n } @else {\r\n <span [class]=\"eventNameBoldClass\">{{ event.Name }} </span><span>{{ ' ' + (('is' | hrTranslate) | lowercase) }} </span>\r\n }\r\n }\r\n\r\n <span [class]=\"eventDescriptionClass\">{{ event.Description | hrTranslate }}</span>\r\n\r\n @if (!isBirthday(event) && showDates && event.StartDate && event.EndDate) {\r\n <span>{{ ' (' + (event.StartDate | date:dateFormat) + ' - ' + (event.EndDate | date:dateFormat) + ')' }}</span>\r\n }\r\n </div>\r\n </div>\r\n }\r\n</div>\r\n} @else {\r\n@if (weekendWarningDescription) {\r\n<div [class]=\"warningTextClass\">{{ weekendWarningDescription }}</div>\r\n} @else {\r\n<div [class]=\"noEventsTextClass\">{{ 'NoEvents' | hrTranslate }}</div>\r\n}\r\n}\r\n" }]
338
530
  }], propDecorators: { events: [{
339
531
  type: Input
340
532
  }], showDates: [{
@@ -347,8 +539,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
347
539
  type: Input
348
540
  }], weekendWarningDescription: [{
349
541
  type: Input
350
- }], labels: [{
351
- type: Input
352
542
  }], eventIconClass: [{
353
543
  type: Input
354
544
  }], eventNameBoldClass: [{
@@ -368,7 +558,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
368
558
  class HrEventTabBarComponent {
369
559
  selectedType = null;
370
560
  selectedLanguage = 'en';
371
- labels;
372
561
  tabSelectedClass = 'selected-event-option';
373
562
  tabNotSelectedClass = 'not-selected-event-option';
374
563
  tabTextSelectedClass = 'text-white';
@@ -378,6 +567,7 @@ class HrEventTabBarComponent {
378
567
  tabTextClass = 'fs-16';
379
568
  tabIconClass = 'fs-6';
380
569
  tabSelected = new EventEmitter();
570
+ translatePipe = new HrTranslatePipe(inject(HrLexiconService));
381
571
  tabList = [
382
572
  { id: null, icon: null },
383
573
  { id: EventTypeEnum.Birthdays, icon: faCakeCandles },
@@ -385,23 +575,21 @@ class HrEventTabBarComponent {
385
575
  ];
386
576
  getTabText(tab) {
387
577
  if (tab.id === null)
388
- return this.labels.all;
578
+ return this.translatePipe.transform('All');
389
579
  if (tab.id === EventTypeEnum.Birthdays)
390
- return this.labels.birthday;
391
- return this.labels.publicHoliday;
580
+ return this.translatePipe.transform('Birthday');
581
+ return this.translatePipe.transform('PublicHoliday');
392
582
  }
393
583
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: HrEventTabBarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
394
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: HrEventTabBarComponent, isStandalone: true, selector: "hr-event-tab-bar", inputs: { selectedType: "selectedType", selectedLanguage: "selectedLanguage", labels: "labels", tabSelectedClass: "tabSelectedClass", tabNotSelectedClass: "tabNotSelectedClass", tabTextSelectedClass: "tabTextSelectedClass", tabTextNotSelectedClass: "tabTextNotSelectedClass", containerClass: "containerClass", tabItemClass: "tabItemClass", tabTextClass: "tabTextClass", tabIconClass: "tabIconClass" }, outputs: { tabSelected: "tabSelected" }, ngImport: i0, template: "<div [class]=\"containerClass\">\r\n @for (tab of tabList; track tab) {\r\n <div [class]=\"tabItemClass + ' ' + (selectedType == tab.id ? tabSelectedClass : tabNotSelectedClass)\"\r\n [ngClass]=\"{'w-25': (selectedLanguage == 'fr' && !tab?.icon)}\"\r\n (click)=\"tabSelected.emit(tab.id)\">\r\n @if (!tab?.icon) {\r\n <span [class]=\"tabTextClass + ' ' + (selectedType == tab.id ? tabTextSelectedClass : tabTextNotSelectedClass)\">{{ getTabText(tab) }}</span>\r\n } @else {\r\n <fa-icon [icon]=\"tab.icon!\" [class]=\"tabIconClass + ' ' + (selectedType == tab.id ? tabTextSelectedClass : tabTextNotSelectedClass)\" [title]=\"getTabText(tab)\"></fa-icon>\r\n }\r\n </div>\r\n }\r\n</div>\r\n", dependencies: [{ kind: "ngmodule", type: FontAwesomeModule }, { kind: "component", type: i1$2.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "animation", "mask", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
584
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: HrEventTabBarComponent, isStandalone: true, selector: "hr-event-tab-bar", inputs: { selectedType: "selectedType", selectedLanguage: "selectedLanguage", tabSelectedClass: "tabSelectedClass", tabNotSelectedClass: "tabNotSelectedClass", tabTextSelectedClass: "tabTextSelectedClass", tabTextNotSelectedClass: "tabTextNotSelectedClass", containerClass: "containerClass", tabItemClass: "tabItemClass", tabTextClass: "tabTextClass", tabIconClass: "tabIconClass" }, outputs: { tabSelected: "tabSelected" }, ngImport: i0, template: "<div [class]=\"containerClass\">\r\n @for (tab of tabList; track tab) {\r\n <div [class]=\"tabItemClass + ' ' + (selectedType == tab.id ? tabSelectedClass : tabNotSelectedClass)\"\r\n [ngClass]=\"{'w-25': (selectedLanguage == 'fr' && !tab?.icon)}\"\r\n (click)=\"tabSelected.emit(tab.id)\">\r\n @if (!tab?.icon) {\r\n <span [class]=\"tabTextClass + ' ' + (selectedType == tab.id ? tabTextSelectedClass : tabTextNotSelectedClass)\">{{ getTabText(tab) }}</span>\r\n } @else {\r\n <fa-icon [icon]=\"tab.icon!\" [class]=\"tabIconClass + ' ' + (selectedType == tab.id ? tabTextSelectedClass : tabTextNotSelectedClass)\" [title]=\"getTabText(tab)\"></fa-icon>\r\n }\r\n </div>\r\n }\r\n</div>\r\n", dependencies: [{ kind: "ngmodule", type: FontAwesomeModule }, { kind: "component", type: i1$2.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "animation", "mask", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
395
585
  }
396
586
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: HrEventTabBarComponent, decorators: [{
397
587
  type: Component,
398
- args: [{ selector: 'hr-event-tab-bar', standalone: true, imports: [FontAwesomeModule, NgClass], template: "<div [class]=\"containerClass\">\r\n @for (tab of tabList; track tab) {\r\n <div [class]=\"tabItemClass + ' ' + (selectedType == tab.id ? tabSelectedClass : tabNotSelectedClass)\"\r\n [ngClass]=\"{'w-25': (selectedLanguage == 'fr' && !tab?.icon)}\"\r\n (click)=\"tabSelected.emit(tab.id)\">\r\n @if (!tab?.icon) {\r\n <span [class]=\"tabTextClass + ' ' + (selectedType == tab.id ? tabTextSelectedClass : tabTextNotSelectedClass)\">{{ getTabText(tab) }}</span>\r\n } @else {\r\n <fa-icon [icon]=\"tab.icon!\" [class]=\"tabIconClass + ' ' + (selectedType == tab.id ? tabTextSelectedClass : tabTextNotSelectedClass)\" [title]=\"getTabText(tab)\"></fa-icon>\r\n }\r\n </div>\r\n }\r\n</div>\r\n" }]
588
+ args: [{ selector: 'hr-event-tab-bar', standalone: true, imports: [FontAwesomeModule, NgClass, HrTranslatePipe], template: "<div [class]=\"containerClass\">\r\n @for (tab of tabList; track tab) {\r\n <div [class]=\"tabItemClass + ' ' + (selectedType == tab.id ? tabSelectedClass : tabNotSelectedClass)\"\r\n [ngClass]=\"{'w-25': (selectedLanguage == 'fr' && !tab?.icon)}\"\r\n (click)=\"tabSelected.emit(tab.id)\">\r\n @if (!tab?.icon) {\r\n <span [class]=\"tabTextClass + ' ' + (selectedType == tab.id ? tabTextSelectedClass : tabTextNotSelectedClass)\">{{ getTabText(tab) }}</span>\r\n } @else {\r\n <fa-icon [icon]=\"tab.icon!\" [class]=\"tabIconClass + ' ' + (selectedType == tab.id ? tabTextSelectedClass : tabTextNotSelectedClass)\" [title]=\"getTabText(tab)\"></fa-icon>\r\n }\r\n </div>\r\n }\r\n</div>\r\n" }]
399
589
  }], propDecorators: { selectedType: [{
400
590
  type: Input
401
591
  }], selectedLanguage: [{
402
592
  type: Input
403
- }], labels: [{
404
- type: Input
405
593
  }], tabSelectedClass: [{
406
594
  type: Input
407
595
  }], tabNotSelectedClass: [{
@@ -433,7 +621,6 @@ class HrEventsPopupComponent {
433
621
  weekendWarningDescription = null;
434
622
  popupTitle = '';
435
623
  selectedEventType = null;
436
- labels;
437
624
  tabSelectedClass = 'selected-event-option';
438
625
  tabNotSelectedClass = 'not-selected-event-option';
439
626
  tabTextSelectedClass = 'text-white';
@@ -459,11 +646,11 @@ class HrEventsPopupComponent {
459
646
  this.closed.emit();
460
647
  }
461
648
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: HrEventsPopupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
462
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: HrEventsPopupComponent, isStandalone: true, selector: "hr-upcoming-events-popup", inputs: { visible: "visible", events: "events", hasBirthdays: "hasBirthdays", hasHolidays: "hasHolidays", isLoading: "isLoading", selectedLanguage: "selectedLanguage", showProperty: "showProperty", weekendWarningDescription: "weekendWarningDescription", popupTitle: "popupTitle", selectedEventType: "selectedEventType", labels: "labels", tabSelectedClass: "tabSelectedClass", tabNotSelectedClass: "tabNotSelectedClass", tabTextSelectedClass: "tabTextSelectedClass", tabTextNotSelectedClass: "tabTextNotSelectedClass", tabContainerClass: "tabContainerClass", tabItemClass: "tabItemClass", tabTextClass: "tabTextClass", tabIconClass: "tabIconClass", eventIconClass: "eventIconClass", eventNameBoldClass: "eventNameBoldClass", eventDescriptionClass: "eventDescriptionClass", propertyBadgeClass: "propertyBadgeClass", noEventsTextClass: "noEventsTextClass", warningTextClass: "warningTextClass", dateFormat: "dateFormat" }, outputs: { visibleChange: "visibleChange", tabSelected: "tabSelected", closed: "closed" }, ngImport: i0, template: "<dx-popup id=\"popup\"\r\n [(visible)]=\"visible\"\r\n [height]=\"'400'\"\r\n [maxHeight]=\"400\"\r\n [width]=\"'650'\"\r\n shadingColor=\"rgba(0,0,0,0.4)\"\r\n contentTemplate=\"popup-content\"\r\n [showCloseButton]=\"true\"\r\n [title]=\"popupTitle\"\r\n (onHiding)=\"onPopupClose()\"\r\n (visibleChange)=\"visibleChange.emit($event)\">\r\n\r\n <div class=\"text-dark\" *dxTemplate=\"let data of 'popup-content'\">\r\n <dx-scroll-view #upcomingEventsScrollView\r\n id=\"upcomingEventsScrollView\"\r\n [scrollByContent]=\"true\"\r\n [scrollByThumb]=\"true\"\r\n [showScrollbar]=\"'onScroll'\"\r\n [bounceEnabled]=\"false\">\r\n\r\n @if (hasBirthdays || hasHolidays) {\r\n <hr-event-tab-bar [selectedType]=\"selectedEventType\"\r\n [selectedLanguage]=\"selectedLanguage\"\r\n [labels]=\"labels\"\r\n [tabSelectedClass]=\"tabSelectedClass\"\r\n [tabNotSelectedClass]=\"tabNotSelectedClass\"\r\n [tabTextSelectedClass]=\"tabTextSelectedClass\"\r\n [tabTextNotSelectedClass]=\"tabTextNotSelectedClass\"\r\n [containerClass]=\"tabContainerClass\"\r\n [tabItemClass]=\"tabItemClass\"\r\n [tabTextClass]=\"tabTextClass\"\r\n [tabIconClass]=\"tabIconClass\"\r\n (tabSelected)=\"onTabSelected($event)\">\r\n </hr-event-tab-bar>\r\n\r\n <hr-event-item [events]=\"events\"\r\n [showDates]=\"true\"\r\n [showProperty]=\"showProperty\"\r\n [selectedLanguage]=\"selectedLanguage\"\r\n [selectedEventType]=\"selectedEventType\"\r\n [weekendWarningDescription]=\"weekendWarningDescription\"\r\n [labels]=\"labels\"\r\n [eventIconClass]=\"eventIconClass\"\r\n [eventNameBoldClass]=\"eventNameBoldClass\"\r\n [eventDescriptionClass]=\"eventDescriptionClass\"\r\n [propertyBadgeClass]=\"propertyBadgeClass\"\r\n [noEventsTextClass]=\"noEventsTextClass\"\r\n [warningTextClass]=\"warningTextClass\"\r\n [dateFormat]=\"dateFormat\">\r\n </hr-event-item>\r\n } @else {\r\n <div [class]=\"noEventsTextClass\">{{ labels.noEvents }}</div>\r\n }\r\n </dx-scroll-view>\r\n </div>\r\n</dx-popup>\r\n\r\n<dx-load-panel shadingColor=\"rgba(0,0,0,0.4)\"\r\n [visible]=\"isLoading\"\r\n [showIndicator]=\"true\" [showPane]=\"true\"\r\n [shading]=\"true\" [hideOnOutsideClick]=\"false\">\r\n</dx-load-panel>\r\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: DxPopupModule }, { kind: "component", type: i1$1.DxPopupComponent, selector: "dx-popup", inputs: ["accessKey", "animation", "closeOnOutsideClick", "container", "contentTemplate", "deferRendering", "disabled", "dragAndResizeArea", "dragEnabled", "dragOutsideBoundary", "enableBodyScroll", "focusStateEnabled", "fullScreen", "height", "hideOnOutsideClick", "hideOnParentScroll", "hint", "hoverStateEnabled", "maxHeight", "maxWidth", "minHeight", "minWidth", "position", "resizeEnabled", "restorePosition", "rtlEnabled", "shading", "shadingColor", "showCloseButton", "showTitle", "tabIndex", "title", "titleTemplate", "toolbarItems", "visible", "width", "wrapperAttr"], outputs: ["onContentReady", "onDisposing", "onHidden", "onHiding", "onInitialized", "onOptionChanged", "onResize", "onResizeEnd", "onResizeStart", "onShowing", "onShown", "onTitleRendered", "accessKeyChange", "animationChange", "closeOnOutsideClickChange", "containerChange", "contentTemplateChange", "deferRenderingChange", "disabledChange", "dragAndResizeAreaChange", "dragEnabledChange", "dragOutsideBoundaryChange", "enableBodyScrollChange", "focusStateEnabledChange", "fullScreenChange", "heightChange", "hideOnOutsideClickChange", "hideOnParentScrollChange", "hintChange", "hoverStateEnabledChange", "maxHeightChange", "maxWidthChange", "minHeightChange", "minWidthChange", "positionChange", "resizeEnabledChange", "restorePositionChange", "rtlEnabledChange", "shadingChange", "shadingColorChange", "showCloseButtonChange", "showTitleChange", "tabIndexChange", "titleChange", "titleTemplateChange", "toolbarItemsChange", "visibleChange", "widthChange", "wrapperAttrChange"] }, { kind: "directive", type: i2.DxTemplateDirective, selector: "[dxTemplate]", inputs: ["dxTemplateOf"] }, { kind: "ngmodule", type: DxScrollViewModule }, { kind: "component", type: i1$1.DxScrollViewComponent, selector: "dx-scroll-view", inputs: ["bounceEnabled", "direction", "disabled", "elementAttr", "height", "pulledDownText", "pullingDownText", "reachBottomText", "refreshingText", "rtlEnabled", "scrollByContent", "scrollByThumb", "showScrollbar", "useNative", "width"], outputs: ["onDisposing", "onInitialized", "onOptionChanged", "onPullDown", "onReachBottom", "onScroll", "onUpdated", "bounceEnabledChange", "directionChange", "disabledChange", "elementAttrChange", "heightChange", "pulledDownTextChange", "pullingDownTextChange", "reachBottomTextChange", "refreshingTextChange", "rtlEnabledChange", "scrollByContentChange", "scrollByThumbChange", "showScrollbarChange", "useNativeChange", "widthChange"] }, { kind: "ngmodule", type: DxLoadPanelModule }, { kind: "component", type: i1$1.DxLoadPanelComponent, selector: "dx-load-panel", inputs: ["animation", "closeOnOutsideClick", "container", "deferRendering", "delay", "focusStateEnabled", "height", "hideOnOutsideClick", "hideOnParentScroll", "hint", "hoverStateEnabled", "indicatorSrc", "maxHeight", "maxWidth", "message", "minHeight", "minWidth", "position", "rtlEnabled", "shading", "shadingColor", "showIndicator", "showPane", "visible", "width", "wrapperAttr"], outputs: ["onContentReady", "onDisposing", "onHidden", "onHiding", "onInitialized", "onOptionChanged", "onShowing", "onShown", "animationChange", "closeOnOutsideClickChange", "containerChange", "deferRenderingChange", "delayChange", "focusStateEnabledChange", "heightChange", "hideOnOutsideClickChange", "hideOnParentScrollChange", "hintChange", "hoverStateEnabledChange", "indicatorSrcChange", "maxHeightChange", "maxWidthChange", "messageChange", "minHeightChange", "minWidthChange", "positionChange", "rtlEnabledChange", "shadingChange", "shadingColorChange", "showIndicatorChange", "showPaneChange", "visibleChange", "widthChange", "wrapperAttrChange"] }, { kind: "component", type: HrEventItemComponent, selector: "hr-event-item", inputs: ["events", "showDates", "showProperty", "selectedLanguage", "selectedEventType", "weekendWarningDescription", "labels", "eventIconClass", "eventNameBoldClass", "eventDescriptionClass", "propertyBadgeClass", "noEventsTextClass", "warningTextClass", "dateFormat"] }, { kind: "component", type: HrEventTabBarComponent, selector: "hr-event-tab-bar", inputs: ["selectedType", "selectedLanguage", "labels", "tabSelectedClass", "tabNotSelectedClass", "tabTextSelectedClass", "tabTextNotSelectedClass", "containerClass", "tabItemClass", "tabTextClass", "tabIconClass"], outputs: ["tabSelected"] }] });
649
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: HrEventsPopupComponent, isStandalone: true, selector: "hr-upcoming-events-popup", inputs: { visible: "visible", events: "events", hasBirthdays: "hasBirthdays", hasHolidays: "hasHolidays", isLoading: "isLoading", selectedLanguage: "selectedLanguage", showProperty: "showProperty", weekendWarningDescription: "weekendWarningDescription", popupTitle: "popupTitle", selectedEventType: "selectedEventType", tabSelectedClass: "tabSelectedClass", tabNotSelectedClass: "tabNotSelectedClass", tabTextSelectedClass: "tabTextSelectedClass", tabTextNotSelectedClass: "tabTextNotSelectedClass", tabContainerClass: "tabContainerClass", tabItemClass: "tabItemClass", tabTextClass: "tabTextClass", tabIconClass: "tabIconClass", eventIconClass: "eventIconClass", eventNameBoldClass: "eventNameBoldClass", eventDescriptionClass: "eventDescriptionClass", propertyBadgeClass: "propertyBadgeClass", noEventsTextClass: "noEventsTextClass", warningTextClass: "warningTextClass", dateFormat: "dateFormat" }, outputs: { visibleChange: "visibleChange", tabSelected: "tabSelected", closed: "closed" }, ngImport: i0, template: "<dx-popup id=\"popup\"\r\n [(visible)]=\"visible\"\r\n [height]=\"'400'\"\r\n [maxHeight]=\"400\"\r\n [width]=\"'650'\"\r\n shadingColor=\"rgba(0,0,0,0.4)\"\r\n contentTemplate=\"popup-content\"\r\n [showCloseButton]=\"true\"\r\n [title]=\"popupTitle\"\r\n (onHiding)=\"onPopupClose()\"\r\n (visibleChange)=\"visibleChange.emit($event)\">\r\n\r\n <div class=\"text-dark\" *dxTemplate=\"let data of 'popup-content'\">\r\n <dx-scroll-view #upcomingEventsScrollView\r\n id=\"upcomingEventsScrollView\"\r\n [scrollByContent]=\"true\"\r\n [scrollByThumb]=\"true\"\r\n [showScrollbar]=\"'onScroll'\"\r\n [bounceEnabled]=\"false\">\r\n\r\n @if (hasBirthdays || hasHolidays) {\r\n <hr-event-tab-bar [selectedType]=\"selectedEventType\"\r\n [selectedLanguage]=\"selectedLanguage\"\r\n [tabSelectedClass]=\"tabSelectedClass\"\r\n [tabNotSelectedClass]=\"tabNotSelectedClass\"\r\n [tabTextSelectedClass]=\"tabTextSelectedClass\"\r\n [tabTextNotSelectedClass]=\"tabTextNotSelectedClass\"\r\n [containerClass]=\"tabContainerClass\"\r\n [tabItemClass]=\"tabItemClass\"\r\n [tabTextClass]=\"tabTextClass\"\r\n [tabIconClass]=\"tabIconClass\"\r\n (tabSelected)=\"onTabSelected($event)\">\r\n </hr-event-tab-bar>\r\n\r\n <hr-event-item [events]=\"events\"\r\n [showDates]=\"true\"\r\n [showProperty]=\"showProperty\"\r\n [selectedLanguage]=\"selectedLanguage\"\r\n [selectedEventType]=\"selectedEventType\"\r\n [weekendWarningDescription]=\"weekendWarningDescription\"\r\n [eventIconClass]=\"eventIconClass\"\r\n [eventNameBoldClass]=\"eventNameBoldClass\"\r\n [eventDescriptionClass]=\"eventDescriptionClass\"\r\n [propertyBadgeClass]=\"propertyBadgeClass\"\r\n [noEventsTextClass]=\"noEventsTextClass\"\r\n [warningTextClass]=\"warningTextClass\"\r\n [dateFormat]=\"dateFormat\">\r\n </hr-event-item>\r\n } @else {\r\n <div [class]=\"noEventsTextClass\">{{ 'NoEvents' | hrTranslate }}</div>\r\n }\r\n </dx-scroll-view>\r\n </div>\r\n</dx-popup>\r\n\r\n<dx-load-panel shadingColor=\"rgba(0,0,0,0.4)\"\r\n [visible]=\"isLoading\"\r\n [showIndicator]=\"true\" [showPane]=\"true\"\r\n [shading]=\"true\" [hideOnOutsideClick]=\"false\">\r\n</dx-load-panel>\r\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: DxPopupModule }, { kind: "component", type: i1$1.DxPopupComponent, selector: "dx-popup", inputs: ["accessKey", "animation", "closeOnOutsideClick", "container", "contentTemplate", "deferRendering", "disabled", "dragAndResizeArea", "dragEnabled", "dragOutsideBoundary", "enableBodyScroll", "focusStateEnabled", "fullScreen", "height", "hideOnOutsideClick", "hideOnParentScroll", "hint", "hoverStateEnabled", "maxHeight", "maxWidth", "minHeight", "minWidth", "position", "resizeEnabled", "restorePosition", "rtlEnabled", "shading", "shadingColor", "showCloseButton", "showTitle", "tabIndex", "title", "titleTemplate", "toolbarItems", "visible", "width", "wrapperAttr"], outputs: ["onContentReady", "onDisposing", "onHidden", "onHiding", "onInitialized", "onOptionChanged", "onResize", "onResizeEnd", "onResizeStart", "onShowing", "onShown", "onTitleRendered", "accessKeyChange", "animationChange", "closeOnOutsideClickChange", "containerChange", "contentTemplateChange", "deferRenderingChange", "disabledChange", "dragAndResizeAreaChange", "dragEnabledChange", "dragOutsideBoundaryChange", "enableBodyScrollChange", "focusStateEnabledChange", "fullScreenChange", "heightChange", "hideOnOutsideClickChange", "hideOnParentScrollChange", "hintChange", "hoverStateEnabledChange", "maxHeightChange", "maxWidthChange", "minHeightChange", "minWidthChange", "positionChange", "resizeEnabledChange", "restorePositionChange", "rtlEnabledChange", "shadingChange", "shadingColorChange", "showCloseButtonChange", "showTitleChange", "tabIndexChange", "titleChange", "titleTemplateChange", "toolbarItemsChange", "visibleChange", "widthChange", "wrapperAttrChange"] }, { kind: "directive", type: i2.DxTemplateDirective, selector: "[dxTemplate]", inputs: ["dxTemplateOf"] }, { kind: "ngmodule", type: DxScrollViewModule }, { kind: "component", type: i1$1.DxScrollViewComponent, selector: "dx-scroll-view", inputs: ["bounceEnabled", "direction", "disabled", "elementAttr", "height", "pulledDownText", "pullingDownText", "reachBottomText", "refreshingText", "rtlEnabled", "scrollByContent", "scrollByThumb", "showScrollbar", "useNative", "width"], outputs: ["onDisposing", "onInitialized", "onOptionChanged", "onPullDown", "onReachBottom", "onScroll", "onUpdated", "bounceEnabledChange", "directionChange", "disabledChange", "elementAttrChange", "heightChange", "pulledDownTextChange", "pullingDownTextChange", "reachBottomTextChange", "refreshingTextChange", "rtlEnabledChange", "scrollByContentChange", "scrollByThumbChange", "showScrollbarChange", "useNativeChange", "widthChange"] }, { kind: "ngmodule", type: DxLoadPanelModule }, { kind: "component", type: i1$1.DxLoadPanelComponent, selector: "dx-load-panel", inputs: ["animation", "closeOnOutsideClick", "container", "deferRendering", "delay", "focusStateEnabled", "height", "hideOnOutsideClick", "hideOnParentScroll", "hint", "hoverStateEnabled", "indicatorSrc", "maxHeight", "maxWidth", "message", "minHeight", "minWidth", "position", "rtlEnabled", "shading", "shadingColor", "showIndicator", "showPane", "visible", "width", "wrapperAttr"], outputs: ["onContentReady", "onDisposing", "onHidden", "onHiding", "onInitialized", "onOptionChanged", "onShowing", "onShown", "animationChange", "closeOnOutsideClickChange", "containerChange", "deferRenderingChange", "delayChange", "focusStateEnabledChange", "heightChange", "hideOnOutsideClickChange", "hideOnParentScrollChange", "hintChange", "hoverStateEnabledChange", "indicatorSrcChange", "maxHeightChange", "maxWidthChange", "messageChange", "minHeightChange", "minWidthChange", "positionChange", "rtlEnabledChange", "shadingChange", "shadingColorChange", "showIndicatorChange", "showPaneChange", "visibleChange", "widthChange", "wrapperAttrChange"] }, { kind: "component", type: HrEventItemComponent, selector: "hr-event-item", inputs: ["events", "showDates", "showProperty", "selectedLanguage", "selectedEventType", "weekendWarningDescription", "eventIconClass", "eventNameBoldClass", "eventDescriptionClass", "propertyBadgeClass", "noEventsTextClass", "warningTextClass", "dateFormat"] }, { kind: "component", type: HrEventTabBarComponent, selector: "hr-event-tab-bar", inputs: ["selectedType", "selectedLanguage", "tabSelectedClass", "tabNotSelectedClass", "tabTextSelectedClass", "tabTextNotSelectedClass", "containerClass", "tabItemClass", "tabTextClass", "tabIconClass"], outputs: ["tabSelected"] }, { kind: "pipe", type: HrTranslatePipe, name: "hrTranslate" }] });
463
650
  }
464
651
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: HrEventsPopupComponent, decorators: [{
465
652
  type: Component,
466
- args: [{ selector: 'hr-upcoming-events-popup', standalone: true, imports: [CommonModule, DxPopupModule, DxScrollViewModule, DxLoadPanelModule, HrEventItemComponent, HrEventTabBarComponent], template: "<dx-popup id=\"popup\"\r\n [(visible)]=\"visible\"\r\n [height]=\"'400'\"\r\n [maxHeight]=\"400\"\r\n [width]=\"'650'\"\r\n shadingColor=\"rgba(0,0,0,0.4)\"\r\n contentTemplate=\"popup-content\"\r\n [showCloseButton]=\"true\"\r\n [title]=\"popupTitle\"\r\n (onHiding)=\"onPopupClose()\"\r\n (visibleChange)=\"visibleChange.emit($event)\">\r\n\r\n <div class=\"text-dark\" *dxTemplate=\"let data of 'popup-content'\">\r\n <dx-scroll-view #upcomingEventsScrollView\r\n id=\"upcomingEventsScrollView\"\r\n [scrollByContent]=\"true\"\r\n [scrollByThumb]=\"true\"\r\n [showScrollbar]=\"'onScroll'\"\r\n [bounceEnabled]=\"false\">\r\n\r\n @if (hasBirthdays || hasHolidays) {\r\n <hr-event-tab-bar [selectedType]=\"selectedEventType\"\r\n [selectedLanguage]=\"selectedLanguage\"\r\n [labels]=\"labels\"\r\n [tabSelectedClass]=\"tabSelectedClass\"\r\n [tabNotSelectedClass]=\"tabNotSelectedClass\"\r\n [tabTextSelectedClass]=\"tabTextSelectedClass\"\r\n [tabTextNotSelectedClass]=\"tabTextNotSelectedClass\"\r\n [containerClass]=\"tabContainerClass\"\r\n [tabItemClass]=\"tabItemClass\"\r\n [tabTextClass]=\"tabTextClass\"\r\n [tabIconClass]=\"tabIconClass\"\r\n (tabSelected)=\"onTabSelected($event)\">\r\n </hr-event-tab-bar>\r\n\r\n <hr-event-item [events]=\"events\"\r\n [showDates]=\"true\"\r\n [showProperty]=\"showProperty\"\r\n [selectedLanguage]=\"selectedLanguage\"\r\n [selectedEventType]=\"selectedEventType\"\r\n [weekendWarningDescription]=\"weekendWarningDescription\"\r\n [labels]=\"labels\"\r\n [eventIconClass]=\"eventIconClass\"\r\n [eventNameBoldClass]=\"eventNameBoldClass\"\r\n [eventDescriptionClass]=\"eventDescriptionClass\"\r\n [propertyBadgeClass]=\"propertyBadgeClass\"\r\n [noEventsTextClass]=\"noEventsTextClass\"\r\n [warningTextClass]=\"warningTextClass\"\r\n [dateFormat]=\"dateFormat\">\r\n </hr-event-item>\r\n } @else {\r\n <div [class]=\"noEventsTextClass\">{{ labels.noEvents }}</div>\r\n }\r\n </dx-scroll-view>\r\n </div>\r\n</dx-popup>\r\n\r\n<dx-load-panel shadingColor=\"rgba(0,0,0,0.4)\"\r\n [visible]=\"isLoading\"\r\n [showIndicator]=\"true\" [showPane]=\"true\"\r\n [shading]=\"true\" [hideOnOutsideClick]=\"false\">\r\n</dx-load-panel>\r\n" }]
653
+ args: [{ selector: 'hr-upcoming-events-popup', standalone: true, imports: [CommonModule, DxPopupModule, DxScrollViewModule, DxLoadPanelModule, HrEventItemComponent, HrEventTabBarComponent, HrTranslatePipe], template: "<dx-popup id=\"popup\"\r\n [(visible)]=\"visible\"\r\n [height]=\"'400'\"\r\n [maxHeight]=\"400\"\r\n [width]=\"'650'\"\r\n shadingColor=\"rgba(0,0,0,0.4)\"\r\n contentTemplate=\"popup-content\"\r\n [showCloseButton]=\"true\"\r\n [title]=\"popupTitle\"\r\n (onHiding)=\"onPopupClose()\"\r\n (visibleChange)=\"visibleChange.emit($event)\">\r\n\r\n <div class=\"text-dark\" *dxTemplate=\"let data of 'popup-content'\">\r\n <dx-scroll-view #upcomingEventsScrollView\r\n id=\"upcomingEventsScrollView\"\r\n [scrollByContent]=\"true\"\r\n [scrollByThumb]=\"true\"\r\n [showScrollbar]=\"'onScroll'\"\r\n [bounceEnabled]=\"false\">\r\n\r\n @if (hasBirthdays || hasHolidays) {\r\n <hr-event-tab-bar [selectedType]=\"selectedEventType\"\r\n [selectedLanguage]=\"selectedLanguage\"\r\n [tabSelectedClass]=\"tabSelectedClass\"\r\n [tabNotSelectedClass]=\"tabNotSelectedClass\"\r\n [tabTextSelectedClass]=\"tabTextSelectedClass\"\r\n [tabTextNotSelectedClass]=\"tabTextNotSelectedClass\"\r\n [containerClass]=\"tabContainerClass\"\r\n [tabItemClass]=\"tabItemClass\"\r\n [tabTextClass]=\"tabTextClass\"\r\n [tabIconClass]=\"tabIconClass\"\r\n (tabSelected)=\"onTabSelected($event)\">\r\n </hr-event-tab-bar>\r\n\r\n <hr-event-item [events]=\"events\"\r\n [showDates]=\"true\"\r\n [showProperty]=\"showProperty\"\r\n [selectedLanguage]=\"selectedLanguage\"\r\n [selectedEventType]=\"selectedEventType\"\r\n [weekendWarningDescription]=\"weekendWarningDescription\"\r\n [eventIconClass]=\"eventIconClass\"\r\n [eventNameBoldClass]=\"eventNameBoldClass\"\r\n [eventDescriptionClass]=\"eventDescriptionClass\"\r\n [propertyBadgeClass]=\"propertyBadgeClass\"\r\n [noEventsTextClass]=\"noEventsTextClass\"\r\n [warningTextClass]=\"warningTextClass\"\r\n [dateFormat]=\"dateFormat\">\r\n </hr-event-item>\r\n } @else {\r\n <div [class]=\"noEventsTextClass\">{{ 'NoEvents' | hrTranslate }}</div>\r\n }\r\n </dx-scroll-view>\r\n </div>\r\n</dx-popup>\r\n\r\n<dx-load-panel shadingColor=\"rgba(0,0,0,0.4)\"\r\n [visible]=\"isLoading\"\r\n [showIndicator]=\"true\" [showPane]=\"true\"\r\n [shading]=\"true\" [hideOnOutsideClick]=\"false\">\r\n</dx-load-panel>\r\n" }]
467
654
  }], propDecorators: { visible: [{
468
655
  type: Input
469
656
  }], events: [{
@@ -484,8 +671,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
484
671
  type: Input
485
672
  }], selectedEventType: [{
486
673
  type: Input
487
- }], labels: [{
488
- type: Input
489
674
  }], tabSelectedClass: [{
490
675
  type: Input
491
676
  }], tabNotSelectedClass: [{
@@ -549,18 +734,6 @@ class MyUpcomingEventsWidgetComponent {
549
734
  eventDescriptionClass = 'text-primary fw-medium';
550
735
  propertyBadgeClass = 'property-badge cursor-pointer me-1';
551
736
  dateFormat = 'dd/MM/yyyy';
552
- labels = {
553
- upcomingEvents: 'Upcoming Events',
554
- birthday: 'Birthday',
555
- publicHoliday: 'Public Holiday',
556
- during: 'During',
557
- isIn: 'is in',
558
- is: 'is',
559
- in: 'In',
560
- noEvents: 'There are no events',
561
- all: 'All',
562
- viewAll: 'View All',
563
- };
564
737
  isLoadingChanged = new EventEmitter();
565
738
  viewAllClicked = new EventEmitter();
566
739
  externalViewAll = false;
@@ -641,22 +814,17 @@ class MyUpcomingEventsWidgetComponent {
641
814
  filtered = holidays.map(h => this.mapHoliday(h));
642
815
  }
643
816
  else {
644
- if (birthdays.length > 0 && holidays.length > 0) {
645
- if (limit) {
646
- filtered = [this.mapBirthday(birthdays[0]), this.mapHoliday(holidays[0])];
647
- }
648
- else {
649
- filtered = [
650
- ...birthdays.map(b => this.mapBirthday(b)),
651
- ...holidays.map(h => this.mapHoliday(h))
652
- ];
653
- }
654
- }
655
- else if (birthdays.length > 0) {
656
- filtered = birthdays.map(b => this.mapBirthday(b));
817
+ if (limit) {
818
+ filtered = [
819
+ ...birthdays.map(b => this.mapBirthday(b)).sort((a, b) => new Date(a.EventDate).getTime() - new Date(b.EventDate).getTime()).slice(0, 1),
820
+ ...holidays.map(h => this.mapHoliday(h)).sort((a, b) => new Date(a.EventDate).getTime() - new Date(b.EventDate).getTime()).slice(0, 1)
821
+ ];
657
822
  }
658
823
  else {
659
- filtered = holidays.map(h => this.mapHoliday(h));
824
+ filtered = [
825
+ ...birthdays.map(b => this.mapBirthday(b)),
826
+ ...holidays.map(h => this.mapHoliday(h))
827
+ ];
660
828
  }
661
829
  }
662
830
  if (limit) {
@@ -665,12 +833,14 @@ class MyUpcomingEventsWidgetComponent {
665
833
  return filtered.sort((a, b) => new Date(a.EventDate).getTime() - new Date(b.EventDate).getTime());
666
834
  }
667
835
  mapBirthday(b) {
836
+ const birthdate = new Date(b.Birthdate);
837
+ const eventDate = new Date(new Date().getFullYear(), birthdate.getMonth(), birthdate.getDate());
668
838
  return {
669
- EventDate: new Date(b.Birthdate),
839
+ EventDate: eventDate,
670
840
  Name: b.EmployeeShortName,
671
841
  EventType: EventTypeEnum.Birthdays,
672
842
  Description: b.RelativeDay.toString(),
673
- IsIn2Days: RelativeDay[b.RelativeDay] === RelativeDay.TwoDays,
843
+ IsIn2Days: b.RelativeDay === RelativeDay.TwoDays,
674
844
  PropertyName: b.EmployeePropertyName,
675
845
  PropertySymbol: b.EmployeePropertySymbol
676
846
  };
@@ -686,11 +856,11 @@ class MyUpcomingEventsWidgetComponent {
686
856
  };
687
857
  }
688
858
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: MyUpcomingEventsWidgetComponent, deps: [{ token: i1.HttpClient }, { token: i2$1.SkyAlertToastService }], target: i0.ɵɵFactoryTarget.Component });
689
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: MyUpcomingEventsWidgetComponent, isStandalone: true, selector: "hr-my-upcoming-events-widget", inputs: { baseUrl: "baseUrl", weekendWarningDescription: "weekendWarningDescription", selectedLanguage: "selectedLanguage", showProperty: "showProperty", cardClass: "cardClass", noEventsTextClass: "noEventsTextClass", viewAllLinkClass: "viewAllLinkClass", viewAllContainerClass: "viewAllContainerClass", warningTextClass: "warningTextClass", tabSelectedClass: "tabSelectedClass", tabNotSelectedClass: "tabNotSelectedClass", tabTextSelectedClass: "tabTextSelectedClass", tabTextNotSelectedClass: "tabTextNotSelectedClass", tabContainerClass: "tabContainerClass", tabItemClass: "tabItemClass", tabTextClass: "tabTextClass", tabIconClass: "tabIconClass", eventIconClass: "eventIconClass", eventNameBoldClass: "eventNameBoldClass", eventDescriptionClass: "eventDescriptionClass", propertyBadgeClass: "propertyBadgeClass", dateFormat: "dateFormat", labels: "labels", externalViewAll: "externalViewAll" }, outputs: { isLoadingChanged: "isLoadingChanged", viewAllClicked: "viewAllClicked" }, ngImport: i0, template: "<!-- Card View -->\r\n<div [class]=\"cardClass\">\r\n <hr-card-header [icon]=\"calendarStar\" [title]=\"labels.upcomingEvents\"></hr-card-header>\r\n\r\n @if (birthdays.length > 0 || holidays.length > 0) {\r\n <hr-event-tab-bar\r\n [selectedType]=\"selectedEventType\"\r\n [selectedLanguage]=\"selectedLanguage\"\r\n [labels]=\"labels\"\r\n [tabSelectedClass]=\"tabSelectedClass\"\r\n [tabNotSelectedClass]=\"tabNotSelectedClass\"\r\n [tabTextSelectedClass]=\"tabTextSelectedClass\"\r\n [tabTextNotSelectedClass]=\"tabTextNotSelectedClass\"\r\n [containerClass]=\"tabContainerClass\"\r\n [tabItemClass]=\"tabItemClass\"\r\n [tabTextClass]=\"tabTextClass\"\r\n [tabIconClass]=\"tabIconClass\"\r\n (tabSelected)=\"onTabClick($event)\">\r\n </hr-event-tab-bar>\r\n\r\n <hr-event-item\r\n [events]=\"filteredEvents\"\r\n [showDates]=\"false\"\r\n [showProperty]=\"showProperty\"\r\n [selectedLanguage]=\"selectedLanguage\"\r\n [selectedEventType]=\"selectedEventType\"\r\n [weekendWarningDescription]=\"weekendWarning\"\r\n [labels]=\"labels\"\r\n [eventIconClass]=\"eventIconClass\"\r\n [eventNameBoldClass]=\"eventNameBoldClass\"\r\n [eventDescriptionClass]=\"eventDescriptionClass\"\r\n [propertyBadgeClass]=\"propertyBadgeClass\"\r\n [noEventsTextClass]=\"noEventsTextClass\"\r\n [warningTextClass]=\"warningTextClass\"\r\n [dateFormat]=\"dateFormat\">\r\n </hr-event-item>\r\n\r\n <div [class]=\"viewAllContainerClass\">\r\n <a [class]=\"viewAllLinkClass\" (click)=\"showPopup()\">{{ labels.viewAll }}</a>\r\n </div>\r\n } @else {\r\n <div [class]=\"noEventsTextClass\">{{ labels.noEvents }}</div>\r\n }\r\n</div>\r\n\r\n<!-- Popup -->\r\n<hr-upcoming-events-popup\r\n [visible]=\"popupVisible\"\r\n [events]=\"popupEvents\"\r\n [hasBirthdays]=\"birthdays.length > 0\"\r\n [hasHolidays]=\"holidays.length > 0\"\r\n [isLoading]=\"false\"\r\n [selectedLanguage]=\"selectedLanguage\"\r\n [showProperty]=\"showProperty\"\r\n [weekendWarningDescription]=\"weekendWarning\"\r\n [popupTitle]=\"labels.upcomingEvents\"\r\n [selectedEventType]=\"selectedPopupEventType\"\r\n [labels]=\"labels\"\r\n [tabSelectedClass]=\"tabSelectedClass\"\r\n [tabNotSelectedClass]=\"tabNotSelectedClass\"\r\n [tabTextSelectedClass]=\"tabTextSelectedClass\"\r\n [tabTextNotSelectedClass]=\"tabTextNotSelectedClass\"\r\n [tabContainerClass]=\"tabContainerClass\"\r\n [tabItemClass]=\"tabItemClass\"\r\n [tabTextClass]=\"tabTextClass\"\r\n [tabIconClass]=\"tabIconClass\"\r\n [eventIconClass]=\"eventIconClass\"\r\n [eventNameBoldClass]=\"eventNameBoldClass\"\r\n [eventDescriptionClass]=\"eventDescriptionClass\"\r\n [propertyBadgeClass]=\"propertyBadgeClass\"\r\n [noEventsTextClass]=\"noEventsTextClass\"\r\n [warningTextClass]=\"warningTextClass\"\r\n [dateFormat]=\"dateFormat\"\r\n (visibleChange)=\"popupVisible = $event\"\r\n (tabSelected)=\"onPopupTabClick($event)\"\r\n (closed)=\"onPopupClose()\">\r\n</hr-upcoming-events-popup>\r\n", dependencies: [{ kind: "ngmodule", type: FontAwesomeModule }, { kind: "component", type: HrCardHeaderComponent, selector: "hr-card-header", inputs: ["icon", "title", "containerClass", "iconClass", "titleClass"] }, { kind: "component", type: HrEventItemComponent, selector: "hr-event-item", inputs: ["events", "showDates", "showProperty", "selectedLanguage", "selectedEventType", "weekendWarningDescription", "labels", "eventIconClass", "eventNameBoldClass", "eventDescriptionClass", "propertyBadgeClass", "noEventsTextClass", "warningTextClass", "dateFormat"] }, { kind: "component", type: HrEventTabBarComponent, selector: "hr-event-tab-bar", inputs: ["selectedType", "selectedLanguage", "labels", "tabSelectedClass", "tabNotSelectedClass", "tabTextSelectedClass", "tabTextNotSelectedClass", "containerClass", "tabItemClass", "tabTextClass", "tabIconClass"], outputs: ["tabSelected"] }, { kind: "component", type: HrEventsPopupComponent, selector: "hr-upcoming-events-popup", inputs: ["visible", "events", "hasBirthdays", "hasHolidays", "isLoading", "selectedLanguage", "showProperty", "weekendWarningDescription", "popupTitle", "selectedEventType", "labels", "tabSelectedClass", "tabNotSelectedClass", "tabTextSelectedClass", "tabTextNotSelectedClass", "tabContainerClass", "tabItemClass", "tabTextClass", "tabIconClass", "eventIconClass", "eventNameBoldClass", "eventDescriptionClass", "propertyBadgeClass", "noEventsTextClass", "warningTextClass", "dateFormat"], outputs: ["visibleChange", "tabSelected", "closed"] }] });
859
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: MyUpcomingEventsWidgetComponent, isStandalone: true, selector: "hr-my-upcoming-events-widget", inputs: { baseUrl: "baseUrl", weekendWarningDescription: "weekendWarningDescription", selectedLanguage: "selectedLanguage", showProperty: "showProperty", cardClass: "cardClass", noEventsTextClass: "noEventsTextClass", viewAllLinkClass: "viewAllLinkClass", viewAllContainerClass: "viewAllContainerClass", warningTextClass: "warningTextClass", tabSelectedClass: "tabSelectedClass", tabNotSelectedClass: "tabNotSelectedClass", tabTextSelectedClass: "tabTextSelectedClass", tabTextNotSelectedClass: "tabTextNotSelectedClass", tabContainerClass: "tabContainerClass", tabItemClass: "tabItemClass", tabTextClass: "tabTextClass", tabIconClass: "tabIconClass", eventIconClass: "eventIconClass", eventNameBoldClass: "eventNameBoldClass", eventDescriptionClass: "eventDescriptionClass", propertyBadgeClass: "propertyBadgeClass", dateFormat: "dateFormat", externalViewAll: "externalViewAll" }, outputs: { isLoadingChanged: "isLoadingChanged", viewAllClicked: "viewAllClicked" }, ngImport: i0, template: "<!-- Card View -->\r\n<div [class]=\"cardClass\">\r\n <hr-card-header [icon]=\"calendarStar\" [title]=\"'UpcomingEvents' | hrTranslate\"></hr-card-header>\r\n\r\n @if (birthdays.length > 0 || holidays.length > 0) {\r\n <hr-event-tab-bar\r\n [selectedType]=\"selectedEventType\"\r\n [selectedLanguage]=\"selectedLanguage\"\r\n [tabSelectedClass]=\"tabSelectedClass\"\r\n [tabNotSelectedClass]=\"tabNotSelectedClass\"\r\n [tabTextSelectedClass]=\"tabTextSelectedClass\"\r\n [tabTextNotSelectedClass]=\"tabTextNotSelectedClass\"\r\n [containerClass]=\"tabContainerClass\"\r\n [tabItemClass]=\"tabItemClass\"\r\n [tabTextClass]=\"tabTextClass\"\r\n [tabIconClass]=\"tabIconClass\"\r\n (tabSelected)=\"onTabClick($event)\">\r\n </hr-event-tab-bar>\r\n\r\n <hr-event-item\r\n [events]=\"filteredEvents\"\r\n [showDates]=\"false\"\r\n [showProperty]=\"showProperty\"\r\n [selectedLanguage]=\"selectedLanguage\"\r\n [selectedEventType]=\"selectedEventType\"\r\n [weekendWarningDescription]=\"weekendWarning\"\r\n [eventIconClass]=\"eventIconClass\"\r\n [eventNameBoldClass]=\"eventNameBoldClass\"\r\n [eventDescriptionClass]=\"eventDescriptionClass\"\r\n [propertyBadgeClass]=\"propertyBadgeClass\"\r\n [noEventsTextClass]=\"noEventsTextClass\"\r\n [warningTextClass]=\"warningTextClass\"\r\n [dateFormat]=\"dateFormat\">\r\n </hr-event-item>\r\n\r\n <div [class]=\"viewAllContainerClass\">\r\n <a [class]=\"viewAllLinkClass\" (click)=\"showPopup()\">{{ 'ViewAll' | hrTranslate }}</a>\r\n </div>\r\n } @else {\r\n <div [class]=\"noEventsTextClass\">{{ 'NoEvents' | hrTranslate }}</div>\r\n }\r\n</div>\r\n\r\n<!-- Popup -->\r\n<hr-upcoming-events-popup\r\n [visible]=\"popupVisible\"\r\n [events]=\"popupEvents\"\r\n [hasBirthdays]=\"birthdays.length > 0\"\r\n [hasHolidays]=\"holidays.length > 0\"\r\n [isLoading]=\"false\"\r\n [selectedLanguage]=\"selectedLanguage\"\r\n [showProperty]=\"showProperty\"\r\n [weekendWarningDescription]=\"weekendWarning\"\r\n [popupTitle]=\"'UpcomingEvents' | hrTranslate\"\r\n [selectedEventType]=\"selectedPopupEventType\"\r\n [tabSelectedClass]=\"tabSelectedClass\"\r\n [tabNotSelectedClass]=\"tabNotSelectedClass\"\r\n [tabTextSelectedClass]=\"tabTextSelectedClass\"\r\n [tabTextNotSelectedClass]=\"tabTextNotSelectedClass\"\r\n [tabContainerClass]=\"tabContainerClass\"\r\n [tabItemClass]=\"tabItemClass\"\r\n [tabTextClass]=\"tabTextClass\"\r\n [tabIconClass]=\"tabIconClass\"\r\n [eventIconClass]=\"eventIconClass\"\r\n [eventNameBoldClass]=\"eventNameBoldClass\"\r\n [eventDescriptionClass]=\"eventDescriptionClass\"\r\n [propertyBadgeClass]=\"propertyBadgeClass\"\r\n [noEventsTextClass]=\"noEventsTextClass\"\r\n [warningTextClass]=\"warningTextClass\"\r\n [dateFormat]=\"dateFormat\"\r\n (visibleChange)=\"popupVisible = $event\"\r\n (tabSelected)=\"onPopupTabClick($event)\"\r\n (closed)=\"onPopupClose()\">\r\n</hr-upcoming-events-popup>\r\n", dependencies: [{ kind: "ngmodule", type: FontAwesomeModule }, { kind: "component", type: HrCardHeaderComponent, selector: "hr-card-header", inputs: ["icon", "title", "containerClass", "iconClass", "titleClass"] }, { kind: "component", type: HrEventItemComponent, selector: "hr-event-item", inputs: ["events", "showDates", "showProperty", "selectedLanguage", "selectedEventType", "weekendWarningDescription", "eventIconClass", "eventNameBoldClass", "eventDescriptionClass", "propertyBadgeClass", "noEventsTextClass", "warningTextClass", "dateFormat"] }, { kind: "component", type: HrEventTabBarComponent, selector: "hr-event-tab-bar", inputs: ["selectedType", "selectedLanguage", "tabSelectedClass", "tabNotSelectedClass", "tabTextSelectedClass", "tabTextNotSelectedClass", "containerClass", "tabItemClass", "tabTextClass", "tabIconClass"], outputs: ["tabSelected"] }, { kind: "component", type: HrEventsPopupComponent, selector: "hr-upcoming-events-popup", inputs: ["visible", "events", "hasBirthdays", "hasHolidays", "isLoading", "selectedLanguage", "showProperty", "weekendWarningDescription", "popupTitle", "selectedEventType", "tabSelectedClass", "tabNotSelectedClass", "tabTextSelectedClass", "tabTextNotSelectedClass", "tabContainerClass", "tabItemClass", "tabTextClass", "tabIconClass", "eventIconClass", "eventNameBoldClass", "eventDescriptionClass", "propertyBadgeClass", "noEventsTextClass", "warningTextClass", "dateFormat"], outputs: ["visibleChange", "tabSelected", "closed"] }, { kind: "pipe", type: HrTranslatePipe, name: "hrTranslate" }] });
690
860
  }
691
861
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: MyUpcomingEventsWidgetComponent, decorators: [{
692
862
  type: Component,
693
- args: [{ selector: 'hr-my-upcoming-events-widget', standalone: true, imports: [FontAwesomeModule, HrCardHeaderComponent, HrEventItemComponent, HrEventTabBarComponent, HrEventsPopupComponent], template: "<!-- Card View -->\r\n<div [class]=\"cardClass\">\r\n <hr-card-header [icon]=\"calendarStar\" [title]=\"labels.upcomingEvents\"></hr-card-header>\r\n\r\n @if (birthdays.length > 0 || holidays.length > 0) {\r\n <hr-event-tab-bar\r\n [selectedType]=\"selectedEventType\"\r\n [selectedLanguage]=\"selectedLanguage\"\r\n [labels]=\"labels\"\r\n [tabSelectedClass]=\"tabSelectedClass\"\r\n [tabNotSelectedClass]=\"tabNotSelectedClass\"\r\n [tabTextSelectedClass]=\"tabTextSelectedClass\"\r\n [tabTextNotSelectedClass]=\"tabTextNotSelectedClass\"\r\n [containerClass]=\"tabContainerClass\"\r\n [tabItemClass]=\"tabItemClass\"\r\n [tabTextClass]=\"tabTextClass\"\r\n [tabIconClass]=\"tabIconClass\"\r\n (tabSelected)=\"onTabClick($event)\">\r\n </hr-event-tab-bar>\r\n\r\n <hr-event-item\r\n [events]=\"filteredEvents\"\r\n [showDates]=\"false\"\r\n [showProperty]=\"showProperty\"\r\n [selectedLanguage]=\"selectedLanguage\"\r\n [selectedEventType]=\"selectedEventType\"\r\n [weekendWarningDescription]=\"weekendWarning\"\r\n [labels]=\"labels\"\r\n [eventIconClass]=\"eventIconClass\"\r\n [eventNameBoldClass]=\"eventNameBoldClass\"\r\n [eventDescriptionClass]=\"eventDescriptionClass\"\r\n [propertyBadgeClass]=\"propertyBadgeClass\"\r\n [noEventsTextClass]=\"noEventsTextClass\"\r\n [warningTextClass]=\"warningTextClass\"\r\n [dateFormat]=\"dateFormat\">\r\n </hr-event-item>\r\n\r\n <div [class]=\"viewAllContainerClass\">\r\n <a [class]=\"viewAllLinkClass\" (click)=\"showPopup()\">{{ labels.viewAll }}</a>\r\n </div>\r\n } @else {\r\n <div [class]=\"noEventsTextClass\">{{ labels.noEvents }}</div>\r\n }\r\n</div>\r\n\r\n<!-- Popup -->\r\n<hr-upcoming-events-popup\r\n [visible]=\"popupVisible\"\r\n [events]=\"popupEvents\"\r\n [hasBirthdays]=\"birthdays.length > 0\"\r\n [hasHolidays]=\"holidays.length > 0\"\r\n [isLoading]=\"false\"\r\n [selectedLanguage]=\"selectedLanguage\"\r\n [showProperty]=\"showProperty\"\r\n [weekendWarningDescription]=\"weekendWarning\"\r\n [popupTitle]=\"labels.upcomingEvents\"\r\n [selectedEventType]=\"selectedPopupEventType\"\r\n [labels]=\"labels\"\r\n [tabSelectedClass]=\"tabSelectedClass\"\r\n [tabNotSelectedClass]=\"tabNotSelectedClass\"\r\n [tabTextSelectedClass]=\"tabTextSelectedClass\"\r\n [tabTextNotSelectedClass]=\"tabTextNotSelectedClass\"\r\n [tabContainerClass]=\"tabContainerClass\"\r\n [tabItemClass]=\"tabItemClass\"\r\n [tabTextClass]=\"tabTextClass\"\r\n [tabIconClass]=\"tabIconClass\"\r\n [eventIconClass]=\"eventIconClass\"\r\n [eventNameBoldClass]=\"eventNameBoldClass\"\r\n [eventDescriptionClass]=\"eventDescriptionClass\"\r\n [propertyBadgeClass]=\"propertyBadgeClass\"\r\n [noEventsTextClass]=\"noEventsTextClass\"\r\n [warningTextClass]=\"warningTextClass\"\r\n [dateFormat]=\"dateFormat\"\r\n (visibleChange)=\"popupVisible = $event\"\r\n (tabSelected)=\"onPopupTabClick($event)\"\r\n (closed)=\"onPopupClose()\">\r\n</hr-upcoming-events-popup>\r\n" }]
863
+ args: [{ selector: 'hr-my-upcoming-events-widget', standalone: true, imports: [FontAwesomeModule, HrCardHeaderComponent, HrEventItemComponent, HrEventTabBarComponent, HrEventsPopupComponent, HrTranslatePipe], template: "<!-- Card View -->\r\n<div [class]=\"cardClass\">\r\n <hr-card-header [icon]=\"calendarStar\" [title]=\"'UpcomingEvents' | hrTranslate\"></hr-card-header>\r\n\r\n @if (birthdays.length > 0 || holidays.length > 0) {\r\n <hr-event-tab-bar\r\n [selectedType]=\"selectedEventType\"\r\n [selectedLanguage]=\"selectedLanguage\"\r\n [tabSelectedClass]=\"tabSelectedClass\"\r\n [tabNotSelectedClass]=\"tabNotSelectedClass\"\r\n [tabTextSelectedClass]=\"tabTextSelectedClass\"\r\n [tabTextNotSelectedClass]=\"tabTextNotSelectedClass\"\r\n [containerClass]=\"tabContainerClass\"\r\n [tabItemClass]=\"tabItemClass\"\r\n [tabTextClass]=\"tabTextClass\"\r\n [tabIconClass]=\"tabIconClass\"\r\n (tabSelected)=\"onTabClick($event)\">\r\n </hr-event-tab-bar>\r\n\r\n <hr-event-item\r\n [events]=\"filteredEvents\"\r\n [showDates]=\"false\"\r\n [showProperty]=\"showProperty\"\r\n [selectedLanguage]=\"selectedLanguage\"\r\n [selectedEventType]=\"selectedEventType\"\r\n [weekendWarningDescription]=\"weekendWarning\"\r\n [eventIconClass]=\"eventIconClass\"\r\n [eventNameBoldClass]=\"eventNameBoldClass\"\r\n [eventDescriptionClass]=\"eventDescriptionClass\"\r\n [propertyBadgeClass]=\"propertyBadgeClass\"\r\n [noEventsTextClass]=\"noEventsTextClass\"\r\n [warningTextClass]=\"warningTextClass\"\r\n [dateFormat]=\"dateFormat\">\r\n </hr-event-item>\r\n\r\n <div [class]=\"viewAllContainerClass\">\r\n <a [class]=\"viewAllLinkClass\" (click)=\"showPopup()\">{{ 'ViewAll' | hrTranslate }}</a>\r\n </div>\r\n } @else {\r\n <div [class]=\"noEventsTextClass\">{{ 'NoEvents' | hrTranslate }}</div>\r\n }\r\n</div>\r\n\r\n<!-- Popup -->\r\n<hr-upcoming-events-popup\r\n [visible]=\"popupVisible\"\r\n [events]=\"popupEvents\"\r\n [hasBirthdays]=\"birthdays.length > 0\"\r\n [hasHolidays]=\"holidays.length > 0\"\r\n [isLoading]=\"false\"\r\n [selectedLanguage]=\"selectedLanguage\"\r\n [showProperty]=\"showProperty\"\r\n [weekendWarningDescription]=\"weekendWarning\"\r\n [popupTitle]=\"'UpcomingEvents' | hrTranslate\"\r\n [selectedEventType]=\"selectedPopupEventType\"\r\n [tabSelectedClass]=\"tabSelectedClass\"\r\n [tabNotSelectedClass]=\"tabNotSelectedClass\"\r\n [tabTextSelectedClass]=\"tabTextSelectedClass\"\r\n [tabTextNotSelectedClass]=\"tabTextNotSelectedClass\"\r\n [tabContainerClass]=\"tabContainerClass\"\r\n [tabItemClass]=\"tabItemClass\"\r\n [tabTextClass]=\"tabTextClass\"\r\n [tabIconClass]=\"tabIconClass\"\r\n [eventIconClass]=\"eventIconClass\"\r\n [eventNameBoldClass]=\"eventNameBoldClass\"\r\n [eventDescriptionClass]=\"eventDescriptionClass\"\r\n [propertyBadgeClass]=\"propertyBadgeClass\"\r\n [noEventsTextClass]=\"noEventsTextClass\"\r\n [warningTextClass]=\"warningTextClass\"\r\n [dateFormat]=\"dateFormat\"\r\n (visibleChange)=\"popupVisible = $event\"\r\n (tabSelected)=\"onPopupTabClick($event)\"\r\n (closed)=\"onPopupClose()\">\r\n</hr-upcoming-events-popup>\r\n" }]
694
864
  }], ctorParameters: () => [{ type: i1.HttpClient }, { type: i2$1.SkyAlertToastService }], propDecorators: { baseUrl: [{
695
865
  type: Input
696
866
  }], weekendWarningDescription: [{
@@ -735,8 +905,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
735
905
  type: Input
736
906
  }], dateFormat: [{
737
907
  type: Input
738
- }], labels: [{
739
- type: Input
740
908
  }], isLoadingChanged: [{
741
909
  type: Output
742
910
  }], viewAllClicked: [{
@@ -753,5 +921,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
753
921
  * Generated bundle index. Do not edit.
754
922
  */
755
923
 
756
- export { EventOption, EventTypeEnum, HrConstantsService, HrMyMainDetailsWidgetComponent, MainWidgetShortcut, MyUpcomingEventsWidgetComponent, PublicHolidayWeekContext, RelativeDay };
924
+ export { EventOption, EventTypeEnum, HrConstantsService, HrLexiconService, HrMyMainDetailsWidgetComponent, MainWidgetShortcut, MyUpcomingEventsWidgetComponent, PublicHolidayWeekContext, RelativeDay };
757
925
  //# sourceMappingURL=skysoftware-co-bayan-hr-widgets-ui.mjs.map