@n-isi-platform/design-system 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.
Files changed (62) hide show
  1. package/README.md +109 -0
  2. package/fesm2022/n-isi-platform-design-system.mjs +2858 -0
  3. package/fesm2022/n-isi-platform-design-system.mjs.map +1 -0
  4. package/helpers/get-tomorrow-date.function.d.ts +7 -0
  5. package/helpers/is-object-empty.function.d.ts +7 -0
  6. package/index.d.ts +5 -0
  7. package/lib/accordion/accordion.component.d.ts +30 -0
  8. package/lib/breadcrumbs/breadcrumbs.component.d.ts +8 -0
  9. package/lib/button/button.component.d.ts +28 -0
  10. package/lib/button-link/button-link.component.d.ts +15 -0
  11. package/lib/card/card.component.d.ts +7 -0
  12. package/lib/checkbox/checkbox.component.d.ts +20 -0
  13. package/lib/confirm-modal/confirm-modal.component.d.ts +23 -0
  14. package/lib/custom-table/custom-table.component.d.ts +117 -0
  15. package/lib/date-input/date-input.component.d.ts +61 -0
  16. package/lib/divider/divider.component.d.ts +5 -0
  17. package/lib/dropdown/dropdown.component.d.ts +48 -0
  18. package/lib/error/error.component.d.ts +13 -0
  19. package/lib/expanded-table/expanded-table.component.d.ts +125 -0
  20. package/lib/filter-header/filter-header.component.d.ts +7 -0
  21. package/lib/footer/footer.component.d.ts +24 -0
  22. package/lib/generic-table/generic-table.component.d.ts +34 -0
  23. package/lib/icon-button/icon-button.component.d.ts +15 -0
  24. package/lib/input/input.component.d.ts +31 -0
  25. package/lib/input-mask/input-mask.component.d.ts +28 -0
  26. package/lib/loader/loader.component.d.ts +5 -0
  27. package/lib/main-menu/main-menu.component.d.ts +19 -0
  28. package/lib/modal/modal.component.d.ts +57 -0
  29. package/lib/navbar/navbar.component.d.ts +34 -0
  30. package/lib/picklist/picklist.component.d.ts +33 -0
  31. package/lib/progress-bar/progress-bar.component.d.ts +6 -0
  32. package/lib/tag/tag.component.d.ts +10 -0
  33. package/lib/textarea/textarea.component.d.ts +28 -0
  34. package/lib/toggle-switch/toggle-switch.component.d.ts +17 -0
  35. package/lib/tooltip/tooltip.component.d.ts +25 -0
  36. package/models/enums/button/button-color.enum.d.ts +10 -0
  37. package/models/enums/button/button-icon-position.enum.d.ts +4 -0
  38. package/models/enums/button/button-size.enum.d.ts +5 -0
  39. package/models/enums/confirm-modal/confirm-modal-color.enum.d.ts +7 -0
  40. package/models/enums/dropdown/dropdown-selection-mode.enum.d.ts +5 -0
  41. package/models/enums/expanded-table/expanded-table.enum.d.ts +5 -0
  42. package/models/enums/input/input-type.enum.d.ts +5 -0
  43. package/models/enums/table/caption-color.enum.d.ts +5 -0
  44. package/models/enums/tag/tag.enum.d.ts +8 -0
  45. package/models/enums/toast/toast-position-key.enum.d.ts +8 -0
  46. package/models/enums/toast/toast-severity.enum.d.ts +6 -0
  47. package/models/enums/tooltip/tooltip-hover-event.enum.d.ts +4 -0
  48. package/models/enums/tooltip/tooltip-position.enum.d.ts +6 -0
  49. package/models/interaces/confirm-modal/confirm-modal-service.interface.d.ts +10 -0
  50. package/models/interaces/custom-table/custom-table.interface.d.ts +20 -0
  51. package/models/interaces/navbar/navbar-link-list.interface.d.ts +3 -0
  52. package/models/interaces/shared/form-status.interface.d.ts +8 -0
  53. package/package.json +23 -0
  54. package/public-api.d.ts +37 -0
  55. package/services/app-config.service.d.ts +16 -0
  56. package/services/cache.service.d.ts +7 -0
  57. package/services/confirm-modal-service.d.ts +19 -0
  58. package/services/dynamic-route.service.d.ts +9 -0
  59. package/services/export.service.d.ts +12 -0
  60. package/services/local-storage.service.d.ts +34 -0
  61. package/services/no-internet.service.d.ts +11 -0
  62. package/services/translation.service.d.ts +13 -0
@@ -0,0 +1,2858 @@
1
+ import * as i0 from '@angular/core';
2
+ import { Injectable, SecurityContext, HostListener, ViewChild, Input, ChangeDetectionStrategy, Component, EventEmitter, Output } from '@angular/core';
3
+ import { BehaviorSubject, firstValueFrom, Subscription, take, interval } from 'rxjs';
4
+ import * as i1 from '@angular/common/http';
5
+ import * as i2 from '@ngx-translate/core';
6
+ import { TranslateModule } from '@ngx-translate/core';
7
+ import * as i1$1 from 'primeng/api';
8
+ import { ConfirmEventType, PrimeTemplate } from 'primeng/api';
9
+ import * as i1$2 from '@angular/router';
10
+ import * as XLSX from 'xlsx';
11
+ import * as i1$4 from '@angular/forms';
12
+ import { FormsModule, ReactiveFormsModule, FormGroup } from '@angular/forms';
13
+ import * as i1$9 from '@angular/common';
14
+ import { NgIf, NgClass, NgTemplateOutlet, NgFor, UpperCasePipe, NgStyle, DatePipe, CommonModule } from '@angular/common';
15
+ import { Tooltip } from 'primeng/tooltip';
16
+ import * as i1$3 from '@angular/platform-browser';
17
+ import { InputText, InputTextModule } from 'primeng/inputtext';
18
+ import * as i2$1 from 'primeng/textarea';
19
+ import { TextareaModule } from 'primeng/textarea';
20
+ import { Button } from 'primeng/button';
21
+ import { Dialog } from 'primeng/dialog';
22
+ import * as i5 from 'primeng/multiselect';
23
+ import { MultiSelectModule } from 'primeng/multiselect';
24
+ import * as i3 from 'primeng/select';
25
+ import { SelectModule } from 'primeng/select';
26
+ import { Breadcrumb } from 'primeng/breadcrumb';
27
+ import { Divider } from 'primeng/divider';
28
+ import * as i2$2 from 'primeng/datepicker';
29
+ import { DatePickerModule } from 'primeng/datepicker';
30
+ import { Checkbox } from 'primeng/checkbox';
31
+ import * as i1$5 from 'primeng/confirmdialog';
32
+ import { ConfirmDialogModule } from 'primeng/confirmdialog';
33
+ import * as i1$6 from 'primeng/table';
34
+ import { TableModule } from 'primeng/table';
35
+ import * as i2$3 from 'primeng/toggleswitch';
36
+ import { ToggleSwitchModule } from 'primeng/toggleswitch';
37
+ import { Tag } from 'primeng/tag';
38
+ import { ProgressSpinner } from 'primeng/progressspinner';
39
+ import * as i1$7 from 'primeng/accordion';
40
+ import { Accordion, AccordionModule } from 'primeng/accordion';
41
+ import { SelectButton } from 'primeng/selectbutton';
42
+ import * as i3$1 from 'primeng/popover';
43
+ import { PopoverModule } from 'primeng/popover';
44
+ import { ProgressBar } from 'primeng/progressbar';
45
+ import * as i1$8 from 'primeng/picklist';
46
+ import { PickListModule } from 'primeng/picklist';
47
+ import { Card } from 'primeng/card';
48
+ import { InputMask } from 'primeng/inputmask';
49
+ import * as i4 from 'primeng/chip';
50
+ import { ChipModule } from 'primeng/chip';
51
+ import * as i2$4 from 'primeng/menubar';
52
+ import { MenubarModule } from 'primeng/menubar';
53
+
54
+ class LocalStorageService {
55
+ storageChangeSubject = new BehaviorSubject(null);
56
+ constructor() {
57
+ window.addEventListener('storage', event => {
58
+ if (event.key === 'userData') {
59
+ this.storageChangeSubject.next(event.newValue);
60
+ }
61
+ });
62
+ }
63
+ getStorageChangeObservable() {
64
+ return this.storageChangeSubject.asObservable();
65
+ }
66
+ /**
67
+ * Retrieves an item from local storage.
68
+ *
69
+ * @param {string} key - The key of the item to retrieve.
70
+ * @returns {any|null} - The item retrieved from local storage, or null if the item does not exist.
71
+ *
72
+ */
73
+ getItem(key) {
74
+ const item = localStorage.getItem(key);
75
+ // Mare; bugfix - da pohendla pravilno tudi primer da je lang = undefined
76
+ if (item === "undefined" || item === null) {
77
+ return null;
78
+ }
79
+ return item ? JSON.parse(item) : null;
80
+ }
81
+ /**
82
+ * Stores an item in local storage.
83
+ *
84
+ * @param {string} key - The key under which to store the item.
85
+ * @param {any} value - The item to store in local storage.
86
+ *
87
+ */
88
+ setItem(key, value) {
89
+ localStorage.setItem(key, JSON.stringify(value));
90
+ this.storageChangeSubject.next(value);
91
+ }
92
+ /**
93
+ * Removes an item from local storage.
94
+ *
95
+ * @param {string} key - The key of the item to remove.
96
+ *
97
+ * @example
98
+ * removeItem('myKey');
99
+ */
100
+ removeItem(key) {
101
+ localStorage.removeItem(key);
102
+ this.storageChangeSubject.next(null);
103
+ }
104
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: LocalStorageService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
105
+ static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: LocalStorageService, providedIn: 'root' });
106
+ }
107
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: LocalStorageService, decorators: [{
108
+ type: Injectable,
109
+ args: [{
110
+ providedIn: 'root',
111
+ }]
112
+ }], ctorParameters: () => [] });
113
+
114
+ class TranslationService {
115
+ http;
116
+ translateService;
117
+ translationsLoaded = new BehaviorSubject(true);
118
+ constructor(http, translateService) {
119
+ this.http = http;
120
+ this.translateService = translateService;
121
+ }
122
+ async loadTranslations(organisation, language) {
123
+ const translationPath = `assets/i18n/${language}.json`;
124
+ const translations = await firstValueFrom(this.http.get(translationPath));
125
+ this.translateService.setTranslation(language, translations);
126
+ this.translateService.use(language);
127
+ this.translationsLoaded.next(false);
128
+ }
129
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: TranslationService, deps: [{ token: i1.HttpClient }, { token: i2.TranslateService }], target: i0.ɵɵFactoryTarget.Injectable });
130
+ static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: TranslationService, providedIn: 'root' });
131
+ }
132
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: TranslationService, decorators: [{
133
+ type: Injectable,
134
+ args: [{
135
+ providedIn: 'root',
136
+ }]
137
+ }], ctorParameters: () => [{ type: i1.HttpClient }, { type: i2.TranslateService }] });
138
+
139
+ var PositionKey;
140
+ (function (PositionKey) {
141
+ PositionKey["topCenter"] = "topCenter";
142
+ PositionKey["topLeft"] = "topLeft";
143
+ PositionKey["topRight"] = "topRight";
144
+ PositionKey["bottomCenter"] = "bottomCenter";
145
+ PositionKey["bottomLeft"] = "bottomLeft";
146
+ PositionKey["bottomRight"] = "bottomRight";
147
+ })(PositionKey || (PositionKey = {}));
148
+
149
+ var ToastSeverity;
150
+ (function (ToastSeverity) {
151
+ ToastSeverity["success"] = "success";
152
+ ToastSeverity["info"] = "info";
153
+ ToastSeverity["warning"] = "warn";
154
+ ToastSeverity["error"] = "error";
155
+ })(ToastSeverity || (ToastSeverity = {}));
156
+
157
+ class ConfirmModalService {
158
+ confirmationService;
159
+ messageService;
160
+ translateService;
161
+ translationService;
162
+ // Key must be the same as key in confirm-modal.component.html toast !!
163
+ positionKey = PositionKey.topCenter;
164
+ modalContent$ = new Subscription();
165
+ content;
166
+ constructor(confirmationService, messageService, translateService, translationService) {
167
+ this.confirmationService = confirmationService;
168
+ this.messageService = messageService;
169
+ this.translateService = translateService;
170
+ this.translationService = translationService;
171
+ this.loadModalContent();
172
+ }
173
+ loadModalContent() {
174
+ this.modalContent$.add(this.translationService.translationsLoaded.pipe(take(1)).subscribe(() => {
175
+ this.translateService.get('confirmModalService').subscribe(contentText => {
176
+ this.content = {
177
+ message: contentText.message,
178
+ header: contentText.header,
179
+ acceptSummary: contentText.acceptSummary,
180
+ acceptDetail: contentText.acceptDetail,
181
+ rejectSummary: contentText.rejectSummary,
182
+ rejectDetail: contentText.rejectDetail,
183
+ cancelSummary: contentText.cancelSummary,
184
+ cancelDetail: contentText.cancelDetail,
185
+ };
186
+ });
187
+ }));
188
+ }
189
+ confirm() {
190
+ this.confirmationService.confirm({
191
+ message: this.content.message,
192
+ header: this.content.header,
193
+ icon: 'pi pi-exclamation-circle',
194
+ accept: () => {
195
+ this.messageService.add({
196
+ key: this.positionKey,
197
+ severity: ToastSeverity.info,
198
+ summary: this.content?.acceptSummary,
199
+ detail: this.content?.acceptDetail,
200
+ });
201
+ },
202
+ reject: (type) => {
203
+ switch (type) {
204
+ case ConfirmEventType.REJECT:
205
+ this.messageService.add({
206
+ key: this.positionKey,
207
+ severity: ToastSeverity.error,
208
+ summary: this.content?.rejectSummary,
209
+ detail: this.content?.rejectDetail,
210
+ });
211
+ break;
212
+ case ConfirmEventType.CANCEL:
213
+ this.messageService.add({
214
+ key: this.positionKey,
215
+ severity: ToastSeverity.warning,
216
+ summary: this.content?.cancelSummary,
217
+ detail: this.content?.cancelDetail,
218
+ });
219
+ break;
220
+ }
221
+ },
222
+ });
223
+ }
224
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ConfirmModalService, deps: [{ token: i1$1.ConfirmationService }, { token: i1$1.MessageService }, { token: i2.TranslateService }, { token: TranslationService }], target: i0.ɵɵFactoryTarget.Injectable });
225
+ static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ConfirmModalService, providedIn: 'root' });
226
+ }
227
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ConfirmModalService, decorators: [{
228
+ type: Injectable,
229
+ args: [{
230
+ providedIn: 'root',
231
+ }]
232
+ }], ctorParameters: () => [{ type: i1$1.ConfirmationService }, { type: i1$1.MessageService }, { type: i2.TranslateService }, { type: TranslationService }] });
233
+
234
+ class DynamicRouteService {
235
+ router;
236
+ constructor(router) {
237
+ this.router = router;
238
+ }
239
+ getDynamicUrl(activatedRoute, url, queryParams, state) {
240
+ const organisation = activatedRoute.snapshot.url[0];
241
+ const language = activatedRoute.snapshot.url[1];
242
+ return this.router
243
+ .navigate([`/${organisation}/${language}/${url}`], { state: state, queryParams: queryParams })
244
+ .then();
245
+ }
246
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: DynamicRouteService, deps: [{ token: i1$2.Router }], target: i0.ɵɵFactoryTarget.Injectable });
247
+ static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: DynamicRouteService, providedIn: 'root' });
248
+ }
249
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: DynamicRouteService, decorators: [{
250
+ type: Injectable,
251
+ args: [{
252
+ providedIn: 'root',
253
+ }]
254
+ }], ctorParameters: () => [{ type: i1$2.Router }] });
255
+
256
+ class NoInternetService {
257
+ translateService;
258
+ messageService;
259
+ constructor(translateService, messageService) {
260
+ this.translateService = translateService;
261
+ this.messageService = messageService;
262
+ }
263
+ checkInternetConnection() {
264
+ if (!navigator.onLine) {
265
+ this.messageService.add({
266
+ key: 'notification',
267
+ severity: 'error',
268
+ summary: this.translateService.instant('errors.noInternetConnection'),
269
+ life: 6000
270
+ });
271
+ return false;
272
+ }
273
+ return true;
274
+ }
275
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: NoInternetService, deps: [{ token: i2.TranslateService }, { token: i1$1.MessageService }], target: i0.ɵɵFactoryTarget.Injectable });
276
+ static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: NoInternetService, providedIn: 'root' });
277
+ }
278
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: NoInternetService, decorators: [{
279
+ type: Injectable,
280
+ args: [{
281
+ providedIn: 'root',
282
+ }]
283
+ }], ctorParameters: () => [{ type: i2.TranslateService }, { type: i1$1.MessageService }] });
284
+
285
+ class CacheService {
286
+ getCacheItem(key) {
287
+ const item = sessionStorage.getItem(key);
288
+ return item ? JSON.parse(item) : null;
289
+ }
290
+ cacheItem(key, value) {
291
+ sessionStorage.setItem(key, JSON.stringify(value));
292
+ }
293
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: CacheService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
294
+ static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: CacheService, providedIn: 'root' });
295
+ }
296
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: CacheService, decorators: [{
297
+ type: Injectable,
298
+ args: [{
299
+ providedIn: 'root',
300
+ }]
301
+ }] });
302
+
303
+ class AppConfigService {
304
+ config;
305
+ constructor() {
306
+ this.config = globalThis.APP_CONFIG;
307
+ }
308
+ getConfig() {
309
+ return this.config;
310
+ }
311
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: AppConfigService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
312
+ static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: AppConfigService, providedIn: 'root' });
313
+ }
314
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: AppConfigService, decorators: [{
315
+ type: Injectable,
316
+ args: [{
317
+ providedIn: 'root',
318
+ }]
319
+ }], ctorParameters: () => [] });
320
+
321
+ class ExportService {
322
+ /**
323
+ * izračun širine stolpcev na podlagi vsebine
324
+ */
325
+ calculateColumnWidths(objArray) {
326
+ const maxLengths = Object.keys(objArray[0]).map(key => {
327
+ return Math.max(key.length, // Dolžina headerja
328
+ ...objArray.map(obj => (obj[key] ? obj[key].toString().length : 0)) // Dolžina podatkov v stolpcu
329
+ );
330
+ });
331
+ return maxLengths.map(length => ({ wch: length + 2 })); // Dodamo nekaj prostora (2 znaka)
332
+ }
333
+ exportExcel(objArray, filename) {
334
+ const ws = XLSX.utils.json_to_sheet(objArray);
335
+ ws['!cols'] = this.calculateColumnWidths(objArray); // da so širši stolpci
336
+ const wb = XLSX.utils.book_new();
337
+ XLSX.utils.book_append_sheet(wb, ws, 'Sheet1');
338
+ XLSX.writeFile(wb, filename ?? 'izvoz.xlsx');
339
+ }
340
+ exportCSV(objArray) {
341
+ const header = Object.keys(objArray[0]).join(',') + '\n';
342
+ const rows = objArray
343
+ .map(obj => Object.values(obj)
344
+ .map(val => `"${val}"`)
345
+ .join(','))
346
+ .join('\n');
347
+ return header + rows;
348
+ }
349
+ exportXML(array) {
350
+ const rootTag = 'data';
351
+ const rowTag = 'record';
352
+ const rows = array
353
+ .map((obj) => {
354
+ const rowAttrs = Object.entries(obj)
355
+ .map(([key, val]) => `${key}="${val}"`)
356
+ .join(' ');
357
+ return `<${rowTag} ${rowAttrs} />`;
358
+ })
359
+ .join('\n');
360
+ return `<${rootTag}>\n${rows}\n</${rootTag}>`;
361
+ }
362
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ExportService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
363
+ static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ExportService, providedIn: 'root' });
364
+ }
365
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ExportService, decorators: [{
366
+ type: Injectable,
367
+ args: [{
368
+ providedIn: 'root',
369
+ }]
370
+ }] });
371
+
372
+ var TooltipPosition;
373
+ (function (TooltipPosition) {
374
+ TooltipPosition["left"] = "left";
375
+ TooltipPosition["right"] = "right";
376
+ TooltipPosition["top"] = "top";
377
+ TooltipPosition["bottom"] = "bottom";
378
+ })(TooltipPosition || (TooltipPosition = {}));
379
+
380
+ var InputType;
381
+ (function (InputType) {
382
+ InputType["text"] = "text";
383
+ InputType["number"] = "number";
384
+ InputType["email"] = "email";
385
+ })(InputType || (InputType = {}));
386
+
387
+ var TooltipHoverEventEnum;
388
+ (function (TooltipHoverEventEnum) {
389
+ TooltipHoverEventEnum["hover"] = "hover";
390
+ TooltipHoverEventEnum["focus"] = "focus";
391
+ })(TooltipHoverEventEnum || (TooltipHoverEventEnum = {}));
392
+
393
+ class TooltipComponent {
394
+ sanitizer;
395
+ icon = 'pi-info-circle';
396
+ htmlParser = false;
397
+ _text;
398
+ set text(value) {
399
+ if (value && this.htmlParser) {
400
+ const sanitizedValue = this.sanitizer.sanitize(SecurityContext.HTML, value) ?? '';
401
+ const parser = new DOMParser();
402
+ const decodedString = parser.parseFromString(sanitizedValue, 'text/html').documentElement
403
+ .textContent;
404
+ this._text = decodedString ?? '';
405
+ }
406
+ else {
407
+ this._text = value;
408
+ }
409
+ }
410
+ get text() {
411
+ return this._text;
412
+ }
413
+ position = TooltipPosition.right;
414
+ tooltipEvent;
415
+ autoHide = false;
416
+ htmlParse = true;
417
+ tooltip;
418
+ constructor(sanitizer) {
419
+ this.sanitizer = sanitizer;
420
+ }
421
+ ngOnInit() {
422
+ if (window.innerWidth > 768) {
423
+ this.tooltipEvent = TooltipHoverEventEnum.focus;
424
+ }
425
+ }
426
+ onClick() {
427
+ if (window.innerWidth <= 768) {
428
+ this.tooltip.activate();
429
+ }
430
+ }
431
+ onDocumentClick(event) {
432
+ if (!this.tooltip.el.nativeElement.contains(event.target)) {
433
+ this.tooltip.deactivate();
434
+ }
435
+ }
436
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: TooltipComponent, deps: [{ token: i1$3.DomSanitizer }], target: i0.ɵɵFactoryTarget.Component });
437
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.6", type: TooltipComponent, isStandalone: true, selector: " lib-tooltip", inputs: { icon: "icon", htmlParser: "htmlParser", text: "text", position: "position", tooltipEvent: "tooltipEvent", autoHide: "autoHide", htmlParse: "htmlParse" }, host: { listeners: { "document:click": "onDocumentClick($event)" } }, viewQueries: [{ propertyName: "tooltip", first: true, predicate: Tooltip, descendants: true }], ngImport: i0, template: "<i\r\n tabindex=\"0\"\r\n class=\"pi {{ icon }}\"\r\n pTooltip=\"{{ text }}\"\r\n [tooltipPosition]=\"position\"\r\n [tooltipEvent]='tooltipEvent'\r\n [autoHide]=\"autoHide\"\r\n [escape]=\"htmlParse\"\r\n (click)=\"onClick()\"\r\n [attr.aria-label]=\"text\"\r\n aria-describedby=\"tooltipId\"\r\n></i>\r\n\r\n<div id=\"tooltipId\" style=\"display: none;\">{{ text }}</div>\r\n\r\n", styles: ["i{color:#3e7c94}\n"], dependencies: [{ kind: "directive", type: Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
438
+ }
439
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: TooltipComponent, decorators: [{
440
+ type: Component,
441
+ args: [{ selector: ' lib-tooltip', changeDetection: ChangeDetectionStrategy.OnPush, imports: [Tooltip], template: "<i\r\n tabindex=\"0\"\r\n class=\"pi {{ icon }}\"\r\n pTooltip=\"{{ text }}\"\r\n [tooltipPosition]=\"position\"\r\n [tooltipEvent]='tooltipEvent'\r\n [autoHide]=\"autoHide\"\r\n [escape]=\"htmlParse\"\r\n (click)=\"onClick()\"\r\n [attr.aria-label]=\"text\"\r\n aria-describedby=\"tooltipId\"\r\n></i>\r\n\r\n<div id=\"tooltipId\" style=\"display: none;\">{{ text }}</div>\r\n\r\n", styles: ["i{color:#3e7c94}\n"] }]
442
+ }], ctorParameters: () => [{ type: i1$3.DomSanitizer }], propDecorators: { icon: [{
443
+ type: Input
444
+ }], htmlParser: [{
445
+ type: Input
446
+ }], text: [{
447
+ type: Input
448
+ }], position: [{
449
+ type: Input
450
+ }], tooltipEvent: [{
451
+ type: Input
452
+ }], autoHide: [{
453
+ type: Input
454
+ }], htmlParse: [{
455
+ type: Input
456
+ }], tooltip: [{
457
+ type: ViewChild,
458
+ args: [Tooltip]
459
+ }], onDocumentClick: [{
460
+ type: HostListener,
461
+ args: ['document:click', ['$event']]
462
+ }] } });
463
+
464
+ class ErrorComponent {
465
+ // eslint-disable-next-line
466
+ hasError;
467
+ isTouched = false;
468
+ isSubmitTriggered = false;
469
+ isNestedFormSubmit = false;
470
+ isDirty = false;
471
+ isRequired = false;
472
+ hasGroupError = false;
473
+ errorId;
474
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ErrorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
475
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.6", type: ErrorComponent, isStandalone: true, selector: "lib-error", inputs: { hasError: "hasError", isTouched: "isTouched", isSubmitTriggered: "isSubmitTriggered", isNestedFormSubmit: "isNestedFormSubmit", isDirty: "isDirty", isRequired: "isRequired", hasGroupError: "hasGroupError", errorId: "errorId" }, ngImport: i0, template: "<small class=\"required\" aria-live=\"polite\" [id]=\"errorId\">\r\n <ng-container *ngIf=\"hasError\">\r\n <ng-container *ngIf=\"(isTouched || isSubmitTriggered || isNestedFormSubmit) && hasError.required\">\r\n {{ 'errors.isRequired' | translate }}\r\n </ng-container>\r\n <ng-container *ngIf=\"(isTouched || isSubmitTriggered || isNestedFormSubmit) && !hasError.required && hasError.isNotBlank\">\r\n {{ 'errors.isNotBlank' | translate }}\r\n </ng-container>\r\n <ng-container *ngIf=\"(isTouched || isSubmitTriggered || isNestedFormSubmit) && !hasError.required && !hasError.isNotBlank && hasError.isCoordinate\">\r\n {{ 'errors.isCoordinate' | translate }}\r\n </ng-container>\r\n <ng-container *ngIf=\"((isTouched || isSubmitTriggered || isNestedFormSubmit) && !hasError.required && hasError.isNotDecimal)\">\r\n {{ 'errors.decimal' | translate }}\r\n </ng-container>\r\n <ng-container *ngIf=\"((isTouched || isSubmitTriggered || isNestedFormSubmit) && !hasError.required && hasError.min)\">\r\n {{ 'errors.minNumber' | translate }}\r\n </ng-container>\r\n <ng-container *ngIf=\"((isTouched || isSubmitTriggered || isNestedFormSubmit) && !hasError.required && !hasError.min && hasError.max)\">\r\n {{ 'errors.maxNumber' | translate }}\r\n </ng-container>\r\n <ng-container *ngIf=\"((isTouched || isSubmitTriggered || isNestedFormSubmit) && !hasError.required && hasError.email)\">\r\n {{ 'errors.email' | translate }}\r\n </ng-container>\r\n <ng-container *ngIf=\"((isTouched || isSubmitTriggered || isNestedFormSubmit) && !hasError.required && !hasGroupError && hasError.isNotValidPhoneNumber)\">\r\n {{ 'errors.phoneNumber' | translate }}\r\n </ng-container>\r\n <ng-container *ngIf=\"((isTouched || isSubmitTriggered || isNestedFormSubmit) && !hasError.required && hasError.isMultipleOfFive)\">\r\n {{ 'errors.isMultipleOfFive' | translate }}\r\n </ng-container>\r\n </ng-container>\r\n</small>\r\n", styles: [""], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }] });
476
+ }
477
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ErrorComponent, decorators: [{
478
+ type: Component,
479
+ args: [{ selector: 'lib-error', imports: [NgIf, TranslateModule], template: "<small class=\"required\" aria-live=\"polite\" [id]=\"errorId\">\r\n <ng-container *ngIf=\"hasError\">\r\n <ng-container *ngIf=\"(isTouched || isSubmitTriggered || isNestedFormSubmit) && hasError.required\">\r\n {{ 'errors.isRequired' | translate }}\r\n </ng-container>\r\n <ng-container *ngIf=\"(isTouched || isSubmitTriggered || isNestedFormSubmit) && !hasError.required && hasError.isNotBlank\">\r\n {{ 'errors.isNotBlank' | translate }}\r\n </ng-container>\r\n <ng-container *ngIf=\"(isTouched || isSubmitTriggered || isNestedFormSubmit) && !hasError.required && !hasError.isNotBlank && hasError.isCoordinate\">\r\n {{ 'errors.isCoordinate' | translate }}\r\n </ng-container>\r\n <ng-container *ngIf=\"((isTouched || isSubmitTriggered || isNestedFormSubmit) && !hasError.required && hasError.isNotDecimal)\">\r\n {{ 'errors.decimal' | translate }}\r\n </ng-container>\r\n <ng-container *ngIf=\"((isTouched || isSubmitTriggered || isNestedFormSubmit) && !hasError.required && hasError.min)\">\r\n {{ 'errors.minNumber' | translate }}\r\n </ng-container>\r\n <ng-container *ngIf=\"((isTouched || isSubmitTriggered || isNestedFormSubmit) && !hasError.required && !hasError.min && hasError.max)\">\r\n {{ 'errors.maxNumber' | translate }}\r\n </ng-container>\r\n <ng-container *ngIf=\"((isTouched || isSubmitTriggered || isNestedFormSubmit) && !hasError.required && hasError.email)\">\r\n {{ 'errors.email' | translate }}\r\n </ng-container>\r\n <ng-container *ngIf=\"((isTouched || isSubmitTriggered || isNestedFormSubmit) && !hasError.required && !hasGroupError && hasError.isNotValidPhoneNumber)\">\r\n {{ 'errors.phoneNumber' | translate }}\r\n </ng-container>\r\n <ng-container *ngIf=\"((isTouched || isSubmitTriggered || isNestedFormSubmit) && !hasError.required && hasError.isMultipleOfFive)\">\r\n {{ 'errors.isMultipleOfFive' | translate }}\r\n </ng-container>\r\n </ng-container>\r\n</small>\r\n" }]
480
+ }], propDecorators: { hasError: [{
481
+ type: Input
482
+ }], isTouched: [{
483
+ type: Input
484
+ }], isSubmitTriggered: [{
485
+ type: Input
486
+ }], isNestedFormSubmit: [{
487
+ type: Input
488
+ }], isDirty: [{
489
+ type: Input
490
+ }], isRequired: [{
491
+ type: Input
492
+ }], hasGroupError: [{
493
+ type: Input
494
+ }], errorId: [{
495
+ type: Input
496
+ }] } });
497
+
498
+ class InputComponent {
499
+ _isTooltipVisible;
500
+ name;
501
+ type = InputType.text;
502
+ label;
503
+ placeholder;
504
+ accessibilityText = '';
505
+ group;
506
+ controlName;
507
+ isRequired = true;
508
+ isLabelVisible = true;
509
+ tooltipPosition = TooltipPosition.right;
510
+ tooltipText = '';
511
+ formStatus;
512
+ groupError = false;
513
+ hasGap = true;
514
+ hasTitle = false;
515
+ maxLength = null;
516
+ ngOnInit() {
517
+ this._isTooltipVisible = !!this.tooltipText;
518
+ }
519
+ onNumberKeyDown(event) {
520
+ const invalidKeys = ['e', 'E', '+', '-', ',', '.'];
521
+ if (invalidKeys.includes(event.key)) {
522
+ event.preventDefault();
523
+ }
524
+ }
525
+ TooltipHoverEventEnum = TooltipHoverEventEnum;
526
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: InputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
527
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.6", type: InputComponent, isStandalone: true, selector: "lib-input[group][controlName][name]", inputs: { name: "name", type: "type", label: "label", placeholder: "placeholder", accessibilityText: "accessibilityText", group: "group", controlName: "controlName", isRequired: "isRequired", isLabelVisible: "isLabelVisible", tooltipPosition: "tooltipPosition", tooltipText: "tooltipText", formStatus: "formStatus", groupError: "groupError", hasGap: "hasGap", hasTitle: "hasTitle", maxLength: "maxLength" }, ngImport: i0, template: "<div class=\"flex flex-column\" [formGroup]=\"group\" [ngClass]=\"{ 'gap-1': hasGap }\">\r\n <div class=\"flex\" *ngIf=\"isLabelVisible\">\r\n <label [title]=\"hasTitle ? label : ''\" [for]='name' class=\"mr-2\">\r\n {{label}}<span class=\"required\" aria-label=\"Is required filed\" *ngIf=\"isRequired\">*</span>\r\n </label>\r\n <lib-tooltip\r\n *ngIf=\"_isTooltipVisible\"\r\n [position]=\"tooltipPosition\"\r\n [text]=\"tooltipText!\"\r\n ></lib-tooltip>\r\n </div>\r\n <input\r\n [type]='type'\r\n [id]=\"name\"\r\n pInputText\r\n [placeholder]='placeholder ?? \" \"'\r\n [formControlName]=\"controlName\"\r\n [min]=\"type === 'number' && 1\"\r\n [max]=\"type === 'number' && 10\"\r\n [maxlength]=\"maxLength\" \r\n [attr.aria-label]=\"accessibilityText\"\r\n [ngClass]=\"{ 'ng-dirty ng-invalid': (group.get(controlName)!.errors && (group.get(controlName)!.touched || formStatus!.isSubmitTriggered)) || groupError }\"\r\n (keydown)=\"type === 'number' ? onNumberKeyDown($event) : null\"\r\n [attr.aria-describedby]=\"name + 'Error'\"\r\n [attr.aria-invalid]=\"(group.get(controlName)!.errors && (group.get(controlName)!.touched || formStatus!.isSubmitTriggered)) || groupError\"\r\n [attr.aria-required]=\"isRequired\"\r\n />\r\n</div>\r\n <lib-error\r\n *ngIf=\"(group.get(controlName)!.errors && (group.get(controlName)!.touched) || formStatus!.isSubmitTriggered)\"\r\n [hasError]=\"group.get(controlName)!.errors\"\r\n [isTouched]=\"group.get(controlName)!.touched\"\r\n [isSubmitTriggered]=\"formStatus!.isSubmitTriggered!\"\r\n [hasGroupError]=\"groupError\"\r\n [errorId]=\"name+'Error'\"\r\n ></lib-error>\r\n", styles: [".p-component{border:1.75px solid #3E7C94!important}.p-component::placeholder{font-style:italic!important;color:#848484!important}.p-component:hover{border:1.75px solid #ffa142!important}.p-component:focus{box-shadow:0 0 2px 3px #ffa142!important}label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$4.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: TooltipComponent, selector: " lib-tooltip", inputs: ["icon", "htmlParser", "text", "position", "tooltipEvent", "autoHide", "htmlParse"] }, { kind: "directive", type: InputText, selector: "[pInputText]", inputs: ["variant", "fluid", "pSize"] }, { kind: "component", type: ErrorComponent, selector: "lib-error", inputs: ["hasError", "isTouched", "isSubmitTriggered", "isNestedFormSubmit", "isDirty", "isRequired", "hasGroupError", "errorId"] }] });
528
+ }
529
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: InputComponent, decorators: [{
530
+ type: Component,
531
+ args: [{ selector: 'lib-input[group][controlName][name]', imports: [
532
+ FormsModule,
533
+ ReactiveFormsModule,
534
+ NgClass,
535
+ NgIf,
536
+ TooltipComponent,
537
+ InputText,
538
+ ErrorComponent,
539
+ ], template: "<div class=\"flex flex-column\" [formGroup]=\"group\" [ngClass]=\"{ 'gap-1': hasGap }\">\r\n <div class=\"flex\" *ngIf=\"isLabelVisible\">\r\n <label [title]=\"hasTitle ? label : ''\" [for]='name' class=\"mr-2\">\r\n {{label}}<span class=\"required\" aria-label=\"Is required filed\" *ngIf=\"isRequired\">*</span>\r\n </label>\r\n <lib-tooltip\r\n *ngIf=\"_isTooltipVisible\"\r\n [position]=\"tooltipPosition\"\r\n [text]=\"tooltipText!\"\r\n ></lib-tooltip>\r\n </div>\r\n <input\r\n [type]='type'\r\n [id]=\"name\"\r\n pInputText\r\n [placeholder]='placeholder ?? \" \"'\r\n [formControlName]=\"controlName\"\r\n [min]=\"type === 'number' && 1\"\r\n [max]=\"type === 'number' && 10\"\r\n [maxlength]=\"maxLength\" \r\n [attr.aria-label]=\"accessibilityText\"\r\n [ngClass]=\"{ 'ng-dirty ng-invalid': (group.get(controlName)!.errors && (group.get(controlName)!.touched || formStatus!.isSubmitTriggered)) || groupError }\"\r\n (keydown)=\"type === 'number' ? onNumberKeyDown($event) : null\"\r\n [attr.aria-describedby]=\"name + 'Error'\"\r\n [attr.aria-invalid]=\"(group.get(controlName)!.errors && (group.get(controlName)!.touched || formStatus!.isSubmitTriggered)) || groupError\"\r\n [attr.aria-required]=\"isRequired\"\r\n />\r\n</div>\r\n <lib-error\r\n *ngIf=\"(group.get(controlName)!.errors && (group.get(controlName)!.touched) || formStatus!.isSubmitTriggered)\"\r\n [hasError]=\"group.get(controlName)!.errors\"\r\n [isTouched]=\"group.get(controlName)!.touched\"\r\n [isSubmitTriggered]=\"formStatus!.isSubmitTriggered!\"\r\n [hasGroupError]=\"groupError\"\r\n [errorId]=\"name+'Error'\"\r\n ></lib-error>\r\n", styles: [".p-component{border:1.75px solid #3E7C94!important}.p-component::placeholder{font-style:italic!important;color:#848484!important}.p-component:hover{border:1.75px solid #ffa142!important}.p-component:focus{box-shadow:0 0 2px 3px #ffa142!important}label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}\n"] }]
540
+ }], propDecorators: { name: [{
541
+ type: Input
542
+ }], type: [{
543
+ type: Input
544
+ }], label: [{
545
+ type: Input
546
+ }], placeholder: [{
547
+ type: Input
548
+ }], accessibilityText: [{
549
+ type: Input
550
+ }], group: [{
551
+ type: Input
552
+ }], controlName: [{
553
+ type: Input
554
+ }], isRequired: [{
555
+ type: Input
556
+ }], isLabelVisible: [{
557
+ type: Input
558
+ }], tooltipPosition: [{
559
+ type: Input
560
+ }], tooltipText: [{
561
+ type: Input
562
+ }], formStatus: [{
563
+ type: Input
564
+ }], groupError: [{
565
+ type: Input
566
+ }], hasGap: [{
567
+ type: Input
568
+ }], hasTitle: [{
569
+ type: Input
570
+ }], maxLength: [{
571
+ type: Input
572
+ }] } });
573
+
574
+ class TextareaComponent {
575
+ _isTooltipVisible;
576
+ name;
577
+ resize = false;
578
+ label;
579
+ placeholder = '';
580
+ accessibilityText = '';
581
+ rows = 5;
582
+ cols = 30;
583
+ tooltipPosition = TooltipPosition.right;
584
+ tooltipText = '';
585
+ group;
586
+ controlName;
587
+ isRequired = false;
588
+ formStatus;
589
+ hasGap = true;
590
+ // 2024-03-19; zato da je možno maxlength zaobit v določenih primerih (npr. inline forma na upravni-postopki)
591
+ customMaxLength = 255;
592
+ ngOnInit() {
593
+ this._isTooltipVisible = !!this.tooltipText;
594
+ }
595
+ TooltipHoverEventEnum = TooltipHoverEventEnum;
596
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: TextareaComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
597
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.6", type: TextareaComponent, isStandalone: true, selector: "lib-textarea[group][controlName][name]", inputs: { name: "name", resize: "resize", label: "label", placeholder: "placeholder", accessibilityText: "accessibilityText", rows: "rows", cols: "cols", tooltipPosition: "tooltipPosition", tooltipText: "tooltipText", group: "group", controlName: "controlName", isRequired: "isRequired", formStatus: "formStatus", hasGap: "hasGap", customMaxLength: "customMaxLength" }, ngImport: i0, template: "<div class=\"card flex flex-column gap-1\" [ngClass]=\"{\r\n 'resize-none': !resize,\r\n 'gap-1': hasGap,\r\n }\" [formGroup]=\"group\">\r\n <div class=\"flex\">\r\n <label [for]=\"name\" class=\"mr-2\">\r\n {{label}}<span class=\"required\" aria-label=\"Is required filed\" *ngIf=\"isRequired\">*</span>\r\n </label>\r\n <lib-tooltip\r\n *ngIf=\"_isTooltipVisible\"\r\n [position]=\"tooltipPosition\"\r\n [text]=\"tooltipText!\"\r\n ></lib-tooltip>\r\n </div>\r\n <textarea [id]=\"name\"\r\n [rows]=\"rows\"\r\n [cols]=\"cols\"\r\n pTextarea \r\n [maxlength]=\"customMaxLength\"\r\n [placeholder]='placeholder'\r\n [formControlName]=\"controlName\"\r\n [ngClass]=\"{ 'ng-dirty': (group.get(controlName)!.errors && (group.get(controlName)!.touched) || formStatus!.isSubmitTriggered) }\"\r\n [attr.aria-label]=\"accessibilityText\"\r\n [attr.aria-describedby]=\"name + 'Error'\"\r\n [attr.aria-invalid]=\"(group.get(controlName)!.errors && (group.get(controlName)!.touched || formStatus!.isSubmitTriggered))\"\r\n [attr.aria-required]=\"isRequired\"\r\n ></textarea>\r\n <lib-error\r\n *ngIf=\"(group.get(controlName)!.errors && (group.get(controlName)!.touched) || formStatus!.isSubmitTriggered)\"\r\n [hasError]=\"group.get(controlName)!.errors\"\r\n [isTouched]=\"group.get(controlName)!.touched\"\r\n [isSubmitTriggered]=\"formStatus!.isSubmitTriggered!\"\r\n [errorId]=\"name+'Error'\"\r\n ></lib-error>\r\n</div>\r\n", styles: [".resize-none textarea{resize:none}:host ::ng-deep .p-textarea{border:1.75px solid #3E7C94!important}:host ::ng-deep .p-textarea::placeholder{font-style:italic!important;color:#848484!important}:host ::ng-deep .p-textarea:hover{border:1.75px solid #ffa142!important}:host ::ng-deep .p-textarea:focus{box-shadow:0 0 2px 3px #ffa142!important}:host ::ng-deep .p-inputtext{border:1px solid #1B495A;font-family:Republika,Roboto,sans-serif}:host ::ng-deep .p-inputtext::placeholder{color:#848484}:host ::ng-deep .card{padding:0!important}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$4.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: TextareaModule }, { kind: "directive", type: i2$1.Textarea, selector: "[pTextarea], [pInputTextarea]", inputs: ["autoResize", "variant", "fluid", "pSize"], outputs: ["onResize"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: TooltipComponent, selector: " lib-tooltip", inputs: ["icon", "htmlParser", "text", "position", "tooltipEvent", "autoHide", "htmlParse"] }, { kind: "component", type: ErrorComponent, selector: "lib-error", inputs: ["hasError", "isTouched", "isSubmitTriggered", "isNestedFormSubmit", "isDirty", "isRequired", "hasGroupError", "errorId"] }] });
598
+ }
599
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: TextareaComponent, decorators: [{
600
+ type: Component,
601
+ args: [{ selector: 'lib-textarea[group][controlName][name]', imports: [
602
+ NgClass,
603
+ FormsModule,
604
+ ReactiveFormsModule,
605
+ TextareaModule,
606
+ NgIf,
607
+ TooltipComponent,
608
+ ErrorComponent,
609
+ ], template: "<div class=\"card flex flex-column gap-1\" [ngClass]=\"{\r\n 'resize-none': !resize,\r\n 'gap-1': hasGap,\r\n }\" [formGroup]=\"group\">\r\n <div class=\"flex\">\r\n <label [for]=\"name\" class=\"mr-2\">\r\n {{label}}<span class=\"required\" aria-label=\"Is required filed\" *ngIf=\"isRequired\">*</span>\r\n </label>\r\n <lib-tooltip\r\n *ngIf=\"_isTooltipVisible\"\r\n [position]=\"tooltipPosition\"\r\n [text]=\"tooltipText!\"\r\n ></lib-tooltip>\r\n </div>\r\n <textarea [id]=\"name\"\r\n [rows]=\"rows\"\r\n [cols]=\"cols\"\r\n pTextarea \r\n [maxlength]=\"customMaxLength\"\r\n [placeholder]='placeholder'\r\n [formControlName]=\"controlName\"\r\n [ngClass]=\"{ 'ng-dirty': (group.get(controlName)!.errors && (group.get(controlName)!.touched) || formStatus!.isSubmitTriggered) }\"\r\n [attr.aria-label]=\"accessibilityText\"\r\n [attr.aria-describedby]=\"name + 'Error'\"\r\n [attr.aria-invalid]=\"(group.get(controlName)!.errors && (group.get(controlName)!.touched || formStatus!.isSubmitTriggered))\"\r\n [attr.aria-required]=\"isRequired\"\r\n ></textarea>\r\n <lib-error\r\n *ngIf=\"(group.get(controlName)!.errors && (group.get(controlName)!.touched) || formStatus!.isSubmitTriggered)\"\r\n [hasError]=\"group.get(controlName)!.errors\"\r\n [isTouched]=\"group.get(controlName)!.touched\"\r\n [isSubmitTriggered]=\"formStatus!.isSubmitTriggered!\"\r\n [errorId]=\"name+'Error'\"\r\n ></lib-error>\r\n</div>\r\n", styles: [".resize-none textarea{resize:none}:host ::ng-deep .p-textarea{border:1.75px solid #3E7C94!important}:host ::ng-deep .p-textarea::placeholder{font-style:italic!important;color:#848484!important}:host ::ng-deep .p-textarea:hover{border:1.75px solid #ffa142!important}:host ::ng-deep .p-textarea:focus{box-shadow:0 0 2px 3px #ffa142!important}:host ::ng-deep .p-inputtext{border:1px solid #1B495A;font-family:Republika,Roboto,sans-serif}:host ::ng-deep .p-inputtext::placeholder{color:#848484}:host ::ng-deep .card{padding:0!important}\n"] }]
610
+ }], propDecorators: { name: [{
611
+ type: Input
612
+ }], resize: [{
613
+ type: Input
614
+ }], label: [{
615
+ type: Input
616
+ }], placeholder: [{
617
+ type: Input
618
+ }], accessibilityText: [{
619
+ type: Input
620
+ }], rows: [{
621
+ type: Input
622
+ }], cols: [{
623
+ type: Input
624
+ }], tooltipPosition: [{
625
+ type: Input
626
+ }], tooltipText: [{
627
+ type: Input
628
+ }], group: [{
629
+ type: Input
630
+ }], controlName: [{
631
+ type: Input
632
+ }], isRequired: [{
633
+ type: Input
634
+ }], formStatus: [{
635
+ type: Input
636
+ }], hasGap: [{
637
+ type: Input
638
+ }], customMaxLength: [{
639
+ type: Input
640
+ }] } });
641
+
642
+ var ButtonColor;
643
+ (function (ButtonColor) {
644
+ ButtonColor["primary"] = "primary";
645
+ ButtonColor["secondary"] = "secondary";
646
+ ButtonColor["success"] = "success";
647
+ ButtonColor["info"] = "info";
648
+ ButtonColor["warning"] = "warning";
649
+ ButtonColor["help"] = "help";
650
+ ButtonColor["danger"] = "danger";
651
+ ButtonColor["link"] = "link";
652
+ })(ButtonColor || (ButtonColor = {}));
653
+
654
+ var ButtonIconPosition;
655
+ (function (ButtonIconPosition) {
656
+ ButtonIconPosition["right"] = "right";
657
+ ButtonIconPosition["left"] = "left";
658
+ })(ButtonIconPosition || (ButtonIconPosition = {}));
659
+
660
+ var ButtonSize;
661
+ (function (ButtonSize) {
662
+ ButtonSize["small"] = "p-button p-button-sm";
663
+ ButtonSize["normal"] = "p-button";
664
+ ButtonSize["large"] = "p-button p-button-lg";
665
+ })(ButtonSize || (ButtonSize = {}));
666
+
667
+ class ButtonComponent {
668
+ hasIcon = false;
669
+ label;
670
+ color = ButtonColor.primary;
671
+ icon = 'pi-check';
672
+ iconPos = ButtonIconPosition.right;
673
+ disabled = false;
674
+ isLoading = false;
675
+ // You have the option to add multiple classes, but if you don't add any, the default class will be used instead.
676
+ // p-button-raised, p-button-outlined, p-button-text, p-button-rounded
677
+ styleClass;
678
+ size = ButtonSize.normal;
679
+ accessibilityText = '';
680
+ buttonType = 'button';
681
+ isAccessible = false;
682
+ isSelected = false;
683
+ ariaControlsId = null;
684
+ isExpanded = false;
685
+ clickEvent = new EventEmitter();
686
+ link = false;
687
+ isTextareaClear = false;
688
+ click(event) {
689
+ this.clickEvent.emit(event);
690
+ }
691
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
692
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.6", type: ButtonComponent, isStandalone: true, selector: "lib-button", inputs: { hasIcon: "hasIcon", label: "label", color: "color", icon: "icon", iconPos: "iconPos", disabled: "disabled", isLoading: "isLoading", styleClass: "styleClass", size: "size", accessibilityText: "accessibilityText", buttonType: "buttonType", isAccessible: "isAccessible", isSelected: "isSelected", ariaControlsId: "ariaControlsId", isExpanded: "isExpanded", link: "link", isTextareaClear: "isTextareaClear" }, outputs: { clickEvent: "clickEvent" }, ngImport: i0, template: "<p-button\r\n *ngIf='!hasIcon'\r\n label=\"{{label}}\"\r\n styleClass=\"p-button-{{color}} {{styleClass}} p-button-{{size}}\"\r\n [disabled]='disabled'\r\n [loading]=\"isLoading\"\r\n (click)='click($event)'\r\n [ariaLabel]=\"accessibilityText\"\r\n [type]=\"buttonType\"\r\n [ngClass]=\"{ 'selected ': isSelected, 'accessible-btn' : isAccessible }\"\r\n [attr.aria-controls]=\"ariaControlsId\"\r\n [attr.aria-expanded]=\"isExpanded\"\r\n [link]=\"link\"\r\n></p-button>\r\n<p-button\r\n *ngIf='hasIcon'\r\n label=\"{{label}}\"\r\n styleClass=\"p-button-{{color}} {{styleClass}} p-button-{{size}}\"\r\n icon='pi {{icon}}'\r\n [iconPos]='iconPos'\r\n [disabled]='disabled'\r\n [loading]=\"isLoading\"\r\n (click)=\"click($event)\"\r\n [ariaLabel]=\"accessibilityText\"\r\n [type]=\"buttonType\"\r\n [ngClass]=\"{ 'selected ': isSelected, 'accessible-btn' : isAccessible }\"\r\n [attr.aria-controls]=\"ariaControlsId\"\r\n [attr.aria-expanded]=\"isExpanded\"\r\n [link]=\"link\"\r\n></p-button>\r\n", styles: [":host ::ng-deep .p-button{width:100%}:host ::ng-deep .p-button:active{background:#1b495a}:host ::ng-deep .p-button.p-button-warning:hover{background:#ffa142;border:1px solid #ffa142}:host ::ng-deep .accessible-btn .p-button{border:15px solid transparent}:host ::ng-deep .selected .p-button{border:15px solid #000000;border-left-color:#6d7375;border-right-color:#6d7375;background-color:#fff;color:#000}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "autofocus", "fluid", "buttonProps"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
693
+ }
694
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ButtonComponent, decorators: [{
695
+ type: Component,
696
+ args: [{ selector: 'lib-button', imports: [
697
+ NgIf,
698
+ Button,
699
+ NgClass,
700
+ ], template: "<p-button\r\n *ngIf='!hasIcon'\r\n label=\"{{label}}\"\r\n styleClass=\"p-button-{{color}} {{styleClass}} p-button-{{size}}\"\r\n [disabled]='disabled'\r\n [loading]=\"isLoading\"\r\n (click)='click($event)'\r\n [ariaLabel]=\"accessibilityText\"\r\n [type]=\"buttonType\"\r\n [ngClass]=\"{ 'selected ': isSelected, 'accessible-btn' : isAccessible }\"\r\n [attr.aria-controls]=\"ariaControlsId\"\r\n [attr.aria-expanded]=\"isExpanded\"\r\n [link]=\"link\"\r\n></p-button>\r\n<p-button\r\n *ngIf='hasIcon'\r\n label=\"{{label}}\"\r\n styleClass=\"p-button-{{color}} {{styleClass}} p-button-{{size}}\"\r\n icon='pi {{icon}}'\r\n [iconPos]='iconPos'\r\n [disabled]='disabled'\r\n [loading]=\"isLoading\"\r\n (click)=\"click($event)\"\r\n [ariaLabel]=\"accessibilityText\"\r\n [type]=\"buttonType\"\r\n [ngClass]=\"{ 'selected ': isSelected, 'accessible-btn' : isAccessible }\"\r\n [attr.aria-controls]=\"ariaControlsId\"\r\n [attr.aria-expanded]=\"isExpanded\"\r\n [link]=\"link\"\r\n></p-button>\r\n", styles: [":host ::ng-deep .p-button{width:100%}:host ::ng-deep .p-button:active{background:#1b495a}:host ::ng-deep .p-button.p-button-warning:hover{background:#ffa142;border:1px solid #ffa142}:host ::ng-deep .accessible-btn .p-button{border:15px solid transparent}:host ::ng-deep .selected .p-button{border:15px solid #000000;border-left-color:#6d7375;border-right-color:#6d7375;background-color:#fff;color:#000}\n"] }]
701
+ }], propDecorators: { hasIcon: [{
702
+ type: Input
703
+ }], label: [{
704
+ type: Input
705
+ }], color: [{
706
+ type: Input
707
+ }], icon: [{
708
+ type: Input
709
+ }], iconPos: [{
710
+ type: Input
711
+ }], disabled: [{
712
+ type: Input
713
+ }], isLoading: [{
714
+ type: Input
715
+ }], styleClass: [{
716
+ type: Input
717
+ }], size: [{
718
+ type: Input
719
+ }], accessibilityText: [{
720
+ type: Input
721
+ }], buttonType: [{
722
+ type: Input
723
+ }], isAccessible: [{
724
+ type: Input
725
+ }], isSelected: [{
726
+ type: Input
727
+ }], ariaControlsId: [{
728
+ type: Input
729
+ }], isExpanded: [{
730
+ type: Input
731
+ }], clickEvent: [{
732
+ type: Output
733
+ }], link: [{
734
+ type: Input
735
+ }], isTextareaClear: [{
736
+ type: Input
737
+ }] } });
738
+
739
+ class IconButtonComponent {
740
+ icon = 'check';
741
+ disabled = false;
742
+ color = ButtonColor.primary;
743
+ // You have the option to add multiple classes, but if you don't add any, the default class will be used instead.
744
+ // p-button-raised, p-button-outlined, p-button-text, p-button-rounded
745
+ styleClass = 'p-button-raised';
746
+ size = ButtonSize.normal;
747
+ clickEvent = new EventEmitter();
748
+ click(event) {
749
+ this.clickEvent.emit(event);
750
+ }
751
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: IconButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
752
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.6", type: IconButtonComponent, isStandalone: true, selector: "lib-icon-button", inputs: { icon: "icon", disabled: "disabled", color: "color", styleClass: "styleClass", size: "size" }, outputs: { clickEvent: "clickEvent" }, ngImport: i0, template: "<p-button\r\n icon=\"pi pi-{{icon}}\"\r\n styleClass='p-button-{{color}}\r\n {{styleClass}} {{size}}'\r\n [disabled]='disabled'\r\n (click)='click($event)'\r\n></p-button>\r\n", styles: [""], dependencies: [{ kind: "component", type: Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "autofocus", "fluid", "buttonProps"], outputs: ["onClick", "onFocus", "onBlur"] }] });
753
+ }
754
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: IconButtonComponent, decorators: [{
755
+ type: Component,
756
+ args: [{ selector: 'lib-icon-button', imports: [Button], template: "<p-button\r\n icon=\"pi pi-{{icon}}\"\r\n styleClass='p-button-{{color}}\r\n {{styleClass}} {{size}}'\r\n [disabled]='disabled'\r\n (click)='click($event)'\r\n></p-button>\r\n" }]
757
+ }], propDecorators: { icon: [{
758
+ type: Input
759
+ }], disabled: [{
760
+ type: Input
761
+ }], color: [{
762
+ type: Input
763
+ }], styleClass: [{
764
+ type: Input
765
+ }], size: [{
766
+ type: Input
767
+ }], clickEvent: [{
768
+ type: Output
769
+ }] } });
770
+
771
+ var DialogColor;
772
+ (function (DialogColor) {
773
+ DialogColor["primary"] = "primary";
774
+ DialogColor["secondary"] = "secondary";
775
+ DialogColor["info"] = "info";
776
+ DialogColor["warning"] = "warning";
777
+ DialogColor["danger"] = "danger";
778
+ })(DialogColor || (DialogColor = {}));
779
+
780
+ class ModalComponent {
781
+ header = 'Header title';
782
+ headerColor = DialogColor.primary;
783
+ width = '50vw';
784
+ height = '';
785
+ dynamicContentTemplate;
786
+ resizable = false;
787
+ draggable = true;
788
+ visible;
789
+ closable = true;
790
+ modal = false;
791
+ body = 'Body content';
792
+ position = 'top';
793
+ btnLabel = 'Sem prebral/-a';
794
+ btnColor = ButtonColor.success;
795
+ btnIcon = 'pi pi-check';
796
+ hasIcon = true;
797
+ disabled = false;
798
+ hasLeftButton = false;
799
+ leftBtnLabel = 'Zapri';
800
+ leftBtnColor = ButtonColor.danger;
801
+ leftBtnIcon = 'pi pi-times';
802
+ leftHasIcon = true;
803
+ leftDisabled = false;
804
+ buttonClickEvent = new EventEmitter();
805
+ visibleChange = new EventEmitter();
806
+ leftButtonClickEvent = new EventEmitter();
807
+ scrollEvent = new EventEmitter();
808
+ modalClosed = new EventEmitter();
809
+ isFooterVisible = true;
810
+ dismissableMask = false;
811
+ headerClassMap = {
812
+ primary: 'primary',
813
+ secondary: 'secondary',
814
+ info: 'info',
815
+ warning: 'warning',
816
+ danger: 'danger',
817
+ };
818
+ /**
819
+ * Event emitted on clicking added button on bottom of modal
820
+ * @param event mouse click event
821
+ */
822
+ buttonCloseModal(event) {
823
+ event.stopPropagation();
824
+ this.buttonClickEvent.emit(event);
825
+ }
826
+ /**
827
+ * Event emitted on clicking added button on bottom of modal
828
+ * @param event mouse click event
829
+ */
830
+ leftButtonClick(event) {
831
+ event.stopPropagation();
832
+ this.leftButtonClickEvent.emit(event);
833
+ }
834
+ changeVisibility(newVisibility) {
835
+ this.visible = newVisibility;
836
+ this.visibleChange.emit(this.visible);
837
+ }
838
+ handleHide() {
839
+ this.changeVisibility(false);
840
+ }
841
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
842
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.6", type: ModalComponent, isStandalone: true, selector: "lib-modal", inputs: { header: "header", headerColor: "headerColor", width: "width", height: "height", dynamicContentTemplate: "dynamicContentTemplate", resizable: "resizable", draggable: "draggable", visible: "visible", closable: "closable", modal: "modal", body: "body", position: "position", btnLabel: "btnLabel", btnColor: "btnColor", btnIcon: "btnIcon", hasIcon: "hasIcon", disabled: "disabled", hasLeftButton: "hasLeftButton", leftBtnLabel: "leftBtnLabel", leftBtnColor: "leftBtnColor", leftBtnIcon: "leftBtnIcon", leftHasIcon: "leftHasIcon", leftDisabled: "leftDisabled", isFooterVisible: "isFooterVisible", dismissableMask: "dismissableMask" }, outputs: { buttonClickEvent: "buttonClickEvent", visibleChange: "visibleChange", leftButtonClickEvent: "leftButtonClickEvent", scrollEvent: "scrollEvent", modalClosed: "modalClosed" }, ngImport: i0, template: "<p-dialog [header]='header' [position]='position' [(visible)]='visible' [modal]='modal' [draggable]='draggable'\r\n [resizable]='resizable' [style]=\"{width: width, height: height, zindex: 10000}\"\r\n [dismissableMask]=\"dismissableMask\"\r\n [ngClass]=\"headerClassMap[headerColor]\" [closable]=\"closable\"\r\n [footerTemplate]=\"isFooterVisible ? footer : undefined\"\r\n (onHide)=\"handleHide()\" closeTabindex=\"0\">\r\n <ng-template pTemplate=\"content\">\r\n <ng-container [ngTemplateOutlet]=\"dynamicContentTemplate\"></ng-container>\r\n </ng-template>\r\n</p-dialog>\r\n\r\n<ng-template #footer>\r\n <div class=\"w-full flex\"\r\n [ngClass]=\"{'justify-content-end': !hasLeftButton, 'justify-content-between': hasLeftButton}\">\r\n <lib-button\r\n *ngIf=\"hasLeftButton\"\r\n [disabled]=\"leftDisabled\"\r\n (click)=\"leftButtonClick($event)\"\r\n [label]=\"leftBtnLabel\"\r\n [color]=\"leftBtnColor\"\r\n [icon]=\"leftBtnIcon\"\r\n [hasIcon]=\"leftHasIcon\"\r\n ></lib-button>\r\n <lib-button\r\n [disabled]=\"disabled\"\r\n (click)=\"buttonCloseModal($event)\"\r\n [label]=\"btnLabel\"\r\n [color]=\"btnColor\"\r\n [icon]=\"btnIcon\"\r\n [hasIcon]=\"hasIcon\"\r\n ></lib-button>\r\n </div>\r\n</ng-template>\r\n\r\n", styles: [":host ::ng-deep .info .p-dialog .p-dialog-header{background:#529bda!important;color:#fff!important}:host ::ng-deep .info .p-dialog .p-dialog-header .p-dialog-header-icon{color:#fff!important}:host ::ng-deep .secondary .p-dialog .p-dialog-header{background:#facd9c!important}:host ::ng-deep .warning .p-dialog .p-dialog-header{background:#fdca40!important}:host ::ng-deep .danger .p-dialog .p-dialog-header{background:#b2414d!important;color:#fff!important}:host ::ng-deep .danger .p-dialog .p-dialog-header .p-dialog-header-icon{color:#fff!important}@media screen and (max-width: 768px){:host ::ng-deep .primary .p-dialog{width:90vw!important;height:90vh!important}}:host ::ng-deep .primary .p-dialog .p-dialog-header{background:#3e7c94!important;color:#fff!important}:host ::ng-deep .primary .p-dialog .p-dialog-header .p-dialog-header-icon{color:#fff!important}@media screen and (max-width: 768px){:host ::ng-deep .primary .p-dialog .p-dialog-header .p-dialog-title{font-weight:500;font-size:1rem}}@media screen and (max-width: 768px){:host ::ng-deep .primary .p-dialog .p-dialog-content{padding:1rem}:host ::ng-deep .primary .p-dialog .p-dialog-content p{font-size:15px}}:host ::ng-deep .p-dialog .p-dialog-footer button{margin:0!important}\n"], dependencies: [{ kind: "component", type: Dialog, selector: "p-dialog", inputs: ["header", "draggable", "resizable", "positionLeft", "positionTop", "contentStyle", "contentStyleClass", "modal", "closeOnEscape", "dismissableMask", "rtl", "closable", "responsive", "appendTo", "breakpoints", "styleClass", "maskStyleClass", "maskStyle", "showHeader", "breakpoint", "blockScroll", "autoZIndex", "baseZIndex", "minX", "minY", "focusOnShow", "maximizable", "keepInViewport", "focusTrap", "transitionOptions", "closeIcon", "closeAriaLabel", "closeTabindex", "minimizeIcon", "maximizeIcon", "closeButtonProps", "maximizeButtonProps", "visible", "style", "position", "role", "content", "contentTemplate", "footerTemplate", "closeIconTemplate", "maximizeIconTemplate", "minimizeIconTemplate", "headlessTemplate"], outputs: ["onShow", "onHide", "visibleChange", "onResizeInit", "onResizeEnd", "onDragEnd", "onMaximize"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ButtonComponent, selector: "lib-button", inputs: ["hasIcon", "label", "color", "icon", "iconPos", "disabled", "isLoading", "styleClass", "size", "accessibilityText", "buttonType", "isAccessible", "isSelected", "ariaControlsId", "isExpanded", "link", "isTextareaClear"], outputs: ["clickEvent"] }] });
843
+ }
844
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ModalComponent, decorators: [{
845
+ type: Component,
846
+ args: [{ selector: 'lib-modal', imports: [
847
+ Dialog,
848
+ NgClass,
849
+ PrimeTemplate,
850
+ NgTemplateOutlet,
851
+ NgIf,
852
+ ButtonComponent,
853
+ ], template: "<p-dialog [header]='header' [position]='position' [(visible)]='visible' [modal]='modal' [draggable]='draggable'\r\n [resizable]='resizable' [style]=\"{width: width, height: height, zindex: 10000}\"\r\n [dismissableMask]=\"dismissableMask\"\r\n [ngClass]=\"headerClassMap[headerColor]\" [closable]=\"closable\"\r\n [footerTemplate]=\"isFooterVisible ? footer : undefined\"\r\n (onHide)=\"handleHide()\" closeTabindex=\"0\">\r\n <ng-template pTemplate=\"content\">\r\n <ng-container [ngTemplateOutlet]=\"dynamicContentTemplate\"></ng-container>\r\n </ng-template>\r\n</p-dialog>\r\n\r\n<ng-template #footer>\r\n <div class=\"w-full flex\"\r\n [ngClass]=\"{'justify-content-end': !hasLeftButton, 'justify-content-between': hasLeftButton}\">\r\n <lib-button\r\n *ngIf=\"hasLeftButton\"\r\n [disabled]=\"leftDisabled\"\r\n (click)=\"leftButtonClick($event)\"\r\n [label]=\"leftBtnLabel\"\r\n [color]=\"leftBtnColor\"\r\n [icon]=\"leftBtnIcon\"\r\n [hasIcon]=\"leftHasIcon\"\r\n ></lib-button>\r\n <lib-button\r\n [disabled]=\"disabled\"\r\n (click)=\"buttonCloseModal($event)\"\r\n [label]=\"btnLabel\"\r\n [color]=\"btnColor\"\r\n [icon]=\"btnIcon\"\r\n [hasIcon]=\"hasIcon\"\r\n ></lib-button>\r\n </div>\r\n</ng-template>\r\n\r\n", styles: [":host ::ng-deep .info .p-dialog .p-dialog-header{background:#529bda!important;color:#fff!important}:host ::ng-deep .info .p-dialog .p-dialog-header .p-dialog-header-icon{color:#fff!important}:host ::ng-deep .secondary .p-dialog .p-dialog-header{background:#facd9c!important}:host ::ng-deep .warning .p-dialog .p-dialog-header{background:#fdca40!important}:host ::ng-deep .danger .p-dialog .p-dialog-header{background:#b2414d!important;color:#fff!important}:host ::ng-deep .danger .p-dialog .p-dialog-header .p-dialog-header-icon{color:#fff!important}@media screen and (max-width: 768px){:host ::ng-deep .primary .p-dialog{width:90vw!important;height:90vh!important}}:host ::ng-deep .primary .p-dialog .p-dialog-header{background:#3e7c94!important;color:#fff!important}:host ::ng-deep .primary .p-dialog .p-dialog-header .p-dialog-header-icon{color:#fff!important}@media screen and (max-width: 768px){:host ::ng-deep .primary .p-dialog .p-dialog-header .p-dialog-title{font-weight:500;font-size:1rem}}@media screen and (max-width: 768px){:host ::ng-deep .primary .p-dialog .p-dialog-content{padding:1rem}:host ::ng-deep .primary .p-dialog .p-dialog-content p{font-size:15px}}:host ::ng-deep .p-dialog .p-dialog-footer button{margin:0!important}\n"] }]
854
+ }], propDecorators: { header: [{
855
+ type: Input
856
+ }], headerColor: [{
857
+ type: Input
858
+ }], width: [{
859
+ type: Input
860
+ }], height: [{
861
+ type: Input
862
+ }], dynamicContentTemplate: [{
863
+ type: Input
864
+ }], resizable: [{
865
+ type: Input
866
+ }], draggable: [{
867
+ type: Input
868
+ }], visible: [{
869
+ type: Input
870
+ }], closable: [{
871
+ type: Input
872
+ }], modal: [{
873
+ type: Input
874
+ }], body: [{
875
+ type: Input
876
+ }], position: [{
877
+ type: Input
878
+ }], btnLabel: [{
879
+ type: Input
880
+ }], btnColor: [{
881
+ type: Input
882
+ }], btnIcon: [{
883
+ type: Input
884
+ }], hasIcon: [{
885
+ type: Input
886
+ }], disabled: [{
887
+ type: Input
888
+ }], hasLeftButton: [{
889
+ type: Input
890
+ }], leftBtnLabel: [{
891
+ type: Input
892
+ }], leftBtnColor: [{
893
+ type: Input
894
+ }], leftBtnIcon: [{
895
+ type: Input
896
+ }], leftHasIcon: [{
897
+ type: Input
898
+ }], leftDisabled: [{
899
+ type: Input
900
+ }], buttonClickEvent: [{
901
+ type: Output
902
+ }], visibleChange: [{
903
+ type: Output
904
+ }], leftButtonClickEvent: [{
905
+ type: Output
906
+ }], scrollEvent: [{
907
+ type: Output
908
+ }], modalClosed: [{
909
+ type: Output
910
+ }], isFooterVisible: [{
911
+ type: Input
912
+ }], dismissableMask: [{
913
+ type: Input
914
+ }] } });
915
+
916
+ class DropdownComponent {
917
+ translateService;
918
+ TooltipHoverEventEnum = TooltipHoverEventEnum;
919
+ _isTooltipVisible;
920
+ dynamicItemsLabel;
921
+ name;
922
+ isMultiselect = false;
923
+ selectedItemLabel = 'Izbrano število:';
924
+ group;
925
+ controlName;
926
+ label = '';
927
+ optionList = [];
928
+ optionLabel = 'name';
929
+ optionalValue = 'value';
930
+ placeholder = '';
931
+ accessibilityText = '';
932
+ filter = true;
933
+ filterBy = 'name';
934
+ showClear = true;
935
+ isRequired = true;
936
+ tooltipPosition = TooltipPosition.right;
937
+ tooltipText = '';
938
+ formStatus;
939
+ nestedGroup = false;
940
+ isLoading = false;
941
+ appendTo;
942
+ isLabelVisible = true;
943
+ emptyMessage;
944
+ virtualScroll = false;
945
+ ariaFilterLabel;
946
+ optionValue;
947
+ getValueEvent = new EventEmitter();
948
+ constructor(translateService) {
949
+ this.translateService = translateService;
950
+ }
951
+ getSelectedValue(event) {
952
+ this.getValueEvent.emit(event);
953
+ }
954
+ ngOnInit() {
955
+ this._isTooltipVisible = !!this.tooltipText;
956
+ this.dynamicItemsLabel = this.selectedItemLabel + ' {0}';
957
+ }
958
+ onClear() {
959
+ this.group.get(this.controlName)?.setValue(null);
960
+ }
961
+ get emptyDropdownMessage() {
962
+ if (this.emptyMessage) {
963
+ return this.emptyMessage;
964
+ }
965
+ else {
966
+ return this.translateService.instant('components.dropdown.emptyList');
967
+ }
968
+ }
969
+ get emptyFilterDropdownMessage() {
970
+ return this.translateService.instant('components.dropdown.emptyFilterList');
971
+ }
972
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: DropdownComponent, deps: [{ token: i2.TranslateService }], target: i0.ɵɵFactoryTarget.Component });
973
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.6", type: DropdownComponent, isStandalone: true, selector: "lib-dropdown[group][controlName][name]", inputs: { name: "name", isMultiselect: "isMultiselect", selectedItemLabel: "selectedItemLabel", group: "group", controlName: "controlName", label: "label", optionList: "optionList", optionLabel: "optionLabel", optionalValue: "optionalValue", placeholder: "placeholder", accessibilityText: "accessibilityText", filter: "filter", filterBy: "filterBy", showClear: "showClear", isRequired: "isRequired", tooltipPosition: "tooltipPosition", tooltipText: "tooltipText", formStatus: "formStatus", nestedGroup: "nestedGroup", isLoading: "isLoading", appendTo: "appendTo", isLabelVisible: "isLabelVisible", emptyMessage: "emptyMessage", virtualScroll: "virtualScroll", ariaFilterLabel: "ariaFilterLabel", optionValue: "optionValue" }, outputs: { getValueEvent: "getValueEvent" }, ngImport: i0, template: "<div class='flex flex-column gap-1' [formGroup]=\"group\">\r\n <div class=\"flex\" *ngIf=\"isLabelVisible\">\r\n <label [for]=\"name\" class=\"mr-2\">\r\n {{ label }}<span class=\"required\" aria-label=\"Is required filed\" *ngIf=\"isRequired\">*</span>\r\n </label>\r\n <lib-tooltip\r\n *ngIf=\"_isTooltipVisible\"\r\n [position]=\"tooltipPosition\"\r\n [text]=\"tooltipText!\"\r\n ></lib-tooltip>\r\n </div>\r\n <p-select *ngIf=\"!isMultiselect\"\r\n [inputId]=\"name\"\r\n [appendTo]=\"appendTo\"\r\n (onChange)='getSelectedValue($event)'\r\n [options]=\"optionList\"\r\n [optionLabel]=\"!nestedGroup ? optionLabel : undefined\"\r\n [formControlName]=\"controlName\"\r\n [placeholder]='placeholder'\r\n [virtualScroll]=\"virtualScroll\"\r\n [virtualScrollItemSize]=\"38\"\r\n [group]=\"nestedGroup\"\r\n [filter]='filter'\r\n [filterBy]='filterBy'\r\n [showClear]=\"group.get(controlName)?.value && showClear\"\r\n [ngClass]=\"{ 'ng-dirty': (group.get(controlName)!.errors && (group.get(controlName)!.touched) || formStatus!.isSubmitTriggered || formStatus!.isNestedFormSubmit!) }\"\r\n [attr.aria-label]=\"accessibilityText\"\r\n (onClear)=\"onClear()\"\r\n [optionValue]=\"optionValue\"\r\n [emptyMessage]=\"emptyDropdownMessage\"\r\n [emptyFilterMessage]=\"emptyFilterDropdownMessage\"\r\n [dropdownIcon]=\"isLoading ? 'pi pi-spinner pi-spin' : 'pi pi-chevron-down'\"\r\n [ariaFilterLabel]=\"ariaFilterLabel!\"\r\n [attr.aria-describedby]=\"name + 'Error'\"\r\n [attr.aria-invalid]=\"(group.get(controlName)!.errors && (group.get(controlName)!.touched || formStatus!.isSubmitTriggered))\"\r\n [attr.aria-required]=\"isRequired\"\r\n >\r\n <ng-template *ngIf=\"nestedGroup\" let-nestedGroup pTemplate=\"nestedGroup\">\r\n <div class=\"flex align-items-center\">\r\n <span>{{ nestedGroup.label }}</span>\r\n </div>\r\n </ng-template>\r\n </p-select>\r\n <p-multiselect\r\n *ngIf=\"isMultiselect\"\r\n [inputId]=\"name\"\r\n [appendTo]=\"appendTo\"\r\n (onChange)='getSelectedValue($event)'\r\n [options]=\"optionList\"\r\n [optionLabel]=\"!nestedGroup ? optionLabel : ''\"\r\n [formControlName]=\"controlName\"\r\n [optionValue]=\"optionValue\"\r\n [virtualScroll]=\"virtualScroll\"\r\n [virtualScrollItemSize]=\"38\"\r\n [group]=\"nestedGroup\"\r\n [filter]='filter'\r\n [filterBy]='filterBy'\r\n [selectedItemsLabel]=\"dynamicItemsLabel\"\r\n [placeholder]=\"placeholder\"\r\n [showClear]=\"group.get(controlName)!.value && showClear\"\r\n [ngClass]=\"{ 'ng-dirty': (group.get(controlName)!.errors && (group.get(controlName)!.touched) || formStatus!.isSubmitTriggered || formStatus!.isNestedFormSubmit!) }\"\r\n [attr.aria-label]=\"accessibilityText\"\r\n (onClear)=\"onClear()\"\r\n [emptyMessage]=\"emptyDropdownMessage\"\r\n [emptyFilterMessage]=\"emptyFilterDropdownMessage\"\r\n [dropdownIcon]=\"isLoading ? 'pi pi-spinner pi-spin' : 'pi pi-chevron-down'\"\r\n [attr.aria-describedby]=\"name + 'Error'\"\r\n [attr.aria-invalid]=\"(group.get(controlName)!.errors && (group.get(controlName)!.touched || formStatus!.isSubmitTriggered))\"\r\n [attr.aria-required]=\"isRequired\"\r\n >\r\n <ng-template *ngIf=\"nestedGroup\" let-nestedGroup pTemplate=\"nestedGroup\">\r\n <div class=\"flex align-items-center\">\r\n <span>{{ nestedGroup.label }}</span>\r\n </div>\r\n </ng-template>\r\n </p-multiselect>\r\n <lib-error\r\n *ngIf=\"(group.get(controlName)!.errors && (group.get(controlName)!.touched) || formStatus!.isSubmitTriggered || formStatus!.isNestedFormSubmit!)\"\r\n [hasError]=\"group.get(controlName)!.errors\"\r\n [isDirty]=\"group.get(controlName)!.pristine\"\r\n [isTouched]=\"group.get(controlName)!.touched\"\r\n [isSubmitTriggered]=\"formStatus!.isSubmitTriggered!\"\r\n [isNestedFormSubmit]=\"formStatus!.isNestedFormSubmit!\"\r\n [errorId]=\"name+'Error'\"\r\n ></lib-error>\r\n</div>\r\n", styles: [":host ::ng-deep .p-select-filter{border:1.75px solid #3E7C94!important}:host ::ng-deep .p-select-filter::placeholder{font-style:italic!important;color:#848484!important}:host ::ng-deep .p-select-filter:hover{border:1.75px solid #ffa142!important}:host ::ng-deep .p-select-filter:focus{box-shadow:0 0 2px 3px #ffa142!important}:host ::ng-deep .p-select{width:100%;height:39px;border:1.75px solid #3E7C94!important}:host ::ng-deep .p-select::placeholder{font-style:italic!important;color:#848484!important}:host ::ng-deep .p-select:hover{border:1.75px solid #ffa142!important}:host ::ng-deep .p-select:focus{box-shadow:0 0 2px 3px #ffa142!important}:host ::ng-deep .p-select .p-select-item.p-ripple{white-space:normal}:host ::ng-deep .p-select:not(.p-disabled).p-focus{border:1.75px solid #1B495A;box-shadow:0 0 2px 3px #ffa142}:host ::ng-deep .p-select:not(.p-disabled).p-focus span{outline:none}:host ::ng-deep .p-select .p-select-header{background-color:#3e7c94}:host ::ng-deep .p-select .p-select-label.p-placeholder{font-style:italic;color:#848484}:host ::ng-deep .p-select .p-select-panel .p-select-items .p-select-item.p-highlight{background:#3e7c94}:host ::ng-deep .p-select .p-select-panel .p-select-items .p-select-item.p-focus{background:#d3d3d3;color:#000}:host ::ng-deep .p-select .p-select-panel .p-select-items .p-select-item-group:hover{cursor:default}:host ::ng-deep .p-select .p-select-panel .p-select-header .p-select-filter-icon{top:.75rem}:host ::ng-deep .p-multiselect{width:100%;border:1.75px solid #3E7C94!important}:host ::ng-deep .p-multiselect::placeholder{font-style:italic!important;color:#848484!important}:host ::ng-deep .p-multiselect:hover{border:1.75px solid #ffa142!important}:host ::ng-deep .p-multiselect:focus{box-shadow:0 0 2px 3px #ffa142!important}:host ::ng-deep .p-multiselect:not(.p-disabled).p-focus{border:1.75px solid #1B495A;box-shadow:0 0 2px 3px #ffa142}:host ::ng-deep .p-multiselect .p-multiselect-item{white-space:normal}:host ::ng-deep .p-multiselect .containerClass .p-multiselect .p-multiselect-label-container,:host ::ng-deep .p-multiselect .containerClass .p-multiselect .p-multiselect-label{width:100%;box-sizing:border-box}:host ::ng-deep .p-multiselect .p-multiselect-label.p-placeholder{font-style:italic;color:#848484}:host ::ng-deep .p-multiselect .p-multiselect-panel .p-multiselect-items .p-multiselect-item.p-highlight{background:#3e7c94}:host ::ng-deep .p-multiselect .p-multiselect-panel .p-multiselect-items .p-multiselect-item-group:hover{cursor:default}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: TooltipComponent, selector: " lib-tooltip", inputs: ["icon", "htmlParser", "text", "position", "tooltipEvent", "autoHide", "htmlParse"] }, { kind: "ngmodule", type: SelectModule }, { kind: "component", type: i3.Select, selector: "p-select", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "size", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "fluid", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "directive", type: i1$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: MultiSelectModule }, { kind: "component", type: i5.MultiSelect, selector: "p-multiSelect, p-multiselect, p-multi-select", inputs: ["id", "ariaLabel", "style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "fluid", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "variant", "appendTo", "dataKey", "name", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "chipIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "size", "showClear", "autofocus", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "defaultLabel", "placeholder", "options", "filterValue", "itemSize", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus", "highlightOnSelect"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "component", type: ErrorComponent, selector: "lib-error", inputs: ["hasError", "isTouched", "isSubmitTriggered", "isNestedFormSubmit", "isDirty", "isRequired", "hasGroupError", "errorId"] }] });
974
+ }
975
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: DropdownComponent, decorators: [{
976
+ type: Component,
977
+ args: [{ selector: 'lib-dropdown[group][controlName][name]', imports: [
978
+ FormsModule,
979
+ ReactiveFormsModule,
980
+ NgIf,
981
+ TooltipComponent,
982
+ SelectModule,
983
+ NgClass,
984
+ PrimeTemplate,
985
+ MultiSelectModule,
986
+ ErrorComponent,
987
+ ], template: "<div class='flex flex-column gap-1' [formGroup]=\"group\">\r\n <div class=\"flex\" *ngIf=\"isLabelVisible\">\r\n <label [for]=\"name\" class=\"mr-2\">\r\n {{ label }}<span class=\"required\" aria-label=\"Is required filed\" *ngIf=\"isRequired\">*</span>\r\n </label>\r\n <lib-tooltip\r\n *ngIf=\"_isTooltipVisible\"\r\n [position]=\"tooltipPosition\"\r\n [text]=\"tooltipText!\"\r\n ></lib-tooltip>\r\n </div>\r\n <p-select *ngIf=\"!isMultiselect\"\r\n [inputId]=\"name\"\r\n [appendTo]=\"appendTo\"\r\n (onChange)='getSelectedValue($event)'\r\n [options]=\"optionList\"\r\n [optionLabel]=\"!nestedGroup ? optionLabel : undefined\"\r\n [formControlName]=\"controlName\"\r\n [placeholder]='placeholder'\r\n [virtualScroll]=\"virtualScroll\"\r\n [virtualScrollItemSize]=\"38\"\r\n [group]=\"nestedGroup\"\r\n [filter]='filter'\r\n [filterBy]='filterBy'\r\n [showClear]=\"group.get(controlName)?.value && showClear\"\r\n [ngClass]=\"{ 'ng-dirty': (group.get(controlName)!.errors && (group.get(controlName)!.touched) || formStatus!.isSubmitTriggered || formStatus!.isNestedFormSubmit!) }\"\r\n [attr.aria-label]=\"accessibilityText\"\r\n (onClear)=\"onClear()\"\r\n [optionValue]=\"optionValue\"\r\n [emptyMessage]=\"emptyDropdownMessage\"\r\n [emptyFilterMessage]=\"emptyFilterDropdownMessage\"\r\n [dropdownIcon]=\"isLoading ? 'pi pi-spinner pi-spin' : 'pi pi-chevron-down'\"\r\n [ariaFilterLabel]=\"ariaFilterLabel!\"\r\n [attr.aria-describedby]=\"name + 'Error'\"\r\n [attr.aria-invalid]=\"(group.get(controlName)!.errors && (group.get(controlName)!.touched || formStatus!.isSubmitTriggered))\"\r\n [attr.aria-required]=\"isRequired\"\r\n >\r\n <ng-template *ngIf=\"nestedGroup\" let-nestedGroup pTemplate=\"nestedGroup\">\r\n <div class=\"flex align-items-center\">\r\n <span>{{ nestedGroup.label }}</span>\r\n </div>\r\n </ng-template>\r\n </p-select>\r\n <p-multiselect\r\n *ngIf=\"isMultiselect\"\r\n [inputId]=\"name\"\r\n [appendTo]=\"appendTo\"\r\n (onChange)='getSelectedValue($event)'\r\n [options]=\"optionList\"\r\n [optionLabel]=\"!nestedGroup ? optionLabel : ''\"\r\n [formControlName]=\"controlName\"\r\n [optionValue]=\"optionValue\"\r\n [virtualScroll]=\"virtualScroll\"\r\n [virtualScrollItemSize]=\"38\"\r\n [group]=\"nestedGroup\"\r\n [filter]='filter'\r\n [filterBy]='filterBy'\r\n [selectedItemsLabel]=\"dynamicItemsLabel\"\r\n [placeholder]=\"placeholder\"\r\n [showClear]=\"group.get(controlName)!.value && showClear\"\r\n [ngClass]=\"{ 'ng-dirty': (group.get(controlName)!.errors && (group.get(controlName)!.touched) || formStatus!.isSubmitTriggered || formStatus!.isNestedFormSubmit!) }\"\r\n [attr.aria-label]=\"accessibilityText\"\r\n (onClear)=\"onClear()\"\r\n [emptyMessage]=\"emptyDropdownMessage\"\r\n [emptyFilterMessage]=\"emptyFilterDropdownMessage\"\r\n [dropdownIcon]=\"isLoading ? 'pi pi-spinner pi-spin' : 'pi pi-chevron-down'\"\r\n [attr.aria-describedby]=\"name + 'Error'\"\r\n [attr.aria-invalid]=\"(group.get(controlName)!.errors && (group.get(controlName)!.touched || formStatus!.isSubmitTriggered))\"\r\n [attr.aria-required]=\"isRequired\"\r\n >\r\n <ng-template *ngIf=\"nestedGroup\" let-nestedGroup pTemplate=\"nestedGroup\">\r\n <div class=\"flex align-items-center\">\r\n <span>{{ nestedGroup.label }}</span>\r\n </div>\r\n </ng-template>\r\n </p-multiselect>\r\n <lib-error\r\n *ngIf=\"(group.get(controlName)!.errors && (group.get(controlName)!.touched) || formStatus!.isSubmitTriggered || formStatus!.isNestedFormSubmit!)\"\r\n [hasError]=\"group.get(controlName)!.errors\"\r\n [isDirty]=\"group.get(controlName)!.pristine\"\r\n [isTouched]=\"group.get(controlName)!.touched\"\r\n [isSubmitTriggered]=\"formStatus!.isSubmitTriggered!\"\r\n [isNestedFormSubmit]=\"formStatus!.isNestedFormSubmit!\"\r\n [errorId]=\"name+'Error'\"\r\n ></lib-error>\r\n</div>\r\n", styles: [":host ::ng-deep .p-select-filter{border:1.75px solid #3E7C94!important}:host ::ng-deep .p-select-filter::placeholder{font-style:italic!important;color:#848484!important}:host ::ng-deep .p-select-filter:hover{border:1.75px solid #ffa142!important}:host ::ng-deep .p-select-filter:focus{box-shadow:0 0 2px 3px #ffa142!important}:host ::ng-deep .p-select{width:100%;height:39px;border:1.75px solid #3E7C94!important}:host ::ng-deep .p-select::placeholder{font-style:italic!important;color:#848484!important}:host ::ng-deep .p-select:hover{border:1.75px solid #ffa142!important}:host ::ng-deep .p-select:focus{box-shadow:0 0 2px 3px #ffa142!important}:host ::ng-deep .p-select .p-select-item.p-ripple{white-space:normal}:host ::ng-deep .p-select:not(.p-disabled).p-focus{border:1.75px solid #1B495A;box-shadow:0 0 2px 3px #ffa142}:host ::ng-deep .p-select:not(.p-disabled).p-focus span{outline:none}:host ::ng-deep .p-select .p-select-header{background-color:#3e7c94}:host ::ng-deep .p-select .p-select-label.p-placeholder{font-style:italic;color:#848484}:host ::ng-deep .p-select .p-select-panel .p-select-items .p-select-item.p-highlight{background:#3e7c94}:host ::ng-deep .p-select .p-select-panel .p-select-items .p-select-item.p-focus{background:#d3d3d3;color:#000}:host ::ng-deep .p-select .p-select-panel .p-select-items .p-select-item-group:hover{cursor:default}:host ::ng-deep .p-select .p-select-panel .p-select-header .p-select-filter-icon{top:.75rem}:host ::ng-deep .p-multiselect{width:100%;border:1.75px solid #3E7C94!important}:host ::ng-deep .p-multiselect::placeholder{font-style:italic!important;color:#848484!important}:host ::ng-deep .p-multiselect:hover{border:1.75px solid #ffa142!important}:host ::ng-deep .p-multiselect:focus{box-shadow:0 0 2px 3px #ffa142!important}:host ::ng-deep .p-multiselect:not(.p-disabled).p-focus{border:1.75px solid #1B495A;box-shadow:0 0 2px 3px #ffa142}:host ::ng-deep .p-multiselect .p-multiselect-item{white-space:normal}:host ::ng-deep .p-multiselect .containerClass .p-multiselect .p-multiselect-label-container,:host ::ng-deep .p-multiselect .containerClass .p-multiselect .p-multiselect-label{width:100%;box-sizing:border-box}:host ::ng-deep .p-multiselect .p-multiselect-label.p-placeholder{font-style:italic;color:#848484}:host ::ng-deep .p-multiselect .p-multiselect-panel .p-multiselect-items .p-multiselect-item.p-highlight{background:#3e7c94}:host ::ng-deep .p-multiselect .p-multiselect-panel .p-multiselect-items .p-multiselect-item-group:hover{cursor:default}\n"] }]
988
+ }], ctorParameters: () => [{ type: i2.TranslateService }], propDecorators: { name: [{
989
+ type: Input
990
+ }], isMultiselect: [{
991
+ type: Input
992
+ }], selectedItemLabel: [{
993
+ type: Input
994
+ }], group: [{
995
+ type: Input
996
+ }], controlName: [{
997
+ type: Input
998
+ }], label: [{
999
+ type: Input
1000
+ }], optionList: [{
1001
+ type: Input
1002
+ }], optionLabel: [{
1003
+ type: Input
1004
+ }], optionalValue: [{
1005
+ type: Input
1006
+ }], placeholder: [{
1007
+ type: Input
1008
+ }], accessibilityText: [{
1009
+ type: Input
1010
+ }], filter: [{
1011
+ type: Input
1012
+ }], filterBy: [{
1013
+ type: Input
1014
+ }], showClear: [{
1015
+ type: Input
1016
+ }], isRequired: [{
1017
+ type: Input
1018
+ }], tooltipPosition: [{
1019
+ type: Input
1020
+ }], tooltipText: [{
1021
+ type: Input
1022
+ }], formStatus: [{
1023
+ type: Input
1024
+ }], nestedGroup: [{
1025
+ type: Input
1026
+ }], isLoading: [{
1027
+ type: Input
1028
+ }], appendTo: [{
1029
+ type: Input
1030
+ }], isLabelVisible: [{
1031
+ type: Input
1032
+ }], emptyMessage: [{
1033
+ type: Input
1034
+ }], virtualScroll: [{
1035
+ type: Input
1036
+ }], ariaFilterLabel: [{
1037
+ type: Input
1038
+ }], optionValue: [{
1039
+ type: Input
1040
+ }], getValueEvent: [{
1041
+ type: Output
1042
+ }] } });
1043
+
1044
+ class BreadcrumbsComponent {
1045
+ itemList = [];
1046
+ homeItem = {};
1047
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: BreadcrumbsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1048
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.6", type: BreadcrumbsComponent, isStandalone: true, selector: "lib-breadcrumbs[itemList][homeItem]", inputs: { itemList: "itemList", homeItem: "homeItem" }, ngImport: i0, template: "<p-breadcrumb\r\n class=\"max-w-full\"\r\n [model]=\"itemList\"\r\n [home]=\"homeItem\"\r\n>\r\n <ng-template pTemplate=\"separator\">&nbsp;>&nbsp;</ng-template>\r\n</p-breadcrumb>\r\n<!--<lib-divider></lib-divider>-->\r\n", styles: [":host ::ng-deep .p-breadcrumb{background:transparent;padding:0}:host ::ng-deep .p-breadcrumb ul li .p-menuitem-link .p-menuitem-text{color:#1b495a}:host ::ng-deep .p-breadcrumb .p-element:hover{text-decoration:underline;color:#3e7c94}:host ::ng-deep .p-breadcrumb .p-element:last-child{pointer-events:none;color:#000}:host ::ng-deep .p-breadcrumb .p-element:last-child:hover{text-decoration:none}:host ::ng-deep .p-breadcrumb .p-breadcrumb-chevron:before{content:\">\";color:#1b495a}:host ::ng-deep .p-breadcrumb .p-icon-wrapper{display:none}:host ::ng-deep .p-breadcrumb .p-menuitem-text{color:#1b495a}\n"], dependencies: [{ kind: "component", type: Breadcrumb, selector: "p-breadcrumb", inputs: ["model", "style", "styleClass", "home", "homeAriaLabel"], outputs: ["onItemClick"] }, { kind: "directive", type: PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }] });
1049
+ }
1050
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: BreadcrumbsComponent, decorators: [{
1051
+ type: Component,
1052
+ args: [{ selector: 'lib-breadcrumbs[itemList][homeItem]', imports: [Breadcrumb, PrimeTemplate], template: "<p-breadcrumb\r\n class=\"max-w-full\"\r\n [model]=\"itemList\"\r\n [home]=\"homeItem\"\r\n>\r\n <ng-template pTemplate=\"separator\">&nbsp;>&nbsp;</ng-template>\r\n</p-breadcrumb>\r\n<!--<lib-divider></lib-divider>-->\r\n", styles: [":host ::ng-deep .p-breadcrumb{background:transparent;padding:0}:host ::ng-deep .p-breadcrumb ul li .p-menuitem-link .p-menuitem-text{color:#1b495a}:host ::ng-deep .p-breadcrumb .p-element:hover{text-decoration:underline;color:#3e7c94}:host ::ng-deep .p-breadcrumb .p-element:last-child{pointer-events:none;color:#000}:host ::ng-deep .p-breadcrumb .p-element:last-child:hover{text-decoration:none}:host ::ng-deep .p-breadcrumb .p-breadcrumb-chevron:before{content:\">\";color:#1b495a}:host ::ng-deep .p-breadcrumb .p-icon-wrapper{display:none}:host ::ng-deep .p-breadcrumb .p-menuitem-text{color:#1b495a}\n"] }]
1053
+ }], propDecorators: { itemList: [{
1054
+ type: Input
1055
+ }], homeItem: [{
1056
+ type: Input
1057
+ }] } });
1058
+
1059
+ class DividerComponent {
1060
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: DividerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1061
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.6", type: DividerComponent, isStandalone: true, selector: "lib-divider", ngImport: i0, template: "<p-divider aria-hidden=\"true\"></p-divider>\r\n", styles: [":host ::ng-deep .p-divider-horizontal:before{border-top:1.75px #3E7C94}\n"], dependencies: [{ kind: "component", type: Divider, selector: "p-divider", inputs: ["style", "styleClass", "layout", "type", "align"] }] });
1062
+ }
1063
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: DividerComponent, decorators: [{
1064
+ type: Component,
1065
+ args: [{ selector: 'lib-divider', imports: [Divider], template: "<p-divider aria-hidden=\"true\"></p-divider>\r\n", styles: [":host ::ng-deep .p-divider-horizontal:before{border-top:1.75px #3E7C94}\n"] }]
1066
+ }] });
1067
+
1068
+ class NavbarComponent {
1069
+ localStorageService;
1070
+ imageWidth = '189';
1071
+ imageHeight = '50';
1072
+ logoAltText = 'logo';
1073
+ multiLanguageEnabled = false;
1074
+ isLogoClick = new EventEmitter();
1075
+ isAccessibilityClicked = new EventEmitter();
1076
+ notificationList = [];
1077
+ // za urgent notifications
1078
+ currentLanguage = 'sl';
1079
+ currentNotification = '';
1080
+ currentIndex = 0;
1081
+ animationClass = 'fade-in';
1082
+ notificationChangeInterval = 5000;
1083
+ constructor(localStorageService) {
1084
+ this.localStorageService = localStorageService;
1085
+ }
1086
+ ngOnInit() {
1087
+ this.currentLanguage = this.localStorageService.getItem('lang') || 'sl'; // Simuliraj izbran jezik
1088
+ if (this.notificationList?.length > 0) {
1089
+ this.showUrgentNotifications();
1090
+ }
1091
+ }
1092
+ /**
1093
+ * prikaz nujnih obvestil
1094
+ */
1095
+ showUrgentNotifications() {
1096
+ // prikaže obvestila
1097
+ this.displayNotification();
1098
+ // Menjaj obvestila vsakih N sekund, če jih je več
1099
+ if (this.notificationList.length > 1) {
1100
+ interval(this.notificationChangeInterval).subscribe(() => {
1101
+ this.changeNotification();
1102
+ });
1103
+ }
1104
+ }
1105
+ displayNotification() {
1106
+ const notification = this.notificationList[this.currentIndex];
1107
+ this.currentNotification = notification.notificationText;
1108
+ }
1109
+ changeNotification() {
1110
+ // Najprej uporabi fade-out
1111
+ this.animationClass = 'fade-out';
1112
+ // Počakaj, da se fade-out konča, nato posodobi obvestilo in uporabi fade-in
1113
+ setTimeout(() => {
1114
+ this.currentIndex = (this.currentIndex + 1) % this.notificationList.length;
1115
+ this.displayNotification();
1116
+ this.animationClass = 'fade-in';
1117
+ }, 1000); // 1 sekunda za fade-out
1118
+ }
1119
+ clickLogo(event) {
1120
+ event.preventDefault();
1121
+ this.isLogoClick.emit(event);
1122
+ }
1123
+ accessibilityClick(event) {
1124
+ event.preventDefault();
1125
+ this.isAccessibilityClicked.emit(event);
1126
+ }
1127
+ /**
1128
+ * Mare, 2024-09-13; safe version, da ne faila Checkmarx XSS check
1129
+ */
1130
+ changeLanguage(event, language) {
1131
+ event.preventDefault();
1132
+ this.localStorageService.setItem('lang', language);
1133
+ const currentUrl = new URL(window.location.href);
1134
+ const urlParts = currentUrl.pathname.split('/');
1135
+ urlParts[2] = language; // jezik je vedno na 3. mestu
1136
+ // redirect na novi URL
1137
+ window.location.href = `${currentUrl.origin}${urlParts.join('/')}${currentUrl.search}${currentUrl.hash}`;
1138
+ }
1139
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: NavbarComponent, deps: [{ token: LocalStorageService }], target: i0.ɵɵFactoryTarget.Component });
1140
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.6", type: NavbarComponent, isStandalone: true, selector: "lib-navbar", inputs: { imageWidth: "imageWidth", imageHeight: "imageHeight", logoAltText: "logoAltText", multiLanguageEnabled: "multiLanguageEnabled", notificationList: "notificationList" }, outputs: { isLogoClick: "isLogoClick", isAccessibilityClicked: "isAccessibilityClicked" }, ngImport: i0, template: "<nav class=\"menu\">\r\n <div\r\n class=\"container flex sm:align-items-start sm:justify-content-start md:align-items-center md:justify-content-between flex-column md:flex-row\">\r\n <a href=\"#\" (click)=\"clickLogo($event)\" class=\"navbar-logo\">\r\n <svg id=\"a\" xmlns=\"http://www.w3.org/2000/svg\" role=\"img\" width=\"189.01\" height=\"50\" viewBox=\"0 0 189.01 50\">\r\n <title>Navigacija na doma\u010Do stran, portala eSamonaro\u010Danje republike Slovenije.</title>\r\n <defs>\r\n <style>.b {\r\n fill: #fff;\r\n }</style>\r\n </defs>\r\n <path class=\"b\"\r\n d=\"M38.39,27.03c-.67,10.72-7.89,19.84-18.48,22.9C9.7,47.04,2.1,38.1,1.4,27.03L0,4.8C6.49,1.65,12.53,0,19.91,0,26.59,0,33.2,1.46,39.79,4.8m-2.83,.32l-1.37,21.72c-.57,9.06-6.46,17.11-15.68,20.16-8.68-2.8-15.07-10.59-15.68-20.16L2.83,5.12c-.35,.16-.89,.38-1.27,.57l1.34,21.25c.64,9.99,7.47,18.64,17.01,21.44,9.35-2.8,16.38-11.26,17.02-21.44l1.34-21.25c-.41-.19-.83-.38-1.3-.57M15.84,25.48l-2.83-3.78-6.71,9c.47,2.32,1.62,3.43,4.45,3.43,1.94,0,2.26-1.21,4.55-1.21s2.54,1.21,4.61,1.21,2.2-1.21,4.58-1.21,2.61,1.21,4.58,1.21c2.8,0,4.1-1.34,4.45-3.46l-6.74-8.97-2.83,3.78-4.04-8.08-4.07,8.08Zm13.23,11.8c.64,0,1.21-.13,1.72-.35,.38-.61,.64-1.08,.96-1.72-.8,.41-1.66,.73-2.67,.73-2.23,0-2.35-1.21-4.58-1.21s-2.42,1.21-4.61,1.21-2.29-1.21-4.58-1.21c-2.16,0-2.42,1.21-4.58,1.21-1.21,0-1.97-.45-2.7-.8,.32,.64,.67,1.21,1.05,1.81,.54,.19,1.12,.29,1.69,.29,2.35,0,2.32-1.21,4.55-1.21s2.42,1.24,4.58,1.24,2.48-1.24,4.61-1.24,2.39,1.24,4.58,1.24m-4.58,.57c-2.1,0-2.16,1.24-4.58,1.24-2.26,0-2.67-1.24-4.61-1.24-2.04,0-2.07,1.17-4.68,1.21,2.42,2.83,5.57,5.09,9.29,6.39,3.56-1.24,6.71-3.37,9.26-6.39-2.55,0-2.61-1.21-4.68-1.21M14.37,4.64l-1.72-.16,1.02,1.37-1.05,1.4,1.75-.19,.7,1.59,.7-1.59,1.75,.19-1.05-1.4,1.02-1.4-1.72,.19-.7-1.59-.7,1.59Zm4.83,6.42l-1.72-.16,1.02,1.37-1.05,1.4,1.75-.19,.7,1.59,.7-1.59,1.75,.19-1.05-1.4,1.02-1.4-1.72,.19-.7-1.59-.7,1.59Zm4.8-6.42l-1.72-.16,1.02,1.37-1.05,1.4,1.75-.19,.7,1.59,.7-1.59,1.75,.19-1.05-1.4,1.02-1.4-1.72,.19-.7-1.59-.7,1.59Z\"/>\r\n <g>\r\n <path class=\"b\"\r\n d=\"M81.43,19.46h-1.61V4.27h4.86c.86,0,1.61,.07,2.25,.21,.64,.14,1.16,.38,1.58,.7,.42,.33,.72,.76,.92,1.29s.3,1.2,.3,1.97c0,1.29-.26,2.27-.78,2.94-.52,.67-1.34,1.11-2.44,1.3l3.54,6.77h-1.85l-3.39-6.6h-3.37v6.6Zm0-7.96h3.12c.58,0,1.09-.04,1.53-.11,.44-.07,.81-.21,1.1-.42s.52-.51,.68-.91c.16-.39,.23-.9,.23-1.52s-.07-1.1-.22-1.48c-.15-.38-.37-.67-.66-.88s-.66-.36-1.1-.44c-.45-.08-.97-.12-1.56-.12h-3.12v5.88Z\"/>\r\n <path class=\"b\" d=\"M93.05,19.46V4.27h9.1v1.36h-7.49v5.49h6.49v1.36h-6.49v5.62h7.49v1.36h-9.1Z\"/>\r\n <path class=\"b\"\r\n d=\"M106.99,19.46h-1.61V4.27h4.75c.86,0,1.61,.07,2.25,.22,.64,.15,1.16,.39,1.58,.73s.72,.79,.92,1.34c.2,.55,.3,1.24,.3,2.06,0,1.65-.41,2.83-1.22,3.53-.81,.7-2.09,1.05-3.83,1.05h-3.14v6.26Zm0-7.62h3.01c.58,0,1.09-.04,1.53-.12s.81-.23,1.1-.45c.3-.22,.52-.53,.68-.94,.16-.41,.23-.94,.23-1.61s-.08-1.16-.22-1.55-.37-.71-.66-.94c-.29-.23-.66-.38-1.1-.46-.45-.08-.96-.12-1.56-.12h-3.01v6.17Z\"/>\r\n <path class=\"b\"\r\n d=\"M127.88,14.17c0,.98-.12,1.81-.36,2.51-.24,.7-.59,1.27-1.06,1.72s-1.03,.77-1.7,.99c-.67,.21-1.42,.32-2.27,.32-1.64,0-2.91-.42-3.81-1.26-.9-.84-1.35-2.19-1.35-4.04V4.27h1.61V14.24c0,1.46,.3,2.5,.9,3.13,.6,.63,1.52,.94,2.75,.94s2.13-.32,2.75-.95,.92-1.68,.92-3.12V4.27h1.61V14.17Z\"/>\r\n <path class=\"b\"\r\n d=\"M141.65,15.31c0,1.43-.4,2.48-1.2,3.14s-2.1,1-3.89,1h-4.84V4.27h4.84c1.71,0,2.94,.33,3.69,.99,.75,.66,1.12,1.64,1.12,2.95,0,1.74-.62,2.87-1.87,3.39v.08c.73,.28,1.28,.7,1.62,1.26s.52,1.35,.52,2.37Zm-1.91-6.97c0-1.05-.26-1.76-.79-2.14s-1.27-.57-2.22-.57h-3.39v5.41h3.39c.93,0,1.67-.19,2.21-.58,.54-.39,.81-1.09,.81-2.11Zm.28,6.88c0-.98-.25-1.7-.76-2.15s-1.29-.68-2.33-.68h-3.58v5.71h3.58c1.05,0,1.83-.23,2.33-.69,.51-.46,.76-1.19,.76-2.18Z\"/>\r\n <path class=\"b\" d=\"M144.92,19.46V4.27h1.61v13.83h7.09v1.36h-8.7Z\"/>\r\n <path class=\"b\" d=\"M156.24,19.46V4.27h1.61v15.19h-1.61Z\"/>\r\n <path class=\"b\"\r\n d=\"M162.06,4.27h1.61v6.7h1.42l4.94-6.7h1.87l-5.49,7.34,5.62,7.85h-1.95l-5.09-7.11h-1.32v7.11h-1.61V4.27Z\"/>\r\n <path class=\"b\"\r\n d=\"M181.91,15.74h-6.45l-1.17,3.71h-1.65l4.98-15.19h2.16l5.01,15.19h-1.7l-1.19-3.71Zm-6.02-1.36h5.6l-2.76-8.68h-.08l-2.76,8.68Z\"/>\r\n </g>\r\n <g>\r\n <path class=\"b\"\r\n d=\"M88.07,40.9c0,.76-.09,1.42-.26,1.96-.18,.54-.47,.99-.87,1.32-.4,.34-.92,.59-1.56,.74-.64,.15-1.41,.23-2.31,.23-.81,0-1.54-.06-2.21-.17-.67-.11-1.32-.29-1.95-.53l.34-1.38c.59,.21,1.23,.38,1.92,.5,.69,.12,1.38,.18,2.09,.18,.55,0,1.03-.04,1.42-.12,.4-.08,.72-.22,.99-.43,.26-.21,.46-.48,.58-.84s.19-.8,.19-1.34c0-.44-.05-.82-.14-1.13s-.26-.59-.51-.83c-.25-.23-.58-.44-1-.63s-.94-.37-1.58-.55c-.71-.2-1.33-.41-1.86-.65-.53-.23-.97-.52-1.32-.86s-.6-.74-.77-1.2c-.17-.46-.25-1.01-.25-1.64,0-1.36,.38-2.38,1.15-3.06,.76-.69,1.95-1.03,3.56-1.03,.67,0,1.33,.06,1.98,.18,.66,.12,1.28,.29,1.86,.52l-.28,1.36c-.58-.2-1.15-.35-1.7-.47-.55-.11-1.15-.17-1.8-.17-1.13,0-1.93,.2-2.41,.59-.47,.4-.71,1.05-.71,1.97,0,.47,.06,.86,.18,1.17,.12,.31,.3,.57,.54,.79,.24,.21,.54,.4,.91,.55,.37,.16,.8,.3,1.29,.45,.89,.28,1.63,.56,2.21,.82,.58,.26,1.04,.56,1.37,.89s.57,.72,.7,1.17c.13,.45,.2,.99,.2,1.62Z\"/>\r\n <path class=\"b\" d=\"M91.06,44.91v-15.19h1.61v13.83h7.08v1.36h-8.7Z\"/>\r\n <path class=\"b\"\r\n d=\"M106.67,45.16c-.99,0-1.85-.13-2.59-.39-.74-.26-1.34-.7-1.83-1.3-.48-.61-.84-1.41-1.08-2.41-.24-1-.36-2.23-.36-3.7s.12-2.71,.36-3.72c.24-1.01,.6-1.82,1.08-2.44,.48-.62,1.09-1.06,1.83-1.33,.73-.27,1.6-.4,2.59-.4s1.83,.13,2.56,.4c.73,.27,1.33,.71,1.81,1.32,.48,.61,.84,1.41,1.08,2.42s.36,2.23,.36,3.69-.12,2.73-.35,3.73-.59,1.81-1.06,2.43-1.08,1.05-1.81,1.31-1.6,.39-2.59,.39Zm-.02-1.42c.79,0,1.45-.12,1.98-.35,.53-.23,.95-.61,1.27-1.12,.32-.52,.54-1.19,.68-2.01,.13-.82,.2-1.82,.2-2.99s-.07-2.19-.2-3c-.13-.81-.36-1.47-.68-1.97s-.74-.86-1.27-1.08-1.19-.33-1.98-.33-1.45,.11-1.98,.33-.96,.58-1.27,1.08c-.32,.5-.54,1.16-.68,1.97-.13,.81-.2,1.81-.2,3s.07,2.17,.2,2.99c.13,.82,.36,1.49,.68,2.01,.32,.52,.74,.89,1.27,1.12,.53,.23,1.19,.35,1.98,.35Z\"/>\r\n <path class=\"b\" d=\"M113.97,29.72h1.66l4.07,13.62h.08l4.03-13.62h1.57l-4.56,15.19h-2.27l-4.58-15.19Z\"/>\r\n <path class=\"b\" d=\"M127.69,44.91v-15.19h9.1v1.36h-7.49v5.49h6.49v1.36h-6.49v5.62h7.49v1.36h-9.1Z\"/>\r\n <path class=\"b\"\r\n d=\"M141.59,31.44h-.08v13.47h-1.49v-15.19h2.38l6.81,13.45h.08v-13.45h1.49v15.19h-2.36l-6.83-13.47Z\"/>\r\n <path class=\"b\" d=\"M154.97,44.91v-15.19h1.61v15.19h-1.61Z\"/>\r\n <path class=\"b\"\r\n d=\"M162.84,29.72v13.98c0,.72-.06,1.36-.18,1.91-.12,.55-.33,1.03-.62,1.44s-.68,.76-1.16,1.06-1.08,.55-1.8,.76l-.42-1.36c.48-.14,.88-.32,1.21-.52,.33-.21,.59-.46,.8-.75s.35-.64,.43-1.04c.08-.4,.13-.86,.13-1.38v-14.11h1.61Z\"/>\r\n <path class=\"b\"\r\n d=\"M174.08,41.2h-6.45l-1.17,3.71h-1.65l4.98-15.19h2.16l5.01,15.19h-1.7l-1.19-3.71Zm-6.02-1.36h5.6l-2.76-8.68h-.08l-2.76,8.68Z\"/>\r\n </g>\r\n </svg>\r\n </a>\r\n <div class=\"nav-list\">\r\n <ul class=\"flex\">\r\n <li class=\"mx-2\" *ngIf=\"multiLanguageEnabled\" [ngClass]=\"this.localStorageService.getItem('lang') === 'sl' ?'font-bold' : ''\">\r\n <a href=\"#\" aria-label=\"Slovenian language\" (click)=\"changeLanguage($event, 'sl')\">SI</a>\r\n </li>\r\n <li class=\"mx-2\" *ngIf=\"multiLanguageEnabled\" [ngClass]=\"this.localStorageService.getItem('lang') === 'it' ?'font-bold' : ''\">\r\n <a href=\"#\" aria-label=\"Italian language\" (click)=\"changeLanguage($event, 'it')\">IT</a>\r\n </li>\r\n <li class=\"mx-2\" *ngIf=\"multiLanguageEnabled\" [ngClass]=\"this.localStorageService.getItem('lang') === 'hu' ?'font-bold' : ''\">\r\n <a href=\"#\" aria-label=\"Hungarian language\" (click)=\"changeLanguage($event, 'hu')\">HU</a>\r\n </li>\r\n <li class=\"mx-2\" *ngIf=\"multiLanguageEnabled\" [ngClass]=\"this.localStorageService.getItem('lang') === 'en' ?'font-bold' : ''\">\r\n <a href=\"#\" aria-label=\"English language\" (click)=\"changeLanguage($event, 'en')\">EN</a>\r\n </li>\r\n <li class=\"mx-2\">\r\n <a href=\"#\" (click)=\"accessibilityClick($event)\">\r\n {{ 'components.navbar.accessibility' | translate }}\r\n </a>\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n</nav>\r\n\r\n<!-- prikaz nujnih obvestil: \u010De jih je ve\u010D se menjajo na N sekund -->\r\n<div class=\"urgent-notifications\" *ngIf=\"notificationList.length > 0\">\r\n <div class=\"banner\" [ngClass]=\"animationClass\">\r\n <p>{{ currentNotification }}</p>\r\n </div>\r\n</div>\r\n", styles: [".menu{background:#1b495a}.menu .container{padding:.5rem 1rem}.menu .container .nav-list a{font-size:1.2rem;text-decoration:none;color:#fff}.menu .container .nav-list a:hover{text-decoration:underline}.menu .container .nav-list a:active{color:#000;background:#ffa142}.urgent-notifications{background-color:#d9534f;position:relative;min-height:40px;overflow:hidden}.urgent-notifications .banner{max-width:1190px;margin:0 auto;position:relative;color:#fff;padding:.5rem 1rem;font-weight:700;font-size:18px;white-space:nowrap;transition:opacity 1s ease-in-out}.urgent-notifications .banner p{text-wrap:wrap}.urgent-notifications .fade-in{opacity:1}.urgent-notifications .fade-out{opacity:0}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }] });
1141
+ }
1142
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: NavbarComponent, decorators: [{
1143
+ type: Component,
1144
+ args: [{ selector: 'lib-navbar', imports: [
1145
+ NgIf,
1146
+ NgClass,
1147
+ TranslateModule,
1148
+ ], template: "<nav class=\"menu\">\r\n <div\r\n class=\"container flex sm:align-items-start sm:justify-content-start md:align-items-center md:justify-content-between flex-column md:flex-row\">\r\n <a href=\"#\" (click)=\"clickLogo($event)\" class=\"navbar-logo\">\r\n <svg id=\"a\" xmlns=\"http://www.w3.org/2000/svg\" role=\"img\" width=\"189.01\" height=\"50\" viewBox=\"0 0 189.01 50\">\r\n <title>Navigacija na doma\u010Do stran, portala eSamonaro\u010Danje republike Slovenije.</title>\r\n <defs>\r\n <style>.b {\r\n fill: #fff;\r\n }</style>\r\n </defs>\r\n <path class=\"b\"\r\n d=\"M38.39,27.03c-.67,10.72-7.89,19.84-18.48,22.9C9.7,47.04,2.1,38.1,1.4,27.03L0,4.8C6.49,1.65,12.53,0,19.91,0,26.59,0,33.2,1.46,39.79,4.8m-2.83,.32l-1.37,21.72c-.57,9.06-6.46,17.11-15.68,20.16-8.68-2.8-15.07-10.59-15.68-20.16L2.83,5.12c-.35,.16-.89,.38-1.27,.57l1.34,21.25c.64,9.99,7.47,18.64,17.01,21.44,9.35-2.8,16.38-11.26,17.02-21.44l1.34-21.25c-.41-.19-.83-.38-1.3-.57M15.84,25.48l-2.83-3.78-6.71,9c.47,2.32,1.62,3.43,4.45,3.43,1.94,0,2.26-1.21,4.55-1.21s2.54,1.21,4.61,1.21,2.2-1.21,4.58-1.21,2.61,1.21,4.58,1.21c2.8,0,4.1-1.34,4.45-3.46l-6.74-8.97-2.83,3.78-4.04-8.08-4.07,8.08Zm13.23,11.8c.64,0,1.21-.13,1.72-.35,.38-.61,.64-1.08,.96-1.72-.8,.41-1.66,.73-2.67,.73-2.23,0-2.35-1.21-4.58-1.21s-2.42,1.21-4.61,1.21-2.29-1.21-4.58-1.21c-2.16,0-2.42,1.21-4.58,1.21-1.21,0-1.97-.45-2.7-.8,.32,.64,.67,1.21,1.05,1.81,.54,.19,1.12,.29,1.69,.29,2.35,0,2.32-1.21,4.55-1.21s2.42,1.24,4.58,1.24,2.48-1.24,4.61-1.24,2.39,1.24,4.58,1.24m-4.58,.57c-2.1,0-2.16,1.24-4.58,1.24-2.26,0-2.67-1.24-4.61-1.24-2.04,0-2.07,1.17-4.68,1.21,2.42,2.83,5.57,5.09,9.29,6.39,3.56-1.24,6.71-3.37,9.26-6.39-2.55,0-2.61-1.21-4.68-1.21M14.37,4.64l-1.72-.16,1.02,1.37-1.05,1.4,1.75-.19,.7,1.59,.7-1.59,1.75,.19-1.05-1.4,1.02-1.4-1.72,.19-.7-1.59-.7,1.59Zm4.83,6.42l-1.72-.16,1.02,1.37-1.05,1.4,1.75-.19,.7,1.59,.7-1.59,1.75,.19-1.05-1.4,1.02-1.4-1.72,.19-.7-1.59-.7,1.59Zm4.8-6.42l-1.72-.16,1.02,1.37-1.05,1.4,1.75-.19,.7,1.59,.7-1.59,1.75,.19-1.05-1.4,1.02-1.4-1.72,.19-.7-1.59-.7,1.59Z\"/>\r\n <g>\r\n <path class=\"b\"\r\n d=\"M81.43,19.46h-1.61V4.27h4.86c.86,0,1.61,.07,2.25,.21,.64,.14,1.16,.38,1.58,.7,.42,.33,.72,.76,.92,1.29s.3,1.2,.3,1.97c0,1.29-.26,2.27-.78,2.94-.52,.67-1.34,1.11-2.44,1.3l3.54,6.77h-1.85l-3.39-6.6h-3.37v6.6Zm0-7.96h3.12c.58,0,1.09-.04,1.53-.11,.44-.07,.81-.21,1.1-.42s.52-.51,.68-.91c.16-.39,.23-.9,.23-1.52s-.07-1.1-.22-1.48c-.15-.38-.37-.67-.66-.88s-.66-.36-1.1-.44c-.45-.08-.97-.12-1.56-.12h-3.12v5.88Z\"/>\r\n <path class=\"b\" d=\"M93.05,19.46V4.27h9.1v1.36h-7.49v5.49h6.49v1.36h-6.49v5.62h7.49v1.36h-9.1Z\"/>\r\n <path class=\"b\"\r\n d=\"M106.99,19.46h-1.61V4.27h4.75c.86,0,1.61,.07,2.25,.22,.64,.15,1.16,.39,1.58,.73s.72,.79,.92,1.34c.2,.55,.3,1.24,.3,2.06,0,1.65-.41,2.83-1.22,3.53-.81,.7-2.09,1.05-3.83,1.05h-3.14v6.26Zm0-7.62h3.01c.58,0,1.09-.04,1.53-.12s.81-.23,1.1-.45c.3-.22,.52-.53,.68-.94,.16-.41,.23-.94,.23-1.61s-.08-1.16-.22-1.55-.37-.71-.66-.94c-.29-.23-.66-.38-1.1-.46-.45-.08-.96-.12-1.56-.12h-3.01v6.17Z\"/>\r\n <path class=\"b\"\r\n d=\"M127.88,14.17c0,.98-.12,1.81-.36,2.51-.24,.7-.59,1.27-1.06,1.72s-1.03,.77-1.7,.99c-.67,.21-1.42,.32-2.27,.32-1.64,0-2.91-.42-3.81-1.26-.9-.84-1.35-2.19-1.35-4.04V4.27h1.61V14.24c0,1.46,.3,2.5,.9,3.13,.6,.63,1.52,.94,2.75,.94s2.13-.32,2.75-.95,.92-1.68,.92-3.12V4.27h1.61V14.17Z\"/>\r\n <path class=\"b\"\r\n d=\"M141.65,15.31c0,1.43-.4,2.48-1.2,3.14s-2.1,1-3.89,1h-4.84V4.27h4.84c1.71,0,2.94,.33,3.69,.99,.75,.66,1.12,1.64,1.12,2.95,0,1.74-.62,2.87-1.87,3.39v.08c.73,.28,1.28,.7,1.62,1.26s.52,1.35,.52,2.37Zm-1.91-6.97c0-1.05-.26-1.76-.79-2.14s-1.27-.57-2.22-.57h-3.39v5.41h3.39c.93,0,1.67-.19,2.21-.58,.54-.39,.81-1.09,.81-2.11Zm.28,6.88c0-.98-.25-1.7-.76-2.15s-1.29-.68-2.33-.68h-3.58v5.71h3.58c1.05,0,1.83-.23,2.33-.69,.51-.46,.76-1.19,.76-2.18Z\"/>\r\n <path class=\"b\" d=\"M144.92,19.46V4.27h1.61v13.83h7.09v1.36h-8.7Z\"/>\r\n <path class=\"b\" d=\"M156.24,19.46V4.27h1.61v15.19h-1.61Z\"/>\r\n <path class=\"b\"\r\n d=\"M162.06,4.27h1.61v6.7h1.42l4.94-6.7h1.87l-5.49,7.34,5.62,7.85h-1.95l-5.09-7.11h-1.32v7.11h-1.61V4.27Z\"/>\r\n <path class=\"b\"\r\n d=\"M181.91,15.74h-6.45l-1.17,3.71h-1.65l4.98-15.19h2.16l5.01,15.19h-1.7l-1.19-3.71Zm-6.02-1.36h5.6l-2.76-8.68h-.08l-2.76,8.68Z\"/>\r\n </g>\r\n <g>\r\n <path class=\"b\"\r\n d=\"M88.07,40.9c0,.76-.09,1.42-.26,1.96-.18,.54-.47,.99-.87,1.32-.4,.34-.92,.59-1.56,.74-.64,.15-1.41,.23-2.31,.23-.81,0-1.54-.06-2.21-.17-.67-.11-1.32-.29-1.95-.53l.34-1.38c.59,.21,1.23,.38,1.92,.5,.69,.12,1.38,.18,2.09,.18,.55,0,1.03-.04,1.42-.12,.4-.08,.72-.22,.99-.43,.26-.21,.46-.48,.58-.84s.19-.8,.19-1.34c0-.44-.05-.82-.14-1.13s-.26-.59-.51-.83c-.25-.23-.58-.44-1-.63s-.94-.37-1.58-.55c-.71-.2-1.33-.41-1.86-.65-.53-.23-.97-.52-1.32-.86s-.6-.74-.77-1.2c-.17-.46-.25-1.01-.25-1.64,0-1.36,.38-2.38,1.15-3.06,.76-.69,1.95-1.03,3.56-1.03,.67,0,1.33,.06,1.98,.18,.66,.12,1.28,.29,1.86,.52l-.28,1.36c-.58-.2-1.15-.35-1.7-.47-.55-.11-1.15-.17-1.8-.17-1.13,0-1.93,.2-2.41,.59-.47,.4-.71,1.05-.71,1.97,0,.47,.06,.86,.18,1.17,.12,.31,.3,.57,.54,.79,.24,.21,.54,.4,.91,.55,.37,.16,.8,.3,1.29,.45,.89,.28,1.63,.56,2.21,.82,.58,.26,1.04,.56,1.37,.89s.57,.72,.7,1.17c.13,.45,.2,.99,.2,1.62Z\"/>\r\n <path class=\"b\" d=\"M91.06,44.91v-15.19h1.61v13.83h7.08v1.36h-8.7Z\"/>\r\n <path class=\"b\"\r\n d=\"M106.67,45.16c-.99,0-1.85-.13-2.59-.39-.74-.26-1.34-.7-1.83-1.3-.48-.61-.84-1.41-1.08-2.41-.24-1-.36-2.23-.36-3.7s.12-2.71,.36-3.72c.24-1.01,.6-1.82,1.08-2.44,.48-.62,1.09-1.06,1.83-1.33,.73-.27,1.6-.4,2.59-.4s1.83,.13,2.56,.4c.73,.27,1.33,.71,1.81,1.32,.48,.61,.84,1.41,1.08,2.42s.36,2.23,.36,3.69-.12,2.73-.35,3.73-.59,1.81-1.06,2.43-1.08,1.05-1.81,1.31-1.6,.39-2.59,.39Zm-.02-1.42c.79,0,1.45-.12,1.98-.35,.53-.23,.95-.61,1.27-1.12,.32-.52,.54-1.19,.68-2.01,.13-.82,.2-1.82,.2-2.99s-.07-2.19-.2-3c-.13-.81-.36-1.47-.68-1.97s-.74-.86-1.27-1.08-1.19-.33-1.98-.33-1.45,.11-1.98,.33-.96,.58-1.27,1.08c-.32,.5-.54,1.16-.68,1.97-.13,.81-.2,1.81-.2,3s.07,2.17,.2,2.99c.13,.82,.36,1.49,.68,2.01,.32,.52,.74,.89,1.27,1.12,.53,.23,1.19,.35,1.98,.35Z\"/>\r\n <path class=\"b\" d=\"M113.97,29.72h1.66l4.07,13.62h.08l4.03-13.62h1.57l-4.56,15.19h-2.27l-4.58-15.19Z\"/>\r\n <path class=\"b\" d=\"M127.69,44.91v-15.19h9.1v1.36h-7.49v5.49h6.49v1.36h-6.49v5.62h7.49v1.36h-9.1Z\"/>\r\n <path class=\"b\"\r\n d=\"M141.59,31.44h-.08v13.47h-1.49v-15.19h2.38l6.81,13.45h.08v-13.45h1.49v15.19h-2.36l-6.83-13.47Z\"/>\r\n <path class=\"b\" d=\"M154.97,44.91v-15.19h1.61v15.19h-1.61Z\"/>\r\n <path class=\"b\"\r\n d=\"M162.84,29.72v13.98c0,.72-.06,1.36-.18,1.91-.12,.55-.33,1.03-.62,1.44s-.68,.76-1.16,1.06-1.08,.55-1.8,.76l-.42-1.36c.48-.14,.88-.32,1.21-.52,.33-.21,.59-.46,.8-.75s.35-.64,.43-1.04c.08-.4,.13-.86,.13-1.38v-14.11h1.61Z\"/>\r\n <path class=\"b\"\r\n d=\"M174.08,41.2h-6.45l-1.17,3.71h-1.65l4.98-15.19h2.16l5.01,15.19h-1.7l-1.19-3.71Zm-6.02-1.36h5.6l-2.76-8.68h-.08l-2.76,8.68Z\"/>\r\n </g>\r\n </svg>\r\n </a>\r\n <div class=\"nav-list\">\r\n <ul class=\"flex\">\r\n <li class=\"mx-2\" *ngIf=\"multiLanguageEnabled\" [ngClass]=\"this.localStorageService.getItem('lang') === 'sl' ?'font-bold' : ''\">\r\n <a href=\"#\" aria-label=\"Slovenian language\" (click)=\"changeLanguage($event, 'sl')\">SI</a>\r\n </li>\r\n <li class=\"mx-2\" *ngIf=\"multiLanguageEnabled\" [ngClass]=\"this.localStorageService.getItem('lang') === 'it' ?'font-bold' : ''\">\r\n <a href=\"#\" aria-label=\"Italian language\" (click)=\"changeLanguage($event, 'it')\">IT</a>\r\n </li>\r\n <li class=\"mx-2\" *ngIf=\"multiLanguageEnabled\" [ngClass]=\"this.localStorageService.getItem('lang') === 'hu' ?'font-bold' : ''\">\r\n <a href=\"#\" aria-label=\"Hungarian language\" (click)=\"changeLanguage($event, 'hu')\">HU</a>\r\n </li>\r\n <li class=\"mx-2\" *ngIf=\"multiLanguageEnabled\" [ngClass]=\"this.localStorageService.getItem('lang') === 'en' ?'font-bold' : ''\">\r\n <a href=\"#\" aria-label=\"English language\" (click)=\"changeLanguage($event, 'en')\">EN</a>\r\n </li>\r\n <li class=\"mx-2\">\r\n <a href=\"#\" (click)=\"accessibilityClick($event)\">\r\n {{ 'components.navbar.accessibility' | translate }}\r\n </a>\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n</nav>\r\n\r\n<!-- prikaz nujnih obvestil: \u010De jih je ve\u010D se menjajo na N sekund -->\r\n<div class=\"urgent-notifications\" *ngIf=\"notificationList.length > 0\">\r\n <div class=\"banner\" [ngClass]=\"animationClass\">\r\n <p>{{ currentNotification }}</p>\r\n </div>\r\n</div>\r\n", styles: [".menu{background:#1b495a}.menu .container{padding:.5rem 1rem}.menu .container .nav-list a{font-size:1.2rem;text-decoration:none;color:#fff}.menu .container .nav-list a:hover{text-decoration:underline}.menu .container .nav-list a:active{color:#000;background:#ffa142}.urgent-notifications{background-color:#d9534f;position:relative;min-height:40px;overflow:hidden}.urgent-notifications .banner{max-width:1190px;margin:0 auto;position:relative;color:#fff;padding:.5rem 1rem;font-weight:700;font-size:18px;white-space:nowrap;transition:opacity 1s ease-in-out}.urgent-notifications .banner p{text-wrap:wrap}.urgent-notifications .fade-in{opacity:1}.urgent-notifications .fade-out{opacity:0}\n"] }]
1149
+ }], ctorParameters: () => [{ type: LocalStorageService }], propDecorators: { imageWidth: [{
1150
+ type: Input
1151
+ }], imageHeight: [{
1152
+ type: Input
1153
+ }], logoAltText: [{
1154
+ type: Input
1155
+ }], multiLanguageEnabled: [{
1156
+ type: Input
1157
+ }], isLogoClick: [{
1158
+ type: Output
1159
+ }], isAccessibilityClicked: [{
1160
+ type: Output
1161
+ }], notificationList: [{
1162
+ type: Input
1163
+ }] } });
1164
+
1165
+ var SelectionMode;
1166
+ (function (SelectionMode) {
1167
+ SelectionMode["single"] = "single";
1168
+ SelectionMode["range"] = "range";
1169
+ SelectionMode["multiple"] = "multiple";
1170
+ })(SelectionMode || (SelectionMode = {}));
1171
+
1172
+ /**
1173
+ * Returns the date of tomorrow, excluding specified disabled dates.
1174
+ *
1175
+ * @param {Date[]} disabledDates - An array of disabled dates.
1176
+ * @return {Date} The date of tomorrow, excluding disabled dates.
1177
+ */
1178
+ function getTomorrowDate(disabledDates) {
1179
+ const today = new Date();
1180
+ let tomorrow = new Date(today.getTime() + 24 * 60 * 60 * 1000);
1181
+ let day = tomorrow.getDay();
1182
+ const isDisabled = (date) => disabledDates.some(disabledDate => new Date(disabledDate).getDate() === date.getDate() &&
1183
+ new Date(disabledDate).getMonth() === date.getMonth() &&
1184
+ new Date(disabledDate).getFullYear() === date.getFullYear());
1185
+ // If tomorrow is Saturday or Sunday or in disabled dates
1186
+ while (day === 6 || day === 0 || isDisabled(tomorrow)) {
1187
+ tomorrow = new Date(tomorrow.getTime() + 24 * 60 * 60 * 1000);
1188
+ day = tomorrow.getDay();
1189
+ }
1190
+ return tomorrow;
1191
+ }
1192
+
1193
+ class DateInputComponent {
1194
+ TooltipHoverEventEnum = TooltipHoverEventEnum;
1195
+ _isTooltipVisible;
1196
+ isLabelVisible = true;
1197
+ name;
1198
+ label;
1199
+ placeholder = '';
1200
+ accessibilityText = '';
1201
+ isRequired = true;
1202
+ tooltipPosition = TooltipPosition.right;
1203
+ tooltipText = '';
1204
+ dateFormat = 'dd.mm.yy';
1205
+ group;
1206
+ controlName;
1207
+ showIcon = true;
1208
+ selectionMode = SelectionMode.single;
1209
+ touchUI = false;
1210
+ formStatus;
1211
+ showClear = false;
1212
+ isPublicDate = true;
1213
+ minDate;
1214
+ maxDate;
1215
+ minDateToday = false;
1216
+ maxDateSixMonths = false; // da je možno datum izbirat 6 mesecev vnaprej
1217
+ maxDateThreeMonths = false; // da je možno datum izbirat 3 mesece vnaprej
1218
+ setMinAndMax = false;
1219
+ hasGap = true;
1220
+ disabledDates;
1221
+ appendTo;
1222
+ groupError = false;
1223
+ showTime = false;
1224
+ // Mare: dnevi ko ni naročanja
1225
+ availableDates = [];
1226
+ // Mare; da je možno ročno nastavit disablane dneve, default ostane SOB, NED
1227
+ // -1 da ni noben disablan
1228
+ disabledDays = [];
1229
+ disabledWeekends = false;
1230
+ onSelect = new EventEmitter();
1231
+ ngOnInit() {
1232
+ this._isTooltipVisible = !!this.tooltipText;
1233
+ if (this.maxDateSixMonths) {
1234
+ this.maxDate = this.getDateInSixMonths();
1235
+ }
1236
+ else if (this.maxDateThreeMonths) {
1237
+ this.maxDate = this.getDateInThreeMonths();
1238
+ }
1239
+ if (this.disabledWeekends) {
1240
+ this.disabledDays = [0, 6];
1241
+ }
1242
+ if (this.minDateToday) {
1243
+ this.minDate = new Date();
1244
+ }
1245
+ }
1246
+ getDateInThreeMonths() {
1247
+ const currentDate = new Date();
1248
+ return new Date(currentDate.getFullYear(), currentDate.getMonth() + 3, currentDate.getDate());
1249
+ }
1250
+ getDateFifteenDaysAgo() {
1251
+ const currentDate = new Date();
1252
+ currentDate.setDate(currentDate.getDate() - 15);
1253
+ return currentDate;
1254
+ }
1255
+ getDateInSixMonths() {
1256
+ const currentDate = new Date();
1257
+ currentDate.setMonth(currentDate.getMonth() + 6);
1258
+ return currentDate;
1259
+ }
1260
+ getDateRangeUnlimited() {
1261
+ const currentDate = new Date();
1262
+ currentDate.setFullYear(currentDate.getFullYear() + 10);
1263
+ return currentDate;
1264
+ }
1265
+ getDateTomorrow(time) {
1266
+ const currentTime = new Date();
1267
+ const [hours, minutes] = time.split(':').map(Number);
1268
+ return new Date(currentTime.getFullYear(), currentTime.getMonth(), currentTime.getDate() + 1, hours, minutes);
1269
+ }
1270
+ /**
1271
+ * preverjanje, če je datum znotraj availableDates
1272
+ */
1273
+ isAppointmentDateAvailable(date) {
1274
+ const dateString = `${date.year}-${(date.month + 1).toString().padStart(2, '0')}-${date.day.toString().padStart(2, '0')}`;
1275
+ return this.availableDates.includes(dateString);
1276
+ }
1277
+ getTomorrowDate = getTomorrowDate;
1278
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: DateInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1279
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.6", type: DateInputComponent, isStandalone: true, selector: "lib-date-input[group][controlName][name]", inputs: { isLabelVisible: "isLabelVisible", name: "name", label: "label", placeholder: "placeholder", accessibilityText: "accessibilityText", isRequired: "isRequired", tooltipPosition: "tooltipPosition", tooltipText: "tooltipText", dateFormat: "dateFormat", group: "group", controlName: "controlName", showIcon: "showIcon", selectionMode: "selectionMode", touchUI: "touchUI", formStatus: "formStatus", showClear: "showClear", isPublicDate: "isPublicDate", minDate: "minDate", maxDate: "maxDate", minDateToday: "minDateToday", maxDateSixMonths: "maxDateSixMonths", maxDateThreeMonths: "maxDateThreeMonths", setMinAndMax: "setMinAndMax", hasGap: "hasGap", disabledDates: "disabledDates", appendTo: "appendTo", groupError: "groupError", showTime: "showTime", availableDates: "availableDates", disabledDays: "disabledDays", disabledWeekends: "disabledWeekends" }, outputs: { onSelect: "onSelect" }, ngImport: i0, template: "<div class='flex flex-column' [formGroup]=\"group\" [ngClass]=\"{ 'gap-1': hasGap }\">\r\n <div class=\"flex\" *ngIf=\"isLabelVisible\">\r\n <label [for]=\"name\" class=\"mr-2\">\r\n {{label}}<span class=\"required\" aria-label=\"Is required filed\" *ngIf=\"isRequired\">*</span>\r\n </label>\r\n <lib-tooltip\r\n *ngIf=\"_isTooltipVisible\"\r\n [position]=\"tooltipPosition\"\r\n [text]=\"tooltipText!\"\r\n ></lib-tooltip>\r\n </div>\r\n\r\n <p-datepicker\r\n [class.ng-invalid.ng-dirty]=\"(group.get(controlName)!.errors && (group.get(controlName)!.touched || formStatus!.isSubmitTriggered)) || groupError\"\r\n [appendTo]=\"appendTo\"\r\n *ngIf=\"setMinAndMax\"\r\n [inputId]=\"name\"\r\n (onSelect)=\"onSelect.emit($event)\"\r\n [placeholder]='placeholder'\r\n [dateFormat]=\"dateFormat\"\r\n [showIcon]=\"showIcon\"\r\n [selectionMode]=\"selectionMode\"\r\n [formControlName]=\"controlName\"\r\n [touchUI]=\"touchUI\"\r\n [minDate]=\"minDate || getDateFifteenDaysAgo()\"\r\n [maxDate]=\"maxDate\"\r\n [showClear]=\"showClear\"\r\n (onClear)=\"group.get(controlName)?.reset()\"\r\n [attr.aria-label]=\"accessibilityText\"\r\n [ngClass]=\"{ 'ng-dirty': (group.get(controlName)!.errors && (group.get(controlName)!.touched) || formStatus!.isSubmitTriggered) }\"\r\n [disabledDays]=\"disabledDays\"\r\n [disabledDates]=\"disabledDates\"\r\n [showTime]=\"showTime\"\r\n hourFormat=\"24\"\r\n [attr.aria-describedby]=\"name + 'Error'\"\r\n [attr.aria-invalid]=\"(group.get(controlName)!.errors && (group.get(controlName)!.touched || formStatus!.isSubmitTriggered)) || groupError\"\r\n [attr.aria-required]=\"isRequired\"\r\n >\r\n <!-- Mare; ideja da barva dolo\u010Dene dneve (npr. takrat ki ni prostih terminov) -->\r\n <!-- 24.05.2024 Mare; zaenkrat ne potrebujemo ve\u010D, ker so neprosti dnevi kar disabled -->\r\n <ng-template pTemplate=\"date\" let-date>\r\n <div>{{date.day}}</div>\r\n </ng-template>\r\n </p-datepicker>\r\n\r\n <p-datepicker\r\n [class.ng-invalid.ng-dirty]=\"(group.get(controlName)!.errors && (group.get(controlName)!.touched || formStatus!.isSubmitTriggered)) || groupError\"\r\n [appendTo]=\"appendTo\"\r\n *ngIf=\"!setMinAndMax\"\r\n (onSelect)=\"onSelect.emit($event)\"\r\n [inputId]=\"name\"\r\n [placeholder]='placeholder'\r\n [dateFormat]=\"dateFormat\"\r\n [showIcon]=\"showIcon\"\r\n [selectionMode]=\"selectionMode\"\r\n [formControlName]=\"controlName\"\r\n [touchUI]=\"touchUI\"\r\n [showClear]=\"showClear\"\r\n (onClear)=\"group.get(controlName)?.reset()\"\r\n [ngClass]=\"{ 'ng-dirty': (group.get(controlName)!.errors && (group.get(controlName)!.touched) || formStatus!.isSubmitTriggered) }\"\r\n [attr.aria-label]=\"accessibilityText\"\r\n [disabledDays]=\"disabledDays\"\r\n [disabledDates]=\"disabledDates\"\r\n [showTime]=\"showTime\"\r\n hourFormat=\"24\"\r\n [attr.aria-describedby]=\"name + 'Error'\"\r\n [attr.aria-invalid]=\"(group.get(controlName)!.errors && (group.get(controlName)!.touched || formStatus!.isSubmitTriggered)) || groupError\"\r\n [attr.aria-required]=\"isRequired\"\r\n ></p-datepicker>\r\n</div>\r\n<lib-error\r\n *ngIf=\"(group.get(controlName)!.errors && (group.get(controlName)!.touched) || formStatus!.isSubmitTriggered)\"\r\n [hasError]=\"group.get(controlName)!.errors\"\r\n [isTouched]=\"group.get(controlName)!.touched\"\r\n [isSubmitTriggered]=\"formStatus!.isSubmitTriggered!\"\r\n [hasGroupError]=\"groupError\"\r\n [errorId]=\"name+'Error'\"\r\n></lib-error>\r\n", styles: [":host ::ng-deep{width:100%}:host ::ng-deep .p-datepicker-dropdown{background-color:#3e7c94;color:#fff;border-color:#3e7c94}:host ::ng-deep .p-datepicker-dropdown:hover{background-color:#1b495a!important;border-color:#1b495a!important;color:#fff!important}:host ::ng-deep .p-datepicker-title>*{color:#fff!important;font-weight:700}:host ::ng-deep .p-datepicker-clear-icon{padding-right:8px;color:#6d7375;cursor:pointer}:host ::ng-deep .p-datepicker{min-width:max-content!important;width:100%;border:1.75px solid #3E7C94!important}:host ::ng-deep .p-datepicker::placeholder{font-style:italic!important;color:#848484!important}:host ::ng-deep .p-datepicker:hover{border:1.75px solid #ffa142!important}:host ::ng-deep .p-datepicker:focus{box-shadow:0 0 2px 3px #ffa142!important}:host ::ng-deep .p-datepicker table td>span.p-highlight{color:#000;background:#3e7c94}:host ::ng-deep .p-datepicker:not(.p-disabled).p-focus{border:1.75px solid #1B495A;box-shadow:0 0 2px 3px #ffa142}:host ::ng-deep .p-datepicker:not(.p-disabled).p-focus span{outline:none}:host ::ng-deep .p-datepicker-prev-button,:host ::ng-deep .p-datepicker-next-button{color:#fff!important}:host ::ng-deep .p-inputtext{border:none}:host ::ng-deep .appointment-not-available{background:#ff7373;width:100%;height:100%;display:flex;align-items:center;justify-content:center}:host ::ng-deep .appointment-available{background:#e0fde7;width:100%;height:100%;display:flex;align-items:center;justify-content:center}:host ::ng-deep .p-button{border-radius:0 8px 8px 0}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: TooltipComponent, selector: " lib-tooltip", inputs: ["icon", "htmlParser", "text", "position", "tooltipEvent", "autoHide", "htmlParse"] }, { kind: "ngmodule", type: DatePickerModule }, { kind: "component", type: i2$2.DatePicker, selector: "p-datePicker, p-datepicker, p-date-picker", inputs: ["iconDisplay", "style", "styleClass", "inputStyle", "inputId", "name", "inputStyleClass", "placeholder", "ariaLabelledBy", "ariaLabel", "iconAriaLabel", "disabled", "dateFormat", "multipleSeparator", "rangeSeparator", "inline", "showOtherMonths", "selectOtherMonths", "showIcon", "fluid", "icon", "appendTo", "readonlyInput", "shortYearCutoff", "monthNavigator", "yearNavigator", "hourFormat", "timeOnly", "stepHour", "stepMinute", "stepSecond", "showSeconds", "required", "showOnFocus", "showWeek", "startWeekFromFirstDayOfYear", "showClear", "dataType", "selectionMode", "maxDateCount", "showButtonBar", "todayButtonStyleClass", "clearButtonStyleClass", "autofocus", "autoZIndex", "baseZIndex", "panelStyleClass", "panelStyle", "keepInvalid", "hideOnDateTimeSelect", "touchUI", "timeSeparator", "focusTrap", "showTransitionOptions", "hideTransitionOptions", "tabindex", "variant", "size", "minDate", "maxDate", "disabledDates", "disabledDays", "yearRange", "showTime", "responsiveOptions", "numberOfMonths", "firstDayOfWeek", "locale", "view", "defaultDate"], outputs: ["onFocus", "onBlur", "onClose", "onSelect", "onClear", "onInput", "onTodayClick", "onClearClick", "onMonthChange", "onYearChange", "onClickOutside", "onShow"] }, { kind: "directive", type: i1$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: ErrorComponent, selector: "lib-error", inputs: ["hasError", "isTouched", "isSubmitTriggered", "isNestedFormSubmit", "isDirty", "isRequired", "hasGroupError", "errorId"] }] });
1280
+ }
1281
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: DateInputComponent, decorators: [{
1282
+ type: Component,
1283
+ args: [{ selector: 'lib-date-input[group][controlName][name]', imports: [
1284
+ FormsModule,
1285
+ ReactiveFormsModule,
1286
+ NgClass,
1287
+ NgIf,
1288
+ TooltipComponent,
1289
+ DatePickerModule,
1290
+ PrimeTemplate,
1291
+ ErrorComponent,
1292
+ ], template: "<div class='flex flex-column' [formGroup]=\"group\" [ngClass]=\"{ 'gap-1': hasGap }\">\r\n <div class=\"flex\" *ngIf=\"isLabelVisible\">\r\n <label [for]=\"name\" class=\"mr-2\">\r\n {{label}}<span class=\"required\" aria-label=\"Is required filed\" *ngIf=\"isRequired\">*</span>\r\n </label>\r\n <lib-tooltip\r\n *ngIf=\"_isTooltipVisible\"\r\n [position]=\"tooltipPosition\"\r\n [text]=\"tooltipText!\"\r\n ></lib-tooltip>\r\n </div>\r\n\r\n <p-datepicker\r\n [class.ng-invalid.ng-dirty]=\"(group.get(controlName)!.errors && (group.get(controlName)!.touched || formStatus!.isSubmitTriggered)) || groupError\"\r\n [appendTo]=\"appendTo\"\r\n *ngIf=\"setMinAndMax\"\r\n [inputId]=\"name\"\r\n (onSelect)=\"onSelect.emit($event)\"\r\n [placeholder]='placeholder'\r\n [dateFormat]=\"dateFormat\"\r\n [showIcon]=\"showIcon\"\r\n [selectionMode]=\"selectionMode\"\r\n [formControlName]=\"controlName\"\r\n [touchUI]=\"touchUI\"\r\n [minDate]=\"minDate || getDateFifteenDaysAgo()\"\r\n [maxDate]=\"maxDate\"\r\n [showClear]=\"showClear\"\r\n (onClear)=\"group.get(controlName)?.reset()\"\r\n [attr.aria-label]=\"accessibilityText\"\r\n [ngClass]=\"{ 'ng-dirty': (group.get(controlName)!.errors && (group.get(controlName)!.touched) || formStatus!.isSubmitTriggered) }\"\r\n [disabledDays]=\"disabledDays\"\r\n [disabledDates]=\"disabledDates\"\r\n [showTime]=\"showTime\"\r\n hourFormat=\"24\"\r\n [attr.aria-describedby]=\"name + 'Error'\"\r\n [attr.aria-invalid]=\"(group.get(controlName)!.errors && (group.get(controlName)!.touched || formStatus!.isSubmitTriggered)) || groupError\"\r\n [attr.aria-required]=\"isRequired\"\r\n >\r\n <!-- Mare; ideja da barva dolo\u010Dene dneve (npr. takrat ki ni prostih terminov) -->\r\n <!-- 24.05.2024 Mare; zaenkrat ne potrebujemo ve\u010D, ker so neprosti dnevi kar disabled -->\r\n <ng-template pTemplate=\"date\" let-date>\r\n <div>{{date.day}}</div>\r\n </ng-template>\r\n </p-datepicker>\r\n\r\n <p-datepicker\r\n [class.ng-invalid.ng-dirty]=\"(group.get(controlName)!.errors && (group.get(controlName)!.touched || formStatus!.isSubmitTriggered)) || groupError\"\r\n [appendTo]=\"appendTo\"\r\n *ngIf=\"!setMinAndMax\"\r\n (onSelect)=\"onSelect.emit($event)\"\r\n [inputId]=\"name\"\r\n [placeholder]='placeholder'\r\n [dateFormat]=\"dateFormat\"\r\n [showIcon]=\"showIcon\"\r\n [selectionMode]=\"selectionMode\"\r\n [formControlName]=\"controlName\"\r\n [touchUI]=\"touchUI\"\r\n [showClear]=\"showClear\"\r\n (onClear)=\"group.get(controlName)?.reset()\"\r\n [ngClass]=\"{ 'ng-dirty': (group.get(controlName)!.errors && (group.get(controlName)!.touched) || formStatus!.isSubmitTriggered) }\"\r\n [attr.aria-label]=\"accessibilityText\"\r\n [disabledDays]=\"disabledDays\"\r\n [disabledDates]=\"disabledDates\"\r\n [showTime]=\"showTime\"\r\n hourFormat=\"24\"\r\n [attr.aria-describedby]=\"name + 'Error'\"\r\n [attr.aria-invalid]=\"(group.get(controlName)!.errors && (group.get(controlName)!.touched || formStatus!.isSubmitTriggered)) || groupError\"\r\n [attr.aria-required]=\"isRequired\"\r\n ></p-datepicker>\r\n</div>\r\n<lib-error\r\n *ngIf=\"(group.get(controlName)!.errors && (group.get(controlName)!.touched) || formStatus!.isSubmitTriggered)\"\r\n [hasError]=\"group.get(controlName)!.errors\"\r\n [isTouched]=\"group.get(controlName)!.touched\"\r\n [isSubmitTriggered]=\"formStatus!.isSubmitTriggered!\"\r\n [hasGroupError]=\"groupError\"\r\n [errorId]=\"name+'Error'\"\r\n></lib-error>\r\n", styles: [":host ::ng-deep{width:100%}:host ::ng-deep .p-datepicker-dropdown{background-color:#3e7c94;color:#fff;border-color:#3e7c94}:host ::ng-deep .p-datepicker-dropdown:hover{background-color:#1b495a!important;border-color:#1b495a!important;color:#fff!important}:host ::ng-deep .p-datepicker-title>*{color:#fff!important;font-weight:700}:host ::ng-deep .p-datepicker-clear-icon{padding-right:8px;color:#6d7375;cursor:pointer}:host ::ng-deep .p-datepicker{min-width:max-content!important;width:100%;border:1.75px solid #3E7C94!important}:host ::ng-deep .p-datepicker::placeholder{font-style:italic!important;color:#848484!important}:host ::ng-deep .p-datepicker:hover{border:1.75px solid #ffa142!important}:host ::ng-deep .p-datepicker:focus{box-shadow:0 0 2px 3px #ffa142!important}:host ::ng-deep .p-datepicker table td>span.p-highlight{color:#000;background:#3e7c94}:host ::ng-deep .p-datepicker:not(.p-disabled).p-focus{border:1.75px solid #1B495A;box-shadow:0 0 2px 3px #ffa142}:host ::ng-deep .p-datepicker:not(.p-disabled).p-focus span{outline:none}:host ::ng-deep .p-datepicker-prev-button,:host ::ng-deep .p-datepicker-next-button{color:#fff!important}:host ::ng-deep .p-inputtext{border:none}:host ::ng-deep .appointment-not-available{background:#ff7373;width:100%;height:100%;display:flex;align-items:center;justify-content:center}:host ::ng-deep .appointment-available{background:#e0fde7;width:100%;height:100%;display:flex;align-items:center;justify-content:center}:host ::ng-deep .p-button{border-radius:0 8px 8px 0}\n"] }]
1293
+ }], propDecorators: { isLabelVisible: [{
1294
+ type: Input
1295
+ }], name: [{
1296
+ type: Input
1297
+ }], label: [{
1298
+ type: Input
1299
+ }], placeholder: [{
1300
+ type: Input
1301
+ }], accessibilityText: [{
1302
+ type: Input
1303
+ }], isRequired: [{
1304
+ type: Input
1305
+ }], tooltipPosition: [{
1306
+ type: Input
1307
+ }], tooltipText: [{
1308
+ type: Input
1309
+ }], dateFormat: [{
1310
+ type: Input
1311
+ }], group: [{
1312
+ type: Input
1313
+ }], controlName: [{
1314
+ type: Input
1315
+ }], showIcon: [{
1316
+ type: Input
1317
+ }], selectionMode: [{
1318
+ type: Input
1319
+ }], touchUI: [{
1320
+ type: Input
1321
+ }], formStatus: [{
1322
+ type: Input
1323
+ }], showClear: [{
1324
+ type: Input
1325
+ }], isPublicDate: [{
1326
+ type: Input
1327
+ }], minDate: [{
1328
+ type: Input
1329
+ }], maxDate: [{
1330
+ type: Input
1331
+ }], minDateToday: [{
1332
+ type: Input
1333
+ }], maxDateSixMonths: [{
1334
+ type: Input
1335
+ }], maxDateThreeMonths: [{
1336
+ type: Input
1337
+ }], setMinAndMax: [{
1338
+ type: Input
1339
+ }], hasGap: [{
1340
+ type: Input
1341
+ }], disabledDates: [{
1342
+ type: Input
1343
+ }], appendTo: [{
1344
+ type: Input
1345
+ }], groupError: [{
1346
+ type: Input
1347
+ }], showTime: [{
1348
+ type: Input
1349
+ }], availableDates: [{
1350
+ type: Input
1351
+ }], disabledDays: [{
1352
+ type: Input
1353
+ }], disabledWeekends: [{
1354
+ type: Input
1355
+ }], onSelect: [{
1356
+ type: Output
1357
+ }] } });
1358
+
1359
+ class FooterComponent {
1360
+ messageService;
1361
+ translateService;
1362
+ router;
1363
+ version;
1364
+ constructor(messageService, translateService, router) {
1365
+ this.messageService = messageService;
1366
+ this.translateService = translateService;
1367
+ this.router = router;
1368
+ }
1369
+ /**
1370
+ * @deprecated
1371
+ * @see openPersonalDataInfo()
1372
+ */
1373
+ openGdpr(event) {
1374
+ event.preventDefault();
1375
+ this.messageService.add({
1376
+ key: 'notification',
1377
+ severity: 'info',
1378
+ summary: this.translateService?.instant('components.footer.modal.GDPR'),
1379
+ });
1380
+ }
1381
+ /**
1382
+ * ES-267 odpre stran z obvestilom glede osebnih podatkov
1383
+ * @param event
1384
+ */
1385
+ openPersonalDataInfo(event) {
1386
+ event.preventDefault();
1387
+ const url = window.location.href;
1388
+ const organisation = url.split('/')[3];
1389
+ const language = url.split('/')[4];
1390
+ this.router.navigateByUrl(`${organisation}/${language}/obvestilo-glede-osebnih-podatkov`);
1391
+ }
1392
+ openAccessibilityInfo(event) {
1393
+ event.preventDefault();
1394
+ const url = window.location.href;
1395
+ const organisation = url.split('/')[3];
1396
+ const language = url.split('/')[4];
1397
+ this.router.navigateByUrl(`${organisation}/${language}/izjava-o-dostopnosti`);
1398
+ }
1399
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: FooterComponent, deps: [{ token: i1$1.MessageService }, { token: i2.TranslateService }, { token: i1$2.Router }], target: i0.ɵɵFactoryTarget.Component });
1400
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.6", type: FooterComponent, isStandalone: true, selector: "lib-footer", inputs: { version: "version" }, ngImport: i0, template: "<footer class=\"footer\">\r\n <div class=\"footer-logo-list\">\r\n <p class=\"container text-white\">{{ 'components.footer.version' | translate }}: {{ version }}</p>\r\n </div>\r\n</footer>\r\n", styles: [".footer{background:#d7d7d7}.footer .footer-links a{word-break:break-word}.footer .footer-logo-list{background:#000;height:5rem}\n"], dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }] });
1401
+ }
1402
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: FooterComponent, decorators: [{
1403
+ type: Component,
1404
+ args: [{ selector: 'lib-footer', imports: [TranslateModule], template: "<footer class=\"footer\">\r\n <div class=\"footer-logo-list\">\r\n <p class=\"container text-white\">{{ 'components.footer.version' | translate }}: {{ version }}</p>\r\n </div>\r\n</footer>\r\n", styles: [".footer{background:#d7d7d7}.footer .footer-links a{word-break:break-word}.footer .footer-logo-list{background:#000;height:5rem}\n"] }]
1405
+ }], ctorParameters: () => [{ type: i1$1.MessageService }, { type: i2.TranslateService }, { type: i1$2.Router }], propDecorators: { version: [{
1406
+ type: Input
1407
+ }] } });
1408
+
1409
+ class MainMenuComponent {
1410
+ openNavigation = false;
1411
+ navLinkList;
1412
+ buttonTitle = 'Vsebine';
1413
+ mainMenuTitle = 'Področja';
1414
+ /**
1415
+ * toggle menu
1416
+ */
1417
+ openMenu() {
1418
+ this.openNavigation = !this.openNavigation;
1419
+ }
1420
+ /**
1421
+ * Listen to all clickEvents and if menu is open, and you click outside the menu or toggle-menu-button the close menu
1422
+ * @param event MouseEvent, click
1423
+ */
1424
+ onClick(event) {
1425
+ if (this.openNavigation) {
1426
+ const menuContainer = document.querySelector('.menu-container');
1427
+ const navContainer = document.getElementById('toggle-menu-button');
1428
+ if (menuContainer &&
1429
+ navContainer &&
1430
+ !menuContainer.contains(event.target) &&
1431
+ !navContainer.contains(event.target)) {
1432
+ this.openNavigation = false;
1433
+ }
1434
+ }
1435
+ }
1436
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: MainMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1437
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.6", type: MainMenuComponent, isStandalone: true, selector: "lib-main-menu", inputs: { navLinkList: "navLinkList", buttonTitle: "buttonTitle", mainMenuTitle: "mainMenuTitle" }, host: { listeners: { "document:click": "onClick($event)" } }, ngImport: i0, template: "<nav class=\"navigation flex align-items-center\">\r\n <div class=\"nav-container\">\r\n <p-button id=\"toggle-menu-button\" aria-label=\"Click to open\" [ngClass]=\"{'openNavStyle': openNavigation}\"\r\n [label]=\"buttonTitle\"\r\n icon=\"pi pi-chevron-{{openNavigation ? 'up' : 'down'}}\" iconPos=\"right\" styleClass=\"p-button-text\"\r\n (click)=\"openMenu()\"></p-button>\r\n </div>\r\n</nav>\r\n\r\n<div *ngIf=\"openNavigation\" class=\"menu-container flex justify-content-center\" aria-expanded=\"true\">\r\n <div class=\"container grid p-0 m-0\">\r\n <h5 class=\"text-lg font-normal col-12 mb-3\">{{ mainMenuTitle | uppercase}}</h5>\r\n <div class=\"footer-links col-12 md:col-6 lg:col-4 xl:col-2\" *ngFor=\"let navColumn of navLinkList\">\r\n <ul>\r\n <li class=\"pb-1\" *ngFor=\"let link of navColumn.columnLinkList\">\r\n <span class=\"arrow-link\"></span><a href=\"#\" class=\"link\">{{ link }}</a>\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: [".navigation{position:relative;height:3.5rem;background:#d7d7d7;width:100%;border-bottom:1px solid #cccccc;display:flex;justify-content:center}.nav-container{max-width:1200px;width:100%}.menu-container{z-index:10000;position:absolute;height:max-content;background:#fff;width:100%;padding:20px;box-shadow:0 6px 5px #1b495a4d}:host ::ng-deep .p-button{border-radius:0!important;height:3.5rem}.openNavStyle{display:inline-block;background:#fff!important;height:100%!important;width:max-content}\n"], dependencies: [{ kind: "component", type: Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "autofocus", "fluid", "buttonProps"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "pipe", type: UpperCasePipe, name: "uppercase" }] });
1438
+ }
1439
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: MainMenuComponent, decorators: [{
1440
+ type: Component,
1441
+ args: [{ selector: 'lib-main-menu', imports: [
1442
+ Button,
1443
+ NgClass,
1444
+ NgIf,
1445
+ NgFor,
1446
+ UpperCasePipe,
1447
+ ], template: "<nav class=\"navigation flex align-items-center\">\r\n <div class=\"nav-container\">\r\n <p-button id=\"toggle-menu-button\" aria-label=\"Click to open\" [ngClass]=\"{'openNavStyle': openNavigation}\"\r\n [label]=\"buttonTitle\"\r\n icon=\"pi pi-chevron-{{openNavigation ? 'up' : 'down'}}\" iconPos=\"right\" styleClass=\"p-button-text\"\r\n (click)=\"openMenu()\"></p-button>\r\n </div>\r\n</nav>\r\n\r\n<div *ngIf=\"openNavigation\" class=\"menu-container flex justify-content-center\" aria-expanded=\"true\">\r\n <div class=\"container grid p-0 m-0\">\r\n <h5 class=\"text-lg font-normal col-12 mb-3\">{{ mainMenuTitle | uppercase}}</h5>\r\n <div class=\"footer-links col-12 md:col-6 lg:col-4 xl:col-2\" *ngFor=\"let navColumn of navLinkList\">\r\n <ul>\r\n <li class=\"pb-1\" *ngFor=\"let link of navColumn.columnLinkList\">\r\n <span class=\"arrow-link\"></span><a href=\"#\" class=\"link\">{{ link }}</a>\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: [".navigation{position:relative;height:3.5rem;background:#d7d7d7;width:100%;border-bottom:1px solid #cccccc;display:flex;justify-content:center}.nav-container{max-width:1200px;width:100%}.menu-container{z-index:10000;position:absolute;height:max-content;background:#fff;width:100%;padding:20px;box-shadow:0 6px 5px #1b495a4d}:host ::ng-deep .p-button{border-radius:0!important;height:3.5rem}.openNavStyle{display:inline-block;background:#fff!important;height:100%!important;width:max-content}\n"] }]
1448
+ }], propDecorators: { navLinkList: [{
1449
+ type: Input
1450
+ }], buttonTitle: [{
1451
+ type: Input
1452
+ }], mainMenuTitle: [{
1453
+ type: Input
1454
+ }], onClick: [{
1455
+ type: HostListener,
1456
+ args: ['document:click', ['$event']]
1457
+ }] } });
1458
+
1459
+ class CheckboxComponent {
1460
+ label;
1461
+ group;
1462
+ controlName;
1463
+ value = false;
1464
+ clickCheckboxEvent = new EventEmitter();
1465
+ formStatus;
1466
+ ariaLabel = '';
1467
+ /**
1468
+ * Emit event on checkbox click
1469
+ * @param event
1470
+ */
1471
+ clickCheckbox(event) {
1472
+ this.clickCheckboxEvent.emit(event);
1473
+ event.stopPropagation();
1474
+ }
1475
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: CheckboxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1476
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.6", type: CheckboxComponent, isStandalone: true, selector: "lib-checkbox[group][controlName][label]", inputs: { label: "label", group: "group", controlName: "controlName", value: "value", formStatus: "formStatus", ariaLabel: "ariaLabel" }, outputs: { clickCheckboxEvent: "clickCheckboxEvent" }, ngImport: i0, template: "<div [formGroup]=\"group\">\r\n <p-checkbox [binary]=\"true\"\r\n (click)=\"clickCheckbox($event)\"\r\n [formControlName]=\"controlName\"\r\n [value]=\"value\"\r\n [inputId]=\"controlName\" \r\n [ariaLabel]=\"ariaLabel\"\r\n ></p-checkbox>\r\n <label [for]=\"controlName\" class=\"ml-2\">{{ label }}</label>\r\n</div>\r\n", styles: [""], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: Checkbox, selector: "p-checkbox, p-checkBox, p-check-box", inputs: ["value", "name", "disabled", "binary", "ariaLabelledBy", "ariaLabel", "tabindex", "inputId", "style", "inputStyle", "styleClass", "inputClass", "indeterminate", "size", "formControl", "checkboxIcon", "readonly", "required", "autofocus", "trueValue", "falseValue", "variant"], outputs: ["onChange", "onFocus", "onBlur"] }] });
1477
+ }
1478
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: CheckboxComponent, decorators: [{
1479
+ type: Component,
1480
+ args: [{ selector: 'lib-checkbox[group][controlName][label]', imports: [
1481
+ FormsModule,
1482
+ ReactiveFormsModule,
1483
+ Checkbox,
1484
+ ], template: "<div [formGroup]=\"group\">\r\n <p-checkbox [binary]=\"true\"\r\n (click)=\"clickCheckbox($event)\"\r\n [formControlName]=\"controlName\"\r\n [value]=\"value\"\r\n [inputId]=\"controlName\" \r\n [ariaLabel]=\"ariaLabel\"\r\n ></p-checkbox>\r\n <label [for]=\"controlName\" class=\"ml-2\">{{ label }}</label>\r\n</div>\r\n" }]
1485
+ }], propDecorators: { label: [{
1486
+ type: Input
1487
+ }], group: [{
1488
+ type: Input
1489
+ }], controlName: [{
1490
+ type: Input
1491
+ }], value: [{
1492
+ type: Input
1493
+ }], clickCheckboxEvent: [{
1494
+ type: Output
1495
+ }], formStatus: [{
1496
+ type: Input
1497
+ }], ariaLabel: [{
1498
+ type: Input
1499
+ }] } });
1500
+
1501
+ class ConfirmModalComponent {
1502
+ acceptBtnLabel = 'Da';
1503
+ acceptBtnIcon = 'pi pi-check';
1504
+ rejectBtnLabel = 'Ne';
1505
+ rejectBtnIcon = 'pi pi-times';
1506
+ dialogHeaderColor = DialogColor.danger;
1507
+ rejectClickEvent = new EventEmitter();
1508
+ acceptClickEvent = new EventEmitter();
1509
+ headerClassMap = {
1510
+ primary: 'primary',
1511
+ secondary: 'secondary',
1512
+ info: 'info',
1513
+ warning: 'warning',
1514
+ danger: 'danger',
1515
+ };
1516
+ reject(event) {
1517
+ this.rejectClickEvent.emit(event);
1518
+ }
1519
+ accept(event) {
1520
+ this.acceptClickEvent.emit(event);
1521
+ }
1522
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ConfirmModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1523
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.6", type: ConfirmModalComponent, isStandalone: true, selector: "lib-confirm-modal", inputs: { acceptBtnLabel: "acceptBtnLabel", acceptBtnIcon: "acceptBtnIcon", rejectBtnLabel: "rejectBtnLabel", rejectBtnIcon: "rejectBtnIcon", dialogHeaderColor: "dialogHeaderColor" }, outputs: { rejectClickEvent: "rejectClickEvent", acceptClickEvent: "acceptClickEvent" }, ngImport: i0, template: "<p-confirmdialog [ngClass]=\"headerClassMap[dialogHeaderColor]\"\r\n #cd [style]=\"{width: 'max-content'}\">\r\n <ng-template pTemplate=\"footer\">\r\n <div class=\"confirm-button-container\">\r\n <p-button styleClass=\"p-button-danger\" [icon]=\"rejectBtnIcon\" [label]=\"rejectBtnLabel\" (click)=\"reject($event);\"></p-button>\r\n <p-button styleClass=\"p-button-primary\" [icon]=\"acceptBtnIcon\" [label]=\"acceptBtnLabel\" (click)=\"accept($event);\"></p-button>\r\n </div>\r\n </ng-template>\r\n</p-confirmdialog>\r\n", styles: [":host ::ng-deep .primary .p-dialog .p-dialog-header{background:#3e7c94!important;color:#fff!important}:host ::ng-deep .primary .p-dialog .p-dialog-header .p-dialog-header-icon{color:#fff!important}:host ::ng-deep .info .p-dialog .p-dialog-header{background:#529bda!important;color:#fff!important}:host ::ng-deep .info .p-dialog .p-dialog-header .p-dialog-header-icon{color:#fff!important}:host ::ng-deep .secondary .p-dialog .p-dialog-header{background:#facd9c!important}:host ::ng-deep .warning .p-dialog .p-dialog-header{background:#fdca40!important}:host ::ng-deep .danger .p-dialog .p-dialog-header{background:#b2414d!important;color:#fff!important}:host ::ng-deep .danger .p-dialog .p-dialog-header .p-dialog-header-icon{color:#fff!important}:host ::ng-deep .p-dialog{width:25vw!important}@media screen and (max-width: 768px){:host ::ng-deep .p-dialog{width:85vw!important}}:host ::ng-deep .p-dialog .p-dialog-header{border:none!important}:host ::ng-deep .p-dialog .p-dialog-header .p-dialog-header-icon{color:#fff!important}@media screen and (max-width: 768px){:host ::ng-deep .p-dialog .p-dialog-header .p-dialog-title{font-weight:500;font-size:1rem}}:host ::ng-deep .p-dialog .p-dialog-footer .confirm-button-container{width:100%;display:flex;justify-content:space-between}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "ngmodule", type: ConfirmDialogModule }, { kind: "component", type: i1$5.ConfirmDialog, selector: "p-confirmDialog, p-confirmdialog, p-confirm-dialog", inputs: ["header", "icon", "message", "style", "styleClass", "maskStyleClass", "acceptIcon", "acceptLabel", "closeAriaLabel", "acceptAriaLabel", "acceptVisible", "rejectIcon", "rejectLabel", "rejectAriaLabel", "rejectVisible", "acceptButtonStyleClass", "rejectButtonStyleClass", "closeOnEscape", "dismissableMask", "blockScroll", "rtl", "closable", "appendTo", "key", "autoZIndex", "baseZIndex", "transitionOptions", "focusTrap", "defaultFocus", "breakpoints", "visible", "position", "draggable"], outputs: ["onHide"] }, { kind: "component", type: Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "autofocus", "fluid", "buttonProps"], outputs: ["onClick", "onFocus", "onBlur"] }] });
1524
+ }
1525
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ConfirmModalComponent, decorators: [{
1526
+ type: Component,
1527
+ args: [{ selector: 'lib-confirm-modal', imports: [
1528
+ NgClass,
1529
+ PrimeTemplate,
1530
+ ConfirmDialogModule,
1531
+ Button,
1532
+ ], template: "<p-confirmdialog [ngClass]=\"headerClassMap[dialogHeaderColor]\"\r\n #cd [style]=\"{width: 'max-content'}\">\r\n <ng-template pTemplate=\"footer\">\r\n <div class=\"confirm-button-container\">\r\n <p-button styleClass=\"p-button-danger\" [icon]=\"rejectBtnIcon\" [label]=\"rejectBtnLabel\" (click)=\"reject($event);\"></p-button>\r\n <p-button styleClass=\"p-button-primary\" [icon]=\"acceptBtnIcon\" [label]=\"acceptBtnLabel\" (click)=\"accept($event);\"></p-button>\r\n </div>\r\n </ng-template>\r\n</p-confirmdialog>\r\n", styles: [":host ::ng-deep .primary .p-dialog .p-dialog-header{background:#3e7c94!important;color:#fff!important}:host ::ng-deep .primary .p-dialog .p-dialog-header .p-dialog-header-icon{color:#fff!important}:host ::ng-deep .info .p-dialog .p-dialog-header{background:#529bda!important;color:#fff!important}:host ::ng-deep .info .p-dialog .p-dialog-header .p-dialog-header-icon{color:#fff!important}:host ::ng-deep .secondary .p-dialog .p-dialog-header{background:#facd9c!important}:host ::ng-deep .warning .p-dialog .p-dialog-header{background:#fdca40!important}:host ::ng-deep .danger .p-dialog .p-dialog-header{background:#b2414d!important;color:#fff!important}:host ::ng-deep .danger .p-dialog .p-dialog-header .p-dialog-header-icon{color:#fff!important}:host ::ng-deep .p-dialog{width:25vw!important}@media screen and (max-width: 768px){:host ::ng-deep .p-dialog{width:85vw!important}}:host ::ng-deep .p-dialog .p-dialog-header{border:none!important}:host ::ng-deep .p-dialog .p-dialog-header .p-dialog-header-icon{color:#fff!important}@media screen and (max-width: 768px){:host ::ng-deep .p-dialog .p-dialog-header .p-dialog-title{font-weight:500;font-size:1rem}}:host ::ng-deep .p-dialog .p-dialog-footer .confirm-button-container{width:100%;display:flex;justify-content:space-between}\n"] }]
1533
+ }], propDecorators: { acceptBtnLabel: [{
1534
+ type: Input
1535
+ }], acceptBtnIcon: [{
1536
+ type: Input
1537
+ }], rejectBtnLabel: [{
1538
+ type: Input
1539
+ }], rejectBtnIcon: [{
1540
+ type: Input
1541
+ }], dialogHeaderColor: [{
1542
+ type: Input
1543
+ }], rejectClickEvent: [{
1544
+ type: Output
1545
+ }], acceptClickEvent: [{
1546
+ type: Output
1547
+ }] } });
1548
+
1549
+ /**
1550
+ * Checks if the provided object is empty (has no properties of its own)
1551
+ *
1552
+ * @param {object} obj - The object to check
1553
+ * @returns {boolean} - Returns true if the object is empty, false otherwise
1554
+ */
1555
+ function isEmpty(obj) {
1556
+ return Object.keys(obj).length === 0 && obj.constructor === Object;
1557
+ }
1558
+
1559
+ var CaptionColor;
1560
+ (function (CaptionColor) {
1561
+ CaptionColor["today"] = "today";
1562
+ CaptionColor["past"] = "past";
1563
+ CaptionColor["future"] = "future";
1564
+ })(CaptionColor || (CaptionColor = {}));
1565
+
1566
+ var TagColor;
1567
+ (function (TagColor) {
1568
+ TagColor["success"] = "success";
1569
+ TagColor["secondary"] = "secondary";
1570
+ TagColor["info"] = "info";
1571
+ TagColor["warning"] = "warning";
1572
+ TagColor["danger"] = "danger";
1573
+ TagColor["contrast"] = "contrast";
1574
+ })(TagColor || (TagColor = {}));
1575
+
1576
+ class ToggleSwitchComponent {
1577
+ group;
1578
+ controlName;
1579
+ isFormElement = true;
1580
+ checked;
1581
+ getValueEvent = new EventEmitter();
1582
+ checkedChanged = new EventEmitter();
1583
+ disabled;
1584
+ toggleValue($event, isForm) {
1585
+ this.getValueEvent.emit($event);
1586
+ if (!isForm) {
1587
+ this.handleToggle();
1588
+ }
1589
+ }
1590
+ changeChecked(newToggleValue) {
1591
+ this.checked = newToggleValue;
1592
+ this.checkedChanged.emit(this.checked);
1593
+ }
1594
+ handleToggle() {
1595
+ this.changeChecked(false);
1596
+ }
1597
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ToggleSwitchComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1598
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.6", type: ToggleSwitchComponent, isStandalone: true, selector: "lib-toggle-switch", inputs: { group: "group", controlName: "controlName", isFormElement: "isFormElement", checked: "checked", disabled: "disabled" }, outputs: { getValueEvent: "getValueEvent", checkedChanged: "checkedChanged" }, ngImport: i0, template: "<div class=\"flex flex-column mt-2\" [formGroup]=\"group\" *ngIf=\"isFormElement\">\r\n <p-toggleswitch\r\n (onChange)=\"toggleValue($event, true)\"\r\n [formControlName]=\"controlName\"\r\n ></p-toggleswitch>\r\n</div>\r\n<div class=\"flex flex-column mt-2\" *ngIf=\"!isFormElement\">\r\n <p-toggleswitch [disabled]=\"disabled\" [(ngModel)]=\"checked\" (onChange)=\"toggleValue($event, false)\"></p-toggleswitch>\r\n</div>\r\n", styles: [":host ::ng-deep .p-toggleswitch.p-toggleswitch-checked .p-toggleswitch-slider{background:#3e7c94!important}:host ::ng-deep .p-toggleswitch .p-toggleswitch-slider{border-radius:15px;background:#d7d7d7!important}:host ::ng-deep .p-toggleswitch .p-toggleswitch-slider:before{border-radius:50%}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: ToggleSwitchModule }, { kind: "component", type: i2$3.ToggleSwitch, selector: "p-toggleswitch, p-toggleSwitch, p-toggle-switch", inputs: ["style", "styleClass", "tabindex", "inputId", "name", "disabled", "readonly", "trueValue", "falseValue", "ariaLabel", "ariaLabelledBy", "autofocus"], outputs: ["onChange"] }] });
1599
+ }
1600
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ToggleSwitchComponent, decorators: [{
1601
+ type: Component,
1602
+ args: [{ selector: 'lib-toggle-switch', imports: [
1603
+ NgIf,
1604
+ FormsModule,
1605
+ ReactiveFormsModule,
1606
+ ToggleSwitchModule,
1607
+ ], template: "<div class=\"flex flex-column mt-2\" [formGroup]=\"group\" *ngIf=\"isFormElement\">\r\n <p-toggleswitch\r\n (onChange)=\"toggleValue($event, true)\"\r\n [formControlName]=\"controlName\"\r\n ></p-toggleswitch>\r\n</div>\r\n<div class=\"flex flex-column mt-2\" *ngIf=\"!isFormElement\">\r\n <p-toggleswitch [disabled]=\"disabled\" [(ngModel)]=\"checked\" (onChange)=\"toggleValue($event, false)\"></p-toggleswitch>\r\n</div>\r\n", styles: [":host ::ng-deep .p-toggleswitch.p-toggleswitch-checked .p-toggleswitch-slider{background:#3e7c94!important}:host ::ng-deep .p-toggleswitch .p-toggleswitch-slider{border-radius:15px;background:#d7d7d7!important}:host ::ng-deep .p-toggleswitch .p-toggleswitch-slider:before{border-radius:50%}\n"] }]
1608
+ }], propDecorators: { group: [{
1609
+ type: Input
1610
+ }], controlName: [{
1611
+ type: Input
1612
+ }], isFormElement: [{
1613
+ type: Input
1614
+ }], checked: [{
1615
+ type: Input
1616
+ }], getValueEvent: [{
1617
+ type: Output
1618
+ }], checkedChanged: [{
1619
+ type: Output
1620
+ }], disabled: [{
1621
+ type: Input
1622
+ }] } });
1623
+
1624
+ class TagComponent {
1625
+ tagText;
1626
+ tagColor = TagColor.success;
1627
+ rounded = true;
1628
+ getColor() {
1629
+ return this.tagColor;
1630
+ }
1631
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: TagComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1632
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.6", type: TagComponent, isStandalone: true, selector: "lib-tag", inputs: { tagText: "tagText", tagColor: "tagColor", rounded: "rounded" }, ngImport: i0, template: "<p-tag\r\n [value]=\"tagText\"\r\n [severity]=\"getColor()\"\r\n [rounded]=\"rounded\"\r\n></p-tag>\r\n", styles: [""], dependencies: [{ kind: "component", type: Tag, selector: "p-tag", inputs: ["style", "styleClass", "severity", "value", "icon", "rounded"] }] });
1633
+ }
1634
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: TagComponent, decorators: [{
1635
+ type: Component,
1636
+ args: [{ selector: 'lib-tag', imports: [Tag], template: "<p-tag\r\n [value]=\"tagText\"\r\n [severity]=\"getColor()\"\r\n [rounded]=\"rounded\"\r\n></p-tag>\r\n" }]
1637
+ }], propDecorators: { tagText: [{
1638
+ type: Input
1639
+ }], tagColor: [{
1640
+ type: Input
1641
+ }], rounded: [{
1642
+ type: Input
1643
+ }] } });
1644
+
1645
+ class ButtonLinkComponent {
1646
+ hasIcon = false;
1647
+ label;
1648
+ isDanger = false;
1649
+ isPrimary = false;
1650
+ icon = 'pi-check';
1651
+ target;
1652
+ accessibilityText = '';
1653
+ clickEvent = new EventEmitter();
1654
+ click(event) {
1655
+ this.clickEvent.emit(event);
1656
+ }
1657
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ButtonLinkComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1658
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.6", type: ButtonLinkComponent, isStandalone: true, selector: "lib-button-link", inputs: { hasIcon: "hasIcon", label: "label", isDanger: "isDanger", isPrimary: "isPrimary", icon: "icon", target: "target", accessibilityText: "accessibilityText" }, outputs: { clickEvent: "clickEvent" }, ngImport: i0, template: "<ng-container *ngIf=\"isDanger\">\r\n <a href=\"#\"\r\n [target]=\"target\"\r\n [attr.aria-label]=\"accessibilityText\"\r\n (click)='click($event)'\r\n class=\"p-button-link p-button-link-danger text-center\">\r\n {{ label }} <i *ngIf=\"hasIcon\" class=\"pi\" [ngClass]=\"icon\"></i>\r\n </a>\r\n</ng-container>\r\n<ng-container *ngIf=\"isPrimary\">\r\n <a href=\"#\"\r\n [target]=\"target\"\r\n [attr.aria-label]=\"accessibilityText\"\r\n (click)='click($event)'\r\n class=\"p-button-link p-button-link-primary text-center\">\r\n {{ label }} <i *ngIf=\"hasIcon\" class=\"pi\" [ngClass]=\"icon\"></i>\r\n </a>\r\n</ng-container>\r\n\r\n", styles: [".p-button-link{border-radius:0;padding:.5rem .4rem;width:100%;text-decoration:none;display:block}.p-button-link.p-button-link-danger{background:#b2414d;color:#fff}.p-button-link.p-button-link-danger:focus{outline:none;box-shadow:0 0 0 .2rem #facd9c}.p-button-link.p-button-link-primary{background:#3e7c94;color:#fff}.p-button-link.p-button-link-primary:focus{outline:none;box-shadow:0 0 0 .2rem #facd9c}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
1659
+ }
1660
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ButtonLinkComponent, decorators: [{
1661
+ type: Component,
1662
+ args: [{ selector: 'lib-button-link', imports: [NgIf, NgClass], template: "<ng-container *ngIf=\"isDanger\">\r\n <a href=\"#\"\r\n [target]=\"target\"\r\n [attr.aria-label]=\"accessibilityText\"\r\n (click)='click($event)'\r\n class=\"p-button-link p-button-link-danger text-center\">\r\n {{ label }} <i *ngIf=\"hasIcon\" class=\"pi\" [ngClass]=\"icon\"></i>\r\n </a>\r\n</ng-container>\r\n<ng-container *ngIf=\"isPrimary\">\r\n <a href=\"#\"\r\n [target]=\"target\"\r\n [attr.aria-label]=\"accessibilityText\"\r\n (click)='click($event)'\r\n class=\"p-button-link p-button-link-primary text-center\">\r\n {{ label }} <i *ngIf=\"hasIcon\" class=\"pi\" [ngClass]=\"icon\"></i>\r\n </a>\r\n</ng-container>\r\n\r\n", styles: [".p-button-link{border-radius:0;padding:.5rem .4rem;width:100%;text-decoration:none;display:block}.p-button-link.p-button-link-danger{background:#b2414d;color:#fff}.p-button-link.p-button-link-danger:focus{outline:none;box-shadow:0 0 0 .2rem #facd9c}.p-button-link.p-button-link-primary{background:#3e7c94;color:#fff}.p-button-link.p-button-link-primary:focus{outline:none;box-shadow:0 0 0 .2rem #facd9c}\n"] }]
1663
+ }], propDecorators: { hasIcon: [{
1664
+ type: Input
1665
+ }], label: [{
1666
+ type: Input
1667
+ }], isDanger: [{
1668
+ type: Input
1669
+ }], isPrimary: [{
1670
+ type: Input
1671
+ }], icon: [{
1672
+ type: Input
1673
+ }], target: [{
1674
+ type: Input
1675
+ }], accessibilityText: [{
1676
+ type: Input
1677
+ }], clickEvent: [{
1678
+ type: Output
1679
+ }] } });
1680
+
1681
+ class CustomTableComponent {
1682
+ table;
1683
+ // Table configuration
1684
+ tableData;
1685
+ tableColumns = [];
1686
+ isPaginatorVisible = false;
1687
+ tableRowCount = 10;
1688
+ scrollable = false;
1689
+ scrollHeight;
1690
+ selectedProducts = [];
1691
+ isEditingTable = false;
1692
+ isTableLoading = false;
1693
+ hideColumnsOnMobile = false;
1694
+ tableMinWidth = '15rem';
1695
+ isVirtualScrollButtonVisible = false;
1696
+ isVirtualScroll = false;
1697
+ virtualScrollRowSize = 60;
1698
+ // Caption
1699
+ tableCaption;
1700
+ captionColorClass = CaptionColor.today;
1701
+ isCaptionButtonVisible = false;
1702
+ captionButtonLabel;
1703
+ captionButtonColor = ButtonColor.primary;
1704
+ captionButtonClicked = new EventEmitter();
1705
+ // Table header
1706
+ isTableHeaderVisible = true;
1707
+ emptyHeaderColumnList = [];
1708
+ emptyColumnWidth;
1709
+ // Disable switch - toggle
1710
+ toggleTableHeaderName;
1711
+ toggleWidth = '100px';
1712
+ toggleTwoTableHeaderName;
1713
+ toggleTwoWidth = '100px';
1714
+ toggleThreeTableHeaderName;
1715
+ toggleThreeWidth = '100px';
1716
+ toggleFourTableHeaderName;
1717
+ toggleFourWidth = '100px';
1718
+ // Row color
1719
+ rowColor = '';
1720
+ // Form stuff
1721
+ formGroup;
1722
+ // Input
1723
+ type = InputType.text;
1724
+ formStatus;
1725
+ // Tag
1726
+ tagColor = TagColor.success;
1727
+ // Warning text in first column
1728
+ isWarningTextVisible = false;
1729
+ // Button column one
1730
+ isButtonOneVisible = false;
1731
+ buttonLabel;
1732
+ buttonOneLabel;
1733
+ buttonOneHasIcon;
1734
+ buttonOneEditIcon;
1735
+ buttonOneSaveIcon;
1736
+ buttonOneColor;
1737
+ buttonOneIcon;
1738
+ isPlainTableIconButtonOne;
1739
+ isPlainTableButtonOneLink = false;
1740
+ buttonEditClick = new EventEmitter();
1741
+ buttonSaveClick = new EventEmitter();
1742
+ buttonOneClick = new EventEmitter();
1743
+ // Button column two
1744
+ isButtonTwoVisible = false;
1745
+ buttonTwoLabel;
1746
+ buttonTwoHasIcon;
1747
+ buttonTwoDeleteIcon;
1748
+ buttonTwoCancelIcon;
1749
+ buttonTwoColor;
1750
+ buttonTwoIcon;
1751
+ isPlainTableIconButtonTwo;
1752
+ buttonDeleteClick = new EventEmitter();
1753
+ buttonTwoClick = new EventEmitter();
1754
+ // Deactivate toggle
1755
+ isDeactivateToggle = false;
1756
+ toggleSwitch = new EventEmitter();
1757
+ isDeactivateToggleTwo = false;
1758
+ toggleTwoSwitch = new EventEmitter();
1759
+ isDeactivateToggleThree = false;
1760
+ toggleThreeSwitch = new EventEmitter();
1761
+ isDeactivateToggleFour = false;
1762
+ toggleFourSwitch = new EventEmitter();
1763
+ showEllipsisFullText = false;
1764
+ checkboxOne = new EventEmitter();
1765
+ textDisplayStates = {};
1766
+ overviewList = [
1767
+ { name: 'Moje naloge', value: 'Item1' },
1768
+ { name: 'Zapadle naloge', value: 'Item1' },
1769
+ { name: 'Tuje naloge', value: 'Item1' },
1770
+ { name: 'Oddane naloge', value: 'Item1' },
1771
+ ];
1772
+ // Editing table - BUTTONS
1773
+ onRowEdit(event) {
1774
+ this.table.editingRowKeys = { [event.id]: true };
1775
+ this.buttonEditClick.emit(event);
1776
+ }
1777
+ onRowSave(event, htmlTableRowElement) {
1778
+ this.buttonSaveClick.emit(event);
1779
+ setTimeout(() => {
1780
+ this.table.saveRowEdit(event, htmlTableRowElement);
1781
+ }, 200);
1782
+ }
1783
+ onRowDelete(event) {
1784
+ this.buttonDeleteClick.emit(event);
1785
+ }
1786
+ onRowCancel(event) {
1787
+ this.table.cancelRowEdit(event);
1788
+ }
1789
+ // Caption
1790
+ clickCaptionButton(event) {
1791
+ this.captionButtonClicked.emit(event);
1792
+ }
1793
+ // Button column one
1794
+ clickButtonOne(event) {
1795
+ this.buttonOneClick.emit(event);
1796
+ }
1797
+ // Button column one
1798
+ clickButtonTwo(event) {
1799
+ this.buttonTwoClick.emit(event);
1800
+ }
1801
+ // Deactivate toggle
1802
+ toggleEnable(event) {
1803
+ if (!event.$event.checked) {
1804
+ setTimeout(() => {
1805
+ this.onRowCancel(event.rowData);
1806
+ }, 100);
1807
+ }
1808
+ this.toggleSwitch.emit(event);
1809
+ }
1810
+ toggleTwoEnable(event) {
1811
+ if (!event.$event.checked) {
1812
+ setTimeout(() => {
1813
+ this.onRowCancel(event.rowData);
1814
+ }, 100);
1815
+ }
1816
+ this.toggleTwoSwitch.emit(event);
1817
+ }
1818
+ toggleThreeEnable(event) {
1819
+ if (!event.$event.checked) {
1820
+ setTimeout(() => {
1821
+ this.onRowCancel(event.rowData);
1822
+ }, 100);
1823
+ }
1824
+ this.toggleThreeSwitch.emit(event);
1825
+ }
1826
+ toggleFourEnable(event) {
1827
+ if (!event.$event.checked) {
1828
+ setTimeout(() => {
1829
+ this.onRowCancel(event.rowData);
1830
+ }, 100);
1831
+ }
1832
+ this.toggleFourSwitch.emit(event);
1833
+ }
1834
+ clickCheckboxOne(event, fieldValue) {
1835
+ this.checkboxOne.emit({ event: event, fieldValue: fieldValue });
1836
+ }
1837
+ // Helper method for nested field structures
1838
+ getNestedValue(data, field) {
1839
+ if (!field) {
1840
+ return null;
1841
+ }
1842
+ const fields = field.split('.');
1843
+ let value = data;
1844
+ for (const f of fields) {
1845
+ // eslint-disable-next-line no-prototype-builtins
1846
+ if (value && value.hasOwnProperty(f)) {
1847
+ value = value[f];
1848
+ }
1849
+ else {
1850
+ return null;
1851
+ }
1852
+ }
1853
+ return value;
1854
+ }
1855
+ isMobile() {
1856
+ return window.innerWidth <= 768;
1857
+ }
1858
+ ngOnInit() {
1859
+ const conditions = [this.isButtonOneVisible, this.isButtonTwoVisible];
1860
+ conditions.forEach((condition) => {
1861
+ if (condition) {
1862
+ this.emptyHeaderColumnList.push('');
1863
+ }
1864
+ });
1865
+ }
1866
+ /**
1867
+ * da skrije/prikaže poln oz. skrajšan tekst na 50 znakov
1868
+ * TODO: zaenkrat izpuščeno
1869
+ */
1870
+ toggleTextDisplay(rowData) {
1871
+ if (!this.textDisplayStates.hasOwnProperty(rowData.id)) {
1872
+ this.textDisplayStates[rowData.id] = false; // default je komplet tekst
1873
+ }
1874
+ this.textDisplayStates[rowData.id] = !this.textDisplayStates[rowData.id];
1875
+ }
1876
+ /**
1877
+ * da skrije/prikaže poln oz. skrajšan tekst na 50 znakov
1878
+ * TODO: zaenkrat izpuščeno
1879
+ */
1880
+ getDisplayText(rowData, field) {
1881
+ const isShortened = this.textDisplayStates[rowData.id];
1882
+ const text = this.getNestedValue(rowData, field);
1883
+ if (!isShortened || text.length <= 50) {
1884
+ return text; // poln text je default
1885
+ }
1886
+ else {
1887
+ return text.substring(0, 50) + ' ...'; // skrajšan text
1888
+ }
1889
+ }
1890
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: CustomTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1891
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.6", type: CustomTableComponent, isStandalone: true, selector: "lib-custom-table[tableData][tableColumns]", inputs: { tableData: "tableData", tableColumns: "tableColumns", isPaginatorVisible: "isPaginatorVisible", tableRowCount: "tableRowCount", scrollable: "scrollable", scrollHeight: "scrollHeight", selectedProducts: "selectedProducts", isEditingTable: "isEditingTable", isTableLoading: "isTableLoading", hideColumnsOnMobile: "hideColumnsOnMobile", tableMinWidth: "tableMinWidth", isVirtualScrollButtonVisible: "isVirtualScrollButtonVisible", isVirtualScroll: "isVirtualScroll", virtualScrollRowSize: "virtualScrollRowSize", tableCaption: "tableCaption", captionColorClass: "captionColorClass", isCaptionButtonVisible: "isCaptionButtonVisible", captionButtonLabel: "captionButtonLabel", captionButtonColor: "captionButtonColor", isTableHeaderVisible: "isTableHeaderVisible", emptyColumnWidth: "emptyColumnWidth", toggleTableHeaderName: "toggleTableHeaderName", toggleWidth: "toggleWidth", toggleTwoTableHeaderName: "toggleTwoTableHeaderName", toggleTwoWidth: "toggleTwoWidth", toggleThreeTableHeaderName: "toggleThreeTableHeaderName", toggleThreeWidth: "toggleThreeWidth", toggleFourTableHeaderName: "toggleFourTableHeaderName", toggleFourWidth: "toggleFourWidth", rowColor: "rowColor", formGroup: "formGroup", type: "type", formStatus: "formStatus", tagColor: "tagColor", isWarningTextVisible: "isWarningTextVisible", isButtonOneVisible: "isButtonOneVisible", buttonLabel: "buttonLabel", buttonOneLabel: "buttonOneLabel", buttonOneHasIcon: "buttonOneHasIcon", buttonOneEditIcon: "buttonOneEditIcon", buttonOneSaveIcon: "buttonOneSaveIcon", buttonOneColor: "buttonOneColor", buttonOneIcon: "buttonOneIcon", isPlainTableIconButtonOne: "isPlainTableIconButtonOne", isPlainTableButtonOneLink: "isPlainTableButtonOneLink", isButtonTwoVisible: "isButtonTwoVisible", buttonTwoLabel: "buttonTwoLabel", buttonTwoHasIcon: "buttonTwoHasIcon", buttonTwoDeleteIcon: "buttonTwoDeleteIcon", buttonTwoCancelIcon: "buttonTwoCancelIcon", buttonTwoColor: "buttonTwoColor", buttonTwoIcon: "buttonTwoIcon", isPlainTableIconButtonTwo: "isPlainTableIconButtonTwo", isDeactivateToggle: "isDeactivateToggle", isDeactivateToggleTwo: "isDeactivateToggleTwo", isDeactivateToggleThree: "isDeactivateToggleThree", isDeactivateToggleFour: "isDeactivateToggleFour", showEllipsisFullText: "showEllipsisFullText" }, outputs: { captionButtonClicked: "captionButtonClicked", buttonEditClick: "buttonEditClick", buttonSaveClick: "buttonSaveClick", buttonOneClick: "buttonOneClick", buttonDeleteClick: "buttonDeleteClick", buttonTwoClick: "buttonTwoClick", toggleSwitch: "toggleSwitch", toggleTwoSwitch: "toggleTwoSwitch", toggleThreeSwitch: "toggleThreeSwitch", toggleFourSwitch: "toggleFourSwitch", checkboxOne: "checkboxOne" }, viewQueries: [{ propertyName: "table", first: true, predicate: ["dt"], descendants: true }], ngImport: i0, template: "<p-table\r\n #dt\r\n [value]=\"tableData\"\r\n [paginator]=\"isPaginatorVisible\"\r\n [rows]=\"tableRowCount\"\r\n [showCurrentPageReport]=\"false\"\r\n [scrollable]=\"scrollable\"\r\n [scrollHeight]=\"scrollHeight\"\r\n dataKey=\"id\"\r\n editMode=\"row\"\r\n [ngClass]=\"captionColorClass\"\r\n [loading]=\"isTableLoading\"\r\n [tableStyle]=\"{'min-width': tableMinWidth}\"\r\n [virtualScroll]=\"isVirtualScroll\"\r\n [virtualScrollItemSize]=\"virtualScrollRowSize\"\r\n aria-live=\"polite\"\r\n>\r\n <ng-template pTemplate=\"caption\" *ngIf=\"!!tableCaption\">\r\n <div class=\"flex align-items-center justify-content-between\">\r\n {{ tableCaption }}\r\n <span *ngIf=\"isVirtualScrollButtonVisible\"\r\n (click)=\"isVirtualScroll = !isVirtualScroll\"\r\n [ngStyle]=\"{'color': isVirtualScroll ? '' : 'lightgray'}\"\r\n class=\"pi pi-sort cursor-pointer\">\r\n </span>\r\n <lib-button\r\n *ngIf=\"isCaptionButtonVisible\"\r\n [label]=\"captionButtonLabel\"\r\n [color]=\"captionButtonColor\"\r\n (clickEvent)=\"clickCaptionButton($event)\"\r\n ></lib-button>\r\n </div>\r\n </ng-template>\r\n <ng-template pTemplate=\"header\" *ngIf=\"isTableHeaderVisible\">\r\n <tr>\r\n <ng-container *ngFor=\"let column of tableColumns\">\r\n <ng-container *ngIf=\"!(column.hideOnMobile && isMobile() && hideColumnsOnMobile)\">\r\n <th scope=\"col\" [style.width]=\"column.width\">\r\n {{ column.header | translate }}\r\n </th>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <th *ngFor=\"let _ of emptyHeaderColumnList\" [style.width]=\"emptyColumnWidth\" aria-hidden=\"true\"></th>\r\n <th *ngIf=\"!!toggleTableHeaderName\" scope=\"col\" [style.width]=\"toggleWidth\" class=\"vertical-align-middle\">\r\n {{ toggleTableHeaderName }}\r\n </th>\r\n <th *ngIf=\"!!toggleTwoTableHeaderName\" scope=\"col\" [style.width]=\"toggleTwoWidth\" class=\"vertical-align-middle\">\r\n {{ toggleTwoTableHeaderName }}\r\n </th>\r\n <th *ngIf=\"!!toggleThreeTableHeaderName\" scope=\"col\" [style.width]=\"toggleThreeWidth\" class=\"vertical-align-middle\">\r\n {{ toggleThreeTableHeaderName }}\r\n </th>\r\n <th *ngIf=\"!!toggleFourTableHeaderName\" scope=\"col\" [style.width]=\"toggleFourWidth\" class=\"vertical-align-middle\">\r\n {{ toggleFourTableHeaderName }}\r\n </th>\r\n </tr>\r\n </ng-template>\r\n <ng-template pTemplate=\"body\" let-rowData let-editing=\"editing\" let-ri=\"rowIndex\">\r\n <!--\r\n Mare; 2024-09-19: dodajanje logike barvanja rowColor za /cms/notifications, delat mora pa tudi v /vsi-termini\r\n -->\r\n <tr [pEditableRow]=\"rowData\" #htmlTableRowElement\r\n [ngClass]=\"\r\n rowData?.cmsStatus ?\r\n (rowData?.cmsStatus === 'expired' ? 'disabled_row_color' :\r\n rowData?.cmsStatus === 'planned' ? '' :\r\n rowData?.cmsStatus === 'active' ? 'success_row_color' : '') :\r\n (!rowData?.registered ? rowColor : '')\r\n \">\r\n <ng-container *ngFor=\"let column of tableColumns; let colIndex = index\">\r\n <ng-container *ngIf=\"!(column.hideOnMobile && isMobile() && hideColumnsOnMobile)\">\r\n <td [class.disabled-row]=\"rowData?.isEnabled === false || rowData?.isEnabled === null\">\r\n <!-- Text input-->\r\n <ng-container *ngIf=\"column.editable && column.component === 'input'\">\r\n <p-cellEditor>\r\n <ng-template pTemplate=\"input\">\r\n <lib-input\r\n [group]=\"formGroup\"\r\n [controlName]=\"column.field\"\r\n [name]=\"column.field\"\r\n [type]=\"column.inputType ? column.inputType : type\"\r\n placeholder=\"{{ column.placeholder! |translate }}\"\r\n [isRequired]=\"false\"\r\n [formStatus]=\"formStatus\"\r\n [hasGap]=\"false\"\r\n ></lib-input>\r\n </ng-template>\r\n <ng-template pTemplate=\"output\">\r\n <ng-container *ngIf=\"rowData[column.field]; else emptyCell\">\r\n <ng-container *ngIf=\"column.isLink; else notLink\">\r\n <a href=\"{{ rowData[column.field] }}\" target=\"_blank\">\r\n {{ rowData[column.field] }}\r\n </a>\r\n </ng-container>\r\n <ng-template #notLink>\r\n {{ rowData[column.field] }} {{ column?.suffix }}\r\n </ng-template>\r\n </ng-container>\r\n\r\n <ng-template #emptyCell>\r\n /\r\n </ng-template>\r\n </ng-template>\r\n </p-cellEditor>\r\n </ng-container>\r\n\r\n <!-- Date input-->\r\n <ng-container *ngIf=\"column.editable && column.component === 'date'\">\r\n <p-cellEditor>\r\n <ng-template pTemplate=\"input\">\r\n <lib-date-input\r\n appendTo=\"body\"\r\n [group]=\"formGroup\"\r\n [controlName]=\"column.field\"\r\n [name]=\"column.field\"\r\n [setMinAndMax]=\"false\"\r\n [isRequired]=\"false\"\r\n [formStatus]=\"formStatus\"\r\n [hasGap]=\"false\"\r\n placeholder=\"{{ column.placeholder! | translate }}\"\r\n ></lib-date-input>\r\n </ng-template>\r\n <ng-template pTemplate=\"output\">\r\n <ng-container *ngIf=\"rowData[column.field]; else emptyCell\">\r\n {{ rowData[column.field] | date: 'dd.MM.yyyy' }} {{ column?.suffix }}\r\n </ng-container>\r\n <ng-template #emptyCell>\r\n /\r\n </ng-template>\r\n </ng-template>\r\n </p-cellEditor>\r\n </ng-container>\r\n\r\n <!-- Date+Time output-->\r\n <ng-container *ngIf=\"column.editable && column.component === 'dateTime'\">\r\n <p-cellEditor>\r\n <ng-template pTemplate=\"output\">\r\n <ng-container *ngIf=\"rowData[column.field]; else emptyCell\">\r\n {{ rowData[column.field] | date: 'dd.MM.yyyy, HH:mm' }} {{ column?.suffix }}\r\n </ng-container>\r\n <ng-template #emptyCell>\r\n /\r\n </ng-template>\r\n </ng-template>\r\n </p-cellEditor>\r\n </ng-container>\r\n\r\n <!-- TextArea input-->\r\n <ng-container *ngIf=\"column.editable && column.component === 'textarea'\">\r\n <p-cellEditor>\r\n <ng-template pTemplate=\"input\">\r\n <lib-textarea *ngIf=\"column.maxLength === -1\"\r\n [customMaxLength]=\"null\"\r\n [group]=\"formGroup\"\r\n [controlName]=\"column.field\"\r\n [name]=\"column.field\"\r\n [isRequired]=\"false\"\r\n [formStatus]=\"formStatus\"\r\n [hasGap]=\"false\"\r\n placeholder=\"{{ column.placeholder! |translate }}\"\r\n ></lib-textarea>\r\n <lib-textarea *ngIf=\"column.maxLength !== -1\"\r\n [group]=\"formGroup\"\r\n [controlName]=\"column.field\"\r\n [name]=\"column.field\"\r\n [isRequired]=\"false\"\r\n [formStatus]=\"formStatus\"\r\n [hasGap]=\"false\"\r\n placeholder=\"{{ column.placeholder! |translate }}\"\r\n ></lib-textarea>\r\n </ng-template>\r\n <ng-template pTemplate=\"output\">\r\n <ng-container *ngIf=\"rowData[column.field]; else emptyCell\">\r\n <lib-tooltip\r\n [htmlParser]=\"true\"\r\n [text]=\"rowData[column.field]\"\r\n ></lib-tooltip>\r\n </ng-container>\r\n\r\n <ng-template #emptyCell>\r\n /\r\n </ng-template>\r\n </ng-template>\r\n </p-cellEditor>\r\n </ng-container>\r\n\r\n <!-- Dropdown input-->\r\n <ng-container *ngIf=\"column.editable && column.component === 'dropdown'\">\r\n <p-cellEditor>\r\n <ng-template pTemplate=\"input\">\r\n <lib-dropdown\r\n label=\"Moje naloge\"\r\n placeholder=\"Izberite\"\r\n optionLabel=\"name\"\r\n [showClear]=\"true\"\r\n [formStatus]=\"formStatus\"\r\n\r\n [group]=\"formGroup\"\r\n [controlName]=\"column.field\"\r\n [name]=\"column.field\"\r\n\r\n filterBy=\"name\"\r\n [isLoading]=\"false\"\r\n [optionList]=\"overviewList\"\r\n [filter]=\"true\"\r\n [isRequired]=\"false\"\r\n ></lib-dropdown>\r\n </ng-template>\r\n <ng-template pTemplate=\"output\">\r\n <ng-container *ngIf=\"rowData[column.field]; else emptyCell\">\r\n <lib-tooltip\r\n [htmlParser]=\"true\"\r\n [text]=\"rowData[column.field]\"\r\n ></lib-tooltip>\r\n </ng-container>\r\n\r\n <ng-template #emptyCell>\r\n /\r\n </ng-template>\r\n </ng-template>\r\n </p-cellEditor>\r\n </ng-container>\r\n\r\n <!-- Switch input-->\r\n <ng-container *ngIf=\"column.editable && column.component === 'switch'\">\r\n <p-cellEditor>\r\n <ng-template pTemplate=\"input\">\r\n <lib-toggle-switch\r\n [group]=\"formGroup\"\r\n [controlName]=\"column.field\"\r\n [checked]=\"rowData[column.field]\"\r\n ></lib-toggle-switch>\r\n </ng-template>\r\n <ng-template pTemplate=\"output\">\r\n <ng-container *ngIf=\"rowData[column.field]; else emptyCell\">\r\n {{ 'components.customTable.yes' | translate }}\r\n </ng-container>\r\n\r\n <ng-template #emptyCell>\r\n {{ 'components.customTable.no' | translate }}\r\n </ng-template>\r\n </ng-template>\r\n </p-cellEditor>\r\n </ng-container>\r\n\r\n <!-- Mare; dodal custom checkbox za izbiro vrstice -->\r\n <!-- [controlName] je oblike rowChecked_2024-04-11T11:35:00_c3cff776-dc06-40ec-bab5-7cab26e2014a -->\r\n <!-- column.field = rowChecked -->\r\n <!-- rowData[column?.control!] = 2024-04-11T11:35:00 (startDate) -->\r\n <!-- rowData[column?.control2!] = c3cff776-dc06-40ec-bab5-7cab26e2014a (uuid) -->\r\n <ng-container *ngIf=\"column.editable && column.component === 'checkbox'\">\r\n <lib-checkbox class=\"\"\r\n [group]=\"formGroup\"\r\n [controlName]=\"column.field + '_' + rowData[column?.control!] + '_' + rowData[column?.control2!]\"\r\n (clickCheckboxEvent)=\"clickCheckboxOne($event, rowData[column?.control!] + '_' + rowData[column?.control2!])\"\r\n label=\"\">\r\n </lib-checkbox>\r\n </ng-container>\r\n\r\n <!-- Plain table-->\r\n <ng-container *ngIf=\"!column.editable\">\r\n <ng-container *ngIf=\"column.tooltip || column.tag || column.status || column.ellipsis; else valueCell\">\r\n <!-- Tooltip -->\r\n <ng-container *ngIf=\"column.tooltip\">\r\n <ng-container *ngIf=\"getNestedValue(rowData, column.field)\">\r\n <lib-tooltip [htmlParser]=\"true\" [text]=\"getNestedValue(rowData, column.field)\"></lib-tooltip>\r\n </ng-container>\r\n <ng-container *ngIf=\"!getNestedValue(rowData, column.field)\">\r\n /\r\n </ng-container>\r\n </ng-container>\r\n\r\n <!-- Ellipsis -->\r\n <ng-container *ngIf=\"column.ellipsis\">\r\n <ng-container *ngIf=\"getNestedValue(rowData, column.field)\">\r\n <span>\r\n {{ getNestedValue(rowData, column.field) }}\r\n </span>\r\n </ng-container>\r\n <ng-container *ngIf=\"!getNestedValue(rowData, column.field)\">\r\n /\r\n </ng-container>\r\n </ng-container>\r\n\r\n <!-- Tag -->\r\n <ng-container *ngIf=\"column.tag && getNestedValue(rowData, column.field)\">\r\n <lib-tag [tagText]=\"getNestedValue(rowData, column.field)\" [tagColor]=\"rowData.tagColor\" [rounded]=\"true\"></lib-tag>\r\n </ng-container>\r\n\r\n <!-- Status -->\r\n <ng-container *ngIf=\"column.status\">\r\n <ng-container *ngIf=\"getNestedValue(rowData, column.field)\">\r\n <div style=\"background-color: #66952E; height: 25px; width: 75px;\"></div>\r\n </ng-container>\r\n <ng-container *ngIf=\"!getNestedValue(rowData, column.field)\">\r\n <div style=\"background-color: #f44336; height: 25px; width: 75px;\"></div>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n <ng-template #valueCell>\r\n <ng-container *ngIf=\"getNestedValue(rowData, column.field); else emptyCell\">\r\n <!-- Mare; dodal izjemo za 'cmsStatus' -->\r\n <ng-container *ngIf=\"column.field === 'cmsStatus'; else defaultContent\">\r\n {{ 'pages.cms.cmsStatus.' + getNestedValue(rowData, column.field) | translate }}\r\n </ng-container>\r\n <!-- Privzeta vsebina za vse ostale stolpce -->\r\n <ng-template #defaultContent>\r\n {{ column.suffix ? getNestedValue(rowData, column.field) + ' ' + column.suffix : getNestedValue(rowData, column.field) }}\r\n </ng-template>\r\n </ng-container>\r\n <ng-template #emptyCell>\r\n /\r\n </ng-template>\r\n </ng-template>\r\n </ng-container>\r\n\r\n <p class=\"text-red-500 custom-small-text\" *ngIf=\"colIndex === 0 && rowData?.administrativeProcedure?.localJurisdiction && isWarningTextVisible\">\r\n <br/> {{ 'components.customTable.notification' | translate }}\r\n </p>\r\n </td>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <!-- Button column one -->\r\n <td *ngIf=\"isButtonOneVisible\" [class.disabled-row]=\"rowData?.isEnabled === false || rowData?.isEnabled === null\">\r\n <!-- Editing table-->\r\n <ng-container *ngIf=\"isEditingTable; else plainTable\">\r\n <lib-icon-button\r\n *ngIf=\"!editing\"\r\n pInitEditableRow\r\n [color]=\"buttonOneColor\"\r\n [icon]=\"buttonOneEditIcon\"\r\n (click)='onRowEdit(rowData)'\r\n ></lib-icon-button>\r\n <lib-icon-button\r\n *ngIf=\"editing\"\r\n [color]=\"buttonOneColor!\"\r\n [icon]=\"buttonOneSaveIcon\"\r\n (click)='onRowSave(rowData, htmlTableRowElement)'\r\n ></lib-icon-button>\r\n </ng-container>\r\n\r\n <!-- Plain table-->\r\n <ng-template #plainTable>\r\n <ng-container\r\n *ngIf=\"(rowData?.administrativeProcedure === undefined || rowData?.administrativeProcedure?.detailsUrl !== null) && !isPlainTableIconButtonOne\"\r\n >\r\n <lib-button\r\n *ngIf=\"!isPlainTableButtonOneLink\"\r\n [label]=\"rowData?.buttonText ? rowData.buttonText : buttonOneLabel!\"\r\n [hasIcon]=\"buttonOneHasIcon!\"\r\n [color]=\"rowData?.buttonColor ? rowData.buttonColor : buttonOneColor!\"\r\n [icon]=\"buttonOneIcon!\"\r\n (click)='clickButtonOne(rowData)'\r\n ></lib-button>\r\n <lib-button-link\r\n *ngIf=\"isPlainTableButtonOneLink\"\r\n [label]=\"rowData?.buttonText ? rowData.buttonText : buttonOneLabel!\"\r\n [isPrimary]=\"true\"\r\n [hasIcon]=\"buttonOneHasIcon!\"\r\n [icon]=\"buttonOneIcon! + ' md:ml-2'\"\r\n (click)='clickButtonOne(rowData)'\r\n ></lib-button-link>\r\n </ng-container>\r\n <lib-icon-button\r\n *ngIf=\"isPlainTableIconButtonOne\"\r\n [color]=\"buttonOneColor!\"\r\n [icon]=\"buttonOneSaveIcon\"\r\n (click)='clickButtonOne(rowData)'\r\n ></lib-icon-button>\r\n </ng-template>\r\n </td>\r\n\r\n <!-- Button column two -->\r\n <td *ngIf=\"isButtonTwoVisible\" [class.disabled-row]=\"rowData?.isEnabled === false || rowData?.isEnabled === null\">\r\n <!-- Editing table-->\r\n <ng-container *ngIf=\"isEditingTable; else plainTable\">\r\n <lib-icon-button\r\n *ngIf=\"!editing\"\r\n [color]=\"buttonTwoColor\"\r\n [icon]=\"buttonTwoDeleteIcon\"\r\n (click)='onRowDelete(rowData)'\r\n ></lib-icon-button>\r\n <lib-icon-button\r\n *ngIf=\"editing\"\r\n [color]=\"buttonTwoColor\"\r\n [icon]=\"buttonTwoCancelIcon\"\r\n (click)=\"onRowCancel(rowData)\"\r\n ></lib-icon-button>\r\n </ng-container>\r\n\r\n <!-- Plain table-->\r\n <ng-template #plainTable>\r\n <lib-button\r\n *ngIf=\"!isPlainTableIconButtonTwo\"\r\n [label]=\"buttonTwoLabel!\"\r\n [hasIcon]=\"buttonTwoHasIcon!\"\r\n [color]=\"buttonTwoColor!\"\r\n [icon]=\"buttonTwoIcon!\"\r\n (click)='clickButtonTwo(rowData)'\r\n ></lib-button>\r\n <lib-icon-button\r\n *ngIf=\"isPlainTableIconButtonTwo\"\r\n [color]=\"buttonTwoColor!\"\r\n [icon]=\"buttonTwoDeleteIcon\"\r\n (click)='clickButtonTwo(rowData)'\r\n ></lib-icon-button>\r\n </ng-template>\r\n </td>\r\n\r\n <!-- Deactivate toggle -->\r\n <td *ngIf=\"isDeactivateToggle\" [ngStyle]=\"{ 'pointer-events': 'auto' }\">\r\n <lib-toggle-switch\r\n [isFormElement]=\"false\"\r\n [checked]=\"rowData.isEnabled\"\r\n (getValueEvent)=\"toggleEnable({ rowData, $event })\"\r\n ></lib-toggle-switch>\r\n </td>\r\n\r\n <!-- Deactivate toggle two -->\r\n <td *ngIf=\"isDeactivateToggleTwo\" [ngStyle]=\"{ 'pointer-events': 'auto' }\">\r\n <lib-toggle-switch\r\n [disabled]=\"!rowData.isEnabled\"\r\n [isFormElement]=\"false\"\r\n [checked]=\"rowData.isAppointmentEnabled\"\r\n (getValueEvent)=\"toggleTwoEnable({ rowData, $event })\"\r\n ></lib-toggle-switch>\r\n </td>\r\n\r\n <!-- Deactivate toggle three -->\r\n <td *ngIf=\"isDeactivateToggleThree\" [ngStyle]=\"{ 'pointer-events': 'auto' }\">\r\n <lib-toggle-switch\r\n [disabled]=\"!rowData.isEnabled\"\r\n [isFormElement]=\"false\"\r\n [checked]=\"rowData.isNotificationEnabled\"\r\n (getValueEvent)=\"toggleThreeEnable({ rowData, $event })\"\r\n ></lib-toggle-switch>\r\n </td>\r\n\r\n <!-- Deactivate toggle four -->\r\n <td *ngIf=\"isDeactivateToggleFour\" [ngStyle]=\"{ 'pointer-events': 'auto' }\">\r\n <lib-toggle-switch\r\n [disabled]=\"!rowData.isEnabled\"\r\n [isFormElement]=\"false\"\r\n [checked]=\"rowData.isVrstomatEnabled\"\r\n (getValueEvent)=\"toggleFourEnable({ rowData, $event })\"\r\n ></lib-toggle-switch>\r\n </td>\r\n </tr>\r\n </ng-template>\r\n</p-table>\r\n", styles: [":host ::ng-deep .future .p-datatable-header{background:#b2414d}:host ::ng-deep .past .p-datatable-header{background:#6d7375}:host ::ng-deep .p-datatable{border:1px solid #3E7C94;border-radius:8px;overflow:hidden;padding:0}:host ::ng-deep .p-datatable .p-datatable-header{border:none;color:#fff;padding:.5rem 1rem}:host ::ng-deep .p-datatable .p-datatable-thead>tr>th,:host ::ng-deep .p-datatable .p-datatable-thead>tr>td{background:#d9d9d9;border:none;color:#1b495a;font-weight:unset;padding:.5rem 1rem}:host ::ng-deep .p-datatable .p-datatable-thead>tr>th.public-table:first-child,:host ::ng-deep .p-datatable .p-datatable-thead>tr>td.public-table:first-child{width:400px}:host ::ng-deep .p-datatable .p-datatable-thead>tr>th.public-table:nth-child(2),:host ::ng-deep .p-datatable .p-datatable-thead>tr>td.public-table:nth-child(2){width:150px}:host ::ng-deep .p-datatable .p-datatable-tbody>tr{background:transparent;height:50px}:host ::ng-deep .p-datatable .p-datatable-tbody>tr.success_row_color{background:#66952eb3}:host ::ng-deep .p-datatable .p-datatable-tbody>tr.disabled_row_color{background:#b4b4b4b3}:host ::ng-deep .p-datatable .p-datatable-tbody>tr>td{border-color:#3e7c94;padding:.5rem 1rem}:host ::ng-deep .p-datatable .p-datatable-tbody>tr:first-child>td{border-color:transparent}:host ::ng-deep .p-datatable .table-icon-button{width:50px}:host ::ng-deep .p-paginator{background:transparent}:host ::ng-deep .p-paginator .p-paginator-pages .p-paginator-page.p-highlight{background:#3e7c94;border-color:#3e7c94}@media (max-width: 600px){:host ::ng-deep .p-datatable .p-datatable-header{padding:.5rem}:host ::ng-deep .p-datatable .p-datatable-thead>tr>th{padding:.5rem}:host ::ng-deep .p-datatable .p-datatable-tbody>tr>td{padding:.5rem}}.disabled-row{opacity:.5;pointer-events:none}.custom-small-text{font-size:.8rem;line-height:.9}.ellipsis-text{cursor:n-resize}\n"], dependencies: [{ kind: "ngmodule", type: TableModule }, { kind: "component", type: i1$6.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "virtualRowHeight", "selectAll"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i1$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i1$6.CellEditor, selector: "p-cellEditor" }, { kind: "directive", type: i1$6.EditableRow, selector: "[pEditableRow]", inputs: ["pEditableRow", "pEditableRowDisabled"] }, { kind: "directive", type: i1$6.InitEditableRow, selector: "[pInitEditableRow]" }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: ButtonComponent, selector: "lib-button", inputs: ["hasIcon", "label", "color", "icon", "iconPos", "disabled", "isLoading", "styleClass", "size", "accessibilityText", "buttonType", "isAccessible", "isSelected", "ariaControlsId", "isExpanded", "link", "isTextareaClear"], outputs: ["clickEvent"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: InputComponent, selector: "lib-input[group][controlName][name]", inputs: ["name", "type", "label", "placeholder", "accessibilityText", "group", "controlName", "isRequired", "isLabelVisible", "tooltipPosition", "tooltipText", "formStatus", "groupError", "hasGap", "hasTitle", "maxLength"] }, { kind: "component", type: DateInputComponent, selector: "lib-date-input[group][controlName][name]", inputs: ["isLabelVisible", "name", "label", "placeholder", "accessibilityText", "isRequired", "tooltipPosition", "tooltipText", "dateFormat", "group", "controlName", "showIcon", "selectionMode", "touchUI", "formStatus", "showClear", "isPublicDate", "minDate", "maxDate", "minDateToday", "maxDateSixMonths", "maxDateThreeMonths", "setMinAndMax", "hasGap", "disabledDates", "appendTo", "groupError", "showTime", "availableDates", "disabledDays", "disabledWeekends"], outputs: ["onSelect"] }, { kind: "component", type: TextareaComponent, selector: "lib-textarea[group][controlName][name]", inputs: ["name", "resize", "label", "placeholder", "accessibilityText", "rows", "cols", "tooltipPosition", "tooltipText", "group", "controlName", "isRequired", "formStatus", "hasGap", "customMaxLength"] }, { kind: "component", type: TooltipComponent, selector: " lib-tooltip", inputs: ["icon", "htmlParser", "text", "position", "tooltipEvent", "autoHide", "htmlParse"] }, { kind: "component", type: DropdownComponent, selector: "lib-dropdown[group][controlName][name]", inputs: ["name", "isMultiselect", "selectedItemLabel", "group", "controlName", "label", "optionList", "optionLabel", "optionalValue", "placeholder", "accessibilityText", "filter", "filterBy", "showClear", "isRequired", "tooltipPosition", "tooltipText", "formStatus", "nestedGroup", "isLoading", "appendTo", "isLabelVisible", "emptyMessage", "virtualScroll", "ariaFilterLabel", "optionValue"], outputs: ["getValueEvent"] }, { kind: "component", type: ToggleSwitchComponent, selector: "lib-toggle-switch", inputs: ["group", "controlName", "isFormElement", "checked", "disabled"], outputs: ["getValueEvent", "checkedChanged"] }, { kind: "component", type: CheckboxComponent, selector: "lib-checkbox[group][controlName][label]", inputs: ["label", "group", "controlName", "value", "formStatus", "ariaLabel"], outputs: ["clickCheckboxEvent"] }, { kind: "component", type: TagComponent, selector: "lib-tag", inputs: ["tagText", "tagColor", "rounded"] }, { kind: "component", type: IconButtonComponent, selector: "lib-icon-button", inputs: ["icon", "disabled", "color", "styleClass", "size"], outputs: ["clickEvent"] }, { kind: "component", type: ButtonLinkComponent, selector: "lib-button-link", inputs: ["hasIcon", "label", "isDanger", "isPrimary", "icon", "target", "accessibilityText"], outputs: ["clickEvent"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }, { kind: "pipe", type: DatePipe, name: "date" }] });
1892
+ }
1893
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: CustomTableComponent, decorators: [{
1894
+ type: Component,
1895
+ args: [{ selector: 'lib-custom-table[tableData][tableColumns]', imports: [
1896
+ TableModule,
1897
+ NgClass,
1898
+ NgIf,
1899
+ PrimeTemplate,
1900
+ NgStyle,
1901
+ ButtonComponent,
1902
+ NgFor,
1903
+ InputComponent,
1904
+ DateInputComponent,
1905
+ TextareaComponent,
1906
+ TooltipComponent,
1907
+ DropdownComponent,
1908
+ ToggleSwitchComponent,
1909
+ CheckboxComponent,
1910
+ TagComponent,
1911
+ IconButtonComponent,
1912
+ ButtonLinkComponent,
1913
+ TranslateModule,
1914
+ DatePipe,
1915
+ ], template: "<p-table\r\n #dt\r\n [value]=\"tableData\"\r\n [paginator]=\"isPaginatorVisible\"\r\n [rows]=\"tableRowCount\"\r\n [showCurrentPageReport]=\"false\"\r\n [scrollable]=\"scrollable\"\r\n [scrollHeight]=\"scrollHeight\"\r\n dataKey=\"id\"\r\n editMode=\"row\"\r\n [ngClass]=\"captionColorClass\"\r\n [loading]=\"isTableLoading\"\r\n [tableStyle]=\"{'min-width': tableMinWidth}\"\r\n [virtualScroll]=\"isVirtualScroll\"\r\n [virtualScrollItemSize]=\"virtualScrollRowSize\"\r\n aria-live=\"polite\"\r\n>\r\n <ng-template pTemplate=\"caption\" *ngIf=\"!!tableCaption\">\r\n <div class=\"flex align-items-center justify-content-between\">\r\n {{ tableCaption }}\r\n <span *ngIf=\"isVirtualScrollButtonVisible\"\r\n (click)=\"isVirtualScroll = !isVirtualScroll\"\r\n [ngStyle]=\"{'color': isVirtualScroll ? '' : 'lightgray'}\"\r\n class=\"pi pi-sort cursor-pointer\">\r\n </span>\r\n <lib-button\r\n *ngIf=\"isCaptionButtonVisible\"\r\n [label]=\"captionButtonLabel\"\r\n [color]=\"captionButtonColor\"\r\n (clickEvent)=\"clickCaptionButton($event)\"\r\n ></lib-button>\r\n </div>\r\n </ng-template>\r\n <ng-template pTemplate=\"header\" *ngIf=\"isTableHeaderVisible\">\r\n <tr>\r\n <ng-container *ngFor=\"let column of tableColumns\">\r\n <ng-container *ngIf=\"!(column.hideOnMobile && isMobile() && hideColumnsOnMobile)\">\r\n <th scope=\"col\" [style.width]=\"column.width\">\r\n {{ column.header | translate }}\r\n </th>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <th *ngFor=\"let _ of emptyHeaderColumnList\" [style.width]=\"emptyColumnWidth\" aria-hidden=\"true\"></th>\r\n <th *ngIf=\"!!toggleTableHeaderName\" scope=\"col\" [style.width]=\"toggleWidth\" class=\"vertical-align-middle\">\r\n {{ toggleTableHeaderName }}\r\n </th>\r\n <th *ngIf=\"!!toggleTwoTableHeaderName\" scope=\"col\" [style.width]=\"toggleTwoWidth\" class=\"vertical-align-middle\">\r\n {{ toggleTwoTableHeaderName }}\r\n </th>\r\n <th *ngIf=\"!!toggleThreeTableHeaderName\" scope=\"col\" [style.width]=\"toggleThreeWidth\" class=\"vertical-align-middle\">\r\n {{ toggleThreeTableHeaderName }}\r\n </th>\r\n <th *ngIf=\"!!toggleFourTableHeaderName\" scope=\"col\" [style.width]=\"toggleFourWidth\" class=\"vertical-align-middle\">\r\n {{ toggleFourTableHeaderName }}\r\n </th>\r\n </tr>\r\n </ng-template>\r\n <ng-template pTemplate=\"body\" let-rowData let-editing=\"editing\" let-ri=\"rowIndex\">\r\n <!--\r\n Mare; 2024-09-19: dodajanje logike barvanja rowColor za /cms/notifications, delat mora pa tudi v /vsi-termini\r\n -->\r\n <tr [pEditableRow]=\"rowData\" #htmlTableRowElement\r\n [ngClass]=\"\r\n rowData?.cmsStatus ?\r\n (rowData?.cmsStatus === 'expired' ? 'disabled_row_color' :\r\n rowData?.cmsStatus === 'planned' ? '' :\r\n rowData?.cmsStatus === 'active' ? 'success_row_color' : '') :\r\n (!rowData?.registered ? rowColor : '')\r\n \">\r\n <ng-container *ngFor=\"let column of tableColumns; let colIndex = index\">\r\n <ng-container *ngIf=\"!(column.hideOnMobile && isMobile() && hideColumnsOnMobile)\">\r\n <td [class.disabled-row]=\"rowData?.isEnabled === false || rowData?.isEnabled === null\">\r\n <!-- Text input-->\r\n <ng-container *ngIf=\"column.editable && column.component === 'input'\">\r\n <p-cellEditor>\r\n <ng-template pTemplate=\"input\">\r\n <lib-input\r\n [group]=\"formGroup\"\r\n [controlName]=\"column.field\"\r\n [name]=\"column.field\"\r\n [type]=\"column.inputType ? column.inputType : type\"\r\n placeholder=\"{{ column.placeholder! |translate }}\"\r\n [isRequired]=\"false\"\r\n [formStatus]=\"formStatus\"\r\n [hasGap]=\"false\"\r\n ></lib-input>\r\n </ng-template>\r\n <ng-template pTemplate=\"output\">\r\n <ng-container *ngIf=\"rowData[column.field]; else emptyCell\">\r\n <ng-container *ngIf=\"column.isLink; else notLink\">\r\n <a href=\"{{ rowData[column.field] }}\" target=\"_blank\">\r\n {{ rowData[column.field] }}\r\n </a>\r\n </ng-container>\r\n <ng-template #notLink>\r\n {{ rowData[column.field] }} {{ column?.suffix }}\r\n </ng-template>\r\n </ng-container>\r\n\r\n <ng-template #emptyCell>\r\n /\r\n </ng-template>\r\n </ng-template>\r\n </p-cellEditor>\r\n </ng-container>\r\n\r\n <!-- Date input-->\r\n <ng-container *ngIf=\"column.editable && column.component === 'date'\">\r\n <p-cellEditor>\r\n <ng-template pTemplate=\"input\">\r\n <lib-date-input\r\n appendTo=\"body\"\r\n [group]=\"formGroup\"\r\n [controlName]=\"column.field\"\r\n [name]=\"column.field\"\r\n [setMinAndMax]=\"false\"\r\n [isRequired]=\"false\"\r\n [formStatus]=\"formStatus\"\r\n [hasGap]=\"false\"\r\n placeholder=\"{{ column.placeholder! | translate }}\"\r\n ></lib-date-input>\r\n </ng-template>\r\n <ng-template pTemplate=\"output\">\r\n <ng-container *ngIf=\"rowData[column.field]; else emptyCell\">\r\n {{ rowData[column.field] | date: 'dd.MM.yyyy' }} {{ column?.suffix }}\r\n </ng-container>\r\n <ng-template #emptyCell>\r\n /\r\n </ng-template>\r\n </ng-template>\r\n </p-cellEditor>\r\n </ng-container>\r\n\r\n <!-- Date+Time output-->\r\n <ng-container *ngIf=\"column.editable && column.component === 'dateTime'\">\r\n <p-cellEditor>\r\n <ng-template pTemplate=\"output\">\r\n <ng-container *ngIf=\"rowData[column.field]; else emptyCell\">\r\n {{ rowData[column.field] | date: 'dd.MM.yyyy, HH:mm' }} {{ column?.suffix }}\r\n </ng-container>\r\n <ng-template #emptyCell>\r\n /\r\n </ng-template>\r\n </ng-template>\r\n </p-cellEditor>\r\n </ng-container>\r\n\r\n <!-- TextArea input-->\r\n <ng-container *ngIf=\"column.editable && column.component === 'textarea'\">\r\n <p-cellEditor>\r\n <ng-template pTemplate=\"input\">\r\n <lib-textarea *ngIf=\"column.maxLength === -1\"\r\n [customMaxLength]=\"null\"\r\n [group]=\"formGroup\"\r\n [controlName]=\"column.field\"\r\n [name]=\"column.field\"\r\n [isRequired]=\"false\"\r\n [formStatus]=\"formStatus\"\r\n [hasGap]=\"false\"\r\n placeholder=\"{{ column.placeholder! |translate }}\"\r\n ></lib-textarea>\r\n <lib-textarea *ngIf=\"column.maxLength !== -1\"\r\n [group]=\"formGroup\"\r\n [controlName]=\"column.field\"\r\n [name]=\"column.field\"\r\n [isRequired]=\"false\"\r\n [formStatus]=\"formStatus\"\r\n [hasGap]=\"false\"\r\n placeholder=\"{{ column.placeholder! |translate }}\"\r\n ></lib-textarea>\r\n </ng-template>\r\n <ng-template pTemplate=\"output\">\r\n <ng-container *ngIf=\"rowData[column.field]; else emptyCell\">\r\n <lib-tooltip\r\n [htmlParser]=\"true\"\r\n [text]=\"rowData[column.field]\"\r\n ></lib-tooltip>\r\n </ng-container>\r\n\r\n <ng-template #emptyCell>\r\n /\r\n </ng-template>\r\n </ng-template>\r\n </p-cellEditor>\r\n </ng-container>\r\n\r\n <!-- Dropdown input-->\r\n <ng-container *ngIf=\"column.editable && column.component === 'dropdown'\">\r\n <p-cellEditor>\r\n <ng-template pTemplate=\"input\">\r\n <lib-dropdown\r\n label=\"Moje naloge\"\r\n placeholder=\"Izberite\"\r\n optionLabel=\"name\"\r\n [showClear]=\"true\"\r\n [formStatus]=\"formStatus\"\r\n\r\n [group]=\"formGroup\"\r\n [controlName]=\"column.field\"\r\n [name]=\"column.field\"\r\n\r\n filterBy=\"name\"\r\n [isLoading]=\"false\"\r\n [optionList]=\"overviewList\"\r\n [filter]=\"true\"\r\n [isRequired]=\"false\"\r\n ></lib-dropdown>\r\n </ng-template>\r\n <ng-template pTemplate=\"output\">\r\n <ng-container *ngIf=\"rowData[column.field]; else emptyCell\">\r\n <lib-tooltip\r\n [htmlParser]=\"true\"\r\n [text]=\"rowData[column.field]\"\r\n ></lib-tooltip>\r\n </ng-container>\r\n\r\n <ng-template #emptyCell>\r\n /\r\n </ng-template>\r\n </ng-template>\r\n </p-cellEditor>\r\n </ng-container>\r\n\r\n <!-- Switch input-->\r\n <ng-container *ngIf=\"column.editable && column.component === 'switch'\">\r\n <p-cellEditor>\r\n <ng-template pTemplate=\"input\">\r\n <lib-toggle-switch\r\n [group]=\"formGroup\"\r\n [controlName]=\"column.field\"\r\n [checked]=\"rowData[column.field]\"\r\n ></lib-toggle-switch>\r\n </ng-template>\r\n <ng-template pTemplate=\"output\">\r\n <ng-container *ngIf=\"rowData[column.field]; else emptyCell\">\r\n {{ 'components.customTable.yes' | translate }}\r\n </ng-container>\r\n\r\n <ng-template #emptyCell>\r\n {{ 'components.customTable.no' | translate }}\r\n </ng-template>\r\n </ng-template>\r\n </p-cellEditor>\r\n </ng-container>\r\n\r\n <!-- Mare; dodal custom checkbox za izbiro vrstice -->\r\n <!-- [controlName] je oblike rowChecked_2024-04-11T11:35:00_c3cff776-dc06-40ec-bab5-7cab26e2014a -->\r\n <!-- column.field = rowChecked -->\r\n <!-- rowData[column?.control!] = 2024-04-11T11:35:00 (startDate) -->\r\n <!-- rowData[column?.control2!] = c3cff776-dc06-40ec-bab5-7cab26e2014a (uuid) -->\r\n <ng-container *ngIf=\"column.editable && column.component === 'checkbox'\">\r\n <lib-checkbox class=\"\"\r\n [group]=\"formGroup\"\r\n [controlName]=\"column.field + '_' + rowData[column?.control!] + '_' + rowData[column?.control2!]\"\r\n (clickCheckboxEvent)=\"clickCheckboxOne($event, rowData[column?.control!] + '_' + rowData[column?.control2!])\"\r\n label=\"\">\r\n </lib-checkbox>\r\n </ng-container>\r\n\r\n <!-- Plain table-->\r\n <ng-container *ngIf=\"!column.editable\">\r\n <ng-container *ngIf=\"column.tooltip || column.tag || column.status || column.ellipsis; else valueCell\">\r\n <!-- Tooltip -->\r\n <ng-container *ngIf=\"column.tooltip\">\r\n <ng-container *ngIf=\"getNestedValue(rowData, column.field)\">\r\n <lib-tooltip [htmlParser]=\"true\" [text]=\"getNestedValue(rowData, column.field)\"></lib-tooltip>\r\n </ng-container>\r\n <ng-container *ngIf=\"!getNestedValue(rowData, column.field)\">\r\n /\r\n </ng-container>\r\n </ng-container>\r\n\r\n <!-- Ellipsis -->\r\n <ng-container *ngIf=\"column.ellipsis\">\r\n <ng-container *ngIf=\"getNestedValue(rowData, column.field)\">\r\n <span>\r\n {{ getNestedValue(rowData, column.field) }}\r\n </span>\r\n </ng-container>\r\n <ng-container *ngIf=\"!getNestedValue(rowData, column.field)\">\r\n /\r\n </ng-container>\r\n </ng-container>\r\n\r\n <!-- Tag -->\r\n <ng-container *ngIf=\"column.tag && getNestedValue(rowData, column.field)\">\r\n <lib-tag [tagText]=\"getNestedValue(rowData, column.field)\" [tagColor]=\"rowData.tagColor\" [rounded]=\"true\"></lib-tag>\r\n </ng-container>\r\n\r\n <!-- Status -->\r\n <ng-container *ngIf=\"column.status\">\r\n <ng-container *ngIf=\"getNestedValue(rowData, column.field)\">\r\n <div style=\"background-color: #66952E; height: 25px; width: 75px;\"></div>\r\n </ng-container>\r\n <ng-container *ngIf=\"!getNestedValue(rowData, column.field)\">\r\n <div style=\"background-color: #f44336; height: 25px; width: 75px;\"></div>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n <ng-template #valueCell>\r\n <ng-container *ngIf=\"getNestedValue(rowData, column.field); else emptyCell\">\r\n <!-- Mare; dodal izjemo za 'cmsStatus' -->\r\n <ng-container *ngIf=\"column.field === 'cmsStatus'; else defaultContent\">\r\n {{ 'pages.cms.cmsStatus.' + getNestedValue(rowData, column.field) | translate }}\r\n </ng-container>\r\n <!-- Privzeta vsebina za vse ostale stolpce -->\r\n <ng-template #defaultContent>\r\n {{ column.suffix ? getNestedValue(rowData, column.field) + ' ' + column.suffix : getNestedValue(rowData, column.field) }}\r\n </ng-template>\r\n </ng-container>\r\n <ng-template #emptyCell>\r\n /\r\n </ng-template>\r\n </ng-template>\r\n </ng-container>\r\n\r\n <p class=\"text-red-500 custom-small-text\" *ngIf=\"colIndex === 0 && rowData?.administrativeProcedure?.localJurisdiction && isWarningTextVisible\">\r\n <br/> {{ 'components.customTable.notification' | translate }}\r\n </p>\r\n </td>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <!-- Button column one -->\r\n <td *ngIf=\"isButtonOneVisible\" [class.disabled-row]=\"rowData?.isEnabled === false || rowData?.isEnabled === null\">\r\n <!-- Editing table-->\r\n <ng-container *ngIf=\"isEditingTable; else plainTable\">\r\n <lib-icon-button\r\n *ngIf=\"!editing\"\r\n pInitEditableRow\r\n [color]=\"buttonOneColor\"\r\n [icon]=\"buttonOneEditIcon\"\r\n (click)='onRowEdit(rowData)'\r\n ></lib-icon-button>\r\n <lib-icon-button\r\n *ngIf=\"editing\"\r\n [color]=\"buttonOneColor!\"\r\n [icon]=\"buttonOneSaveIcon\"\r\n (click)='onRowSave(rowData, htmlTableRowElement)'\r\n ></lib-icon-button>\r\n </ng-container>\r\n\r\n <!-- Plain table-->\r\n <ng-template #plainTable>\r\n <ng-container\r\n *ngIf=\"(rowData?.administrativeProcedure === undefined || rowData?.administrativeProcedure?.detailsUrl !== null) && !isPlainTableIconButtonOne\"\r\n >\r\n <lib-button\r\n *ngIf=\"!isPlainTableButtonOneLink\"\r\n [label]=\"rowData?.buttonText ? rowData.buttonText : buttonOneLabel!\"\r\n [hasIcon]=\"buttonOneHasIcon!\"\r\n [color]=\"rowData?.buttonColor ? rowData.buttonColor : buttonOneColor!\"\r\n [icon]=\"buttonOneIcon!\"\r\n (click)='clickButtonOne(rowData)'\r\n ></lib-button>\r\n <lib-button-link\r\n *ngIf=\"isPlainTableButtonOneLink\"\r\n [label]=\"rowData?.buttonText ? rowData.buttonText : buttonOneLabel!\"\r\n [isPrimary]=\"true\"\r\n [hasIcon]=\"buttonOneHasIcon!\"\r\n [icon]=\"buttonOneIcon! + ' md:ml-2'\"\r\n (click)='clickButtonOne(rowData)'\r\n ></lib-button-link>\r\n </ng-container>\r\n <lib-icon-button\r\n *ngIf=\"isPlainTableIconButtonOne\"\r\n [color]=\"buttonOneColor!\"\r\n [icon]=\"buttonOneSaveIcon\"\r\n (click)='clickButtonOne(rowData)'\r\n ></lib-icon-button>\r\n </ng-template>\r\n </td>\r\n\r\n <!-- Button column two -->\r\n <td *ngIf=\"isButtonTwoVisible\" [class.disabled-row]=\"rowData?.isEnabled === false || rowData?.isEnabled === null\">\r\n <!-- Editing table-->\r\n <ng-container *ngIf=\"isEditingTable; else plainTable\">\r\n <lib-icon-button\r\n *ngIf=\"!editing\"\r\n [color]=\"buttonTwoColor\"\r\n [icon]=\"buttonTwoDeleteIcon\"\r\n (click)='onRowDelete(rowData)'\r\n ></lib-icon-button>\r\n <lib-icon-button\r\n *ngIf=\"editing\"\r\n [color]=\"buttonTwoColor\"\r\n [icon]=\"buttonTwoCancelIcon\"\r\n (click)=\"onRowCancel(rowData)\"\r\n ></lib-icon-button>\r\n </ng-container>\r\n\r\n <!-- Plain table-->\r\n <ng-template #plainTable>\r\n <lib-button\r\n *ngIf=\"!isPlainTableIconButtonTwo\"\r\n [label]=\"buttonTwoLabel!\"\r\n [hasIcon]=\"buttonTwoHasIcon!\"\r\n [color]=\"buttonTwoColor!\"\r\n [icon]=\"buttonTwoIcon!\"\r\n (click)='clickButtonTwo(rowData)'\r\n ></lib-button>\r\n <lib-icon-button\r\n *ngIf=\"isPlainTableIconButtonTwo\"\r\n [color]=\"buttonTwoColor!\"\r\n [icon]=\"buttonTwoDeleteIcon\"\r\n (click)='clickButtonTwo(rowData)'\r\n ></lib-icon-button>\r\n </ng-template>\r\n </td>\r\n\r\n <!-- Deactivate toggle -->\r\n <td *ngIf=\"isDeactivateToggle\" [ngStyle]=\"{ 'pointer-events': 'auto' }\">\r\n <lib-toggle-switch\r\n [isFormElement]=\"false\"\r\n [checked]=\"rowData.isEnabled\"\r\n (getValueEvent)=\"toggleEnable({ rowData, $event })\"\r\n ></lib-toggle-switch>\r\n </td>\r\n\r\n <!-- Deactivate toggle two -->\r\n <td *ngIf=\"isDeactivateToggleTwo\" [ngStyle]=\"{ 'pointer-events': 'auto' }\">\r\n <lib-toggle-switch\r\n [disabled]=\"!rowData.isEnabled\"\r\n [isFormElement]=\"false\"\r\n [checked]=\"rowData.isAppointmentEnabled\"\r\n (getValueEvent)=\"toggleTwoEnable({ rowData, $event })\"\r\n ></lib-toggle-switch>\r\n </td>\r\n\r\n <!-- Deactivate toggle three -->\r\n <td *ngIf=\"isDeactivateToggleThree\" [ngStyle]=\"{ 'pointer-events': 'auto' }\">\r\n <lib-toggle-switch\r\n [disabled]=\"!rowData.isEnabled\"\r\n [isFormElement]=\"false\"\r\n [checked]=\"rowData.isNotificationEnabled\"\r\n (getValueEvent)=\"toggleThreeEnable({ rowData, $event })\"\r\n ></lib-toggle-switch>\r\n </td>\r\n\r\n <!-- Deactivate toggle four -->\r\n <td *ngIf=\"isDeactivateToggleFour\" [ngStyle]=\"{ 'pointer-events': 'auto' }\">\r\n <lib-toggle-switch\r\n [disabled]=\"!rowData.isEnabled\"\r\n [isFormElement]=\"false\"\r\n [checked]=\"rowData.isVrstomatEnabled\"\r\n (getValueEvent)=\"toggleFourEnable({ rowData, $event })\"\r\n ></lib-toggle-switch>\r\n </td>\r\n </tr>\r\n </ng-template>\r\n</p-table>\r\n", styles: [":host ::ng-deep .future .p-datatable-header{background:#b2414d}:host ::ng-deep .past .p-datatable-header{background:#6d7375}:host ::ng-deep .p-datatable{border:1px solid #3E7C94;border-radius:8px;overflow:hidden;padding:0}:host ::ng-deep .p-datatable .p-datatable-header{border:none;color:#fff;padding:.5rem 1rem}:host ::ng-deep .p-datatable .p-datatable-thead>tr>th,:host ::ng-deep .p-datatable .p-datatable-thead>tr>td{background:#d9d9d9;border:none;color:#1b495a;font-weight:unset;padding:.5rem 1rem}:host ::ng-deep .p-datatable .p-datatable-thead>tr>th.public-table:first-child,:host ::ng-deep .p-datatable .p-datatable-thead>tr>td.public-table:first-child{width:400px}:host ::ng-deep .p-datatable .p-datatable-thead>tr>th.public-table:nth-child(2),:host ::ng-deep .p-datatable .p-datatable-thead>tr>td.public-table:nth-child(2){width:150px}:host ::ng-deep .p-datatable .p-datatable-tbody>tr{background:transparent;height:50px}:host ::ng-deep .p-datatable .p-datatable-tbody>tr.success_row_color{background:#66952eb3}:host ::ng-deep .p-datatable .p-datatable-tbody>tr.disabled_row_color{background:#b4b4b4b3}:host ::ng-deep .p-datatable .p-datatable-tbody>tr>td{border-color:#3e7c94;padding:.5rem 1rem}:host ::ng-deep .p-datatable .p-datatable-tbody>tr:first-child>td{border-color:transparent}:host ::ng-deep .p-datatable .table-icon-button{width:50px}:host ::ng-deep .p-paginator{background:transparent}:host ::ng-deep .p-paginator .p-paginator-pages .p-paginator-page.p-highlight{background:#3e7c94;border-color:#3e7c94}@media (max-width: 600px){:host ::ng-deep .p-datatable .p-datatable-header{padding:.5rem}:host ::ng-deep .p-datatable .p-datatable-thead>tr>th{padding:.5rem}:host ::ng-deep .p-datatable .p-datatable-tbody>tr>td{padding:.5rem}}.disabled-row{opacity:.5;pointer-events:none}.custom-small-text{font-size:.8rem;line-height:.9}.ellipsis-text{cursor:n-resize}\n"] }]
1916
+ }], propDecorators: { table: [{
1917
+ type: ViewChild,
1918
+ args: ['dt', { static: false }]
1919
+ }], tableData: [{
1920
+ type: Input
1921
+ }], tableColumns: [{
1922
+ type: Input
1923
+ }], isPaginatorVisible: [{
1924
+ type: Input
1925
+ }], tableRowCount: [{
1926
+ type: Input
1927
+ }], scrollable: [{
1928
+ type: Input
1929
+ }], scrollHeight: [{
1930
+ type: Input
1931
+ }], selectedProducts: [{
1932
+ type: Input
1933
+ }], isEditingTable: [{
1934
+ type: Input
1935
+ }], isTableLoading: [{
1936
+ type: Input
1937
+ }], hideColumnsOnMobile: [{
1938
+ type: Input
1939
+ }], tableMinWidth: [{
1940
+ type: Input
1941
+ }], isVirtualScrollButtonVisible: [{
1942
+ type: Input
1943
+ }], isVirtualScroll: [{
1944
+ type: Input
1945
+ }], virtualScrollRowSize: [{
1946
+ type: Input
1947
+ }], tableCaption: [{
1948
+ type: Input
1949
+ }], captionColorClass: [{
1950
+ type: Input
1951
+ }], isCaptionButtonVisible: [{
1952
+ type: Input
1953
+ }], captionButtonLabel: [{
1954
+ type: Input
1955
+ }], captionButtonColor: [{
1956
+ type: Input
1957
+ }], captionButtonClicked: [{
1958
+ type: Output
1959
+ }], isTableHeaderVisible: [{
1960
+ type: Input
1961
+ }], emptyColumnWidth: [{
1962
+ type: Input
1963
+ }], toggleTableHeaderName: [{
1964
+ type: Input
1965
+ }], toggleWidth: [{
1966
+ type: Input
1967
+ }], toggleTwoTableHeaderName: [{
1968
+ type: Input
1969
+ }], toggleTwoWidth: [{
1970
+ type: Input
1971
+ }], toggleThreeTableHeaderName: [{
1972
+ type: Input
1973
+ }], toggleThreeWidth: [{
1974
+ type: Input
1975
+ }], toggleFourTableHeaderName: [{
1976
+ type: Input
1977
+ }], toggleFourWidth: [{
1978
+ type: Input
1979
+ }], rowColor: [{
1980
+ type: Input
1981
+ }], formGroup: [{
1982
+ type: Input
1983
+ }], type: [{
1984
+ type: Input
1985
+ }], formStatus: [{
1986
+ type: Input
1987
+ }], tagColor: [{
1988
+ type: Input
1989
+ }], isWarningTextVisible: [{
1990
+ type: Input
1991
+ }], isButtonOneVisible: [{
1992
+ type: Input
1993
+ }], buttonLabel: [{
1994
+ type: Input
1995
+ }], buttonOneLabel: [{
1996
+ type: Input
1997
+ }], buttonOneHasIcon: [{
1998
+ type: Input
1999
+ }], buttonOneEditIcon: [{
2000
+ type: Input
2001
+ }], buttonOneSaveIcon: [{
2002
+ type: Input
2003
+ }], buttonOneColor: [{
2004
+ type: Input
2005
+ }], buttonOneIcon: [{
2006
+ type: Input
2007
+ }], isPlainTableIconButtonOne: [{
2008
+ type: Input
2009
+ }], isPlainTableButtonOneLink: [{
2010
+ type: Input
2011
+ }], buttonEditClick: [{
2012
+ type: Output
2013
+ }], buttonSaveClick: [{
2014
+ type: Output
2015
+ }], buttonOneClick: [{
2016
+ type: Output
2017
+ }], isButtonTwoVisible: [{
2018
+ type: Input
2019
+ }], buttonTwoLabel: [{
2020
+ type: Input
2021
+ }], buttonTwoHasIcon: [{
2022
+ type: Input
2023
+ }], buttonTwoDeleteIcon: [{
2024
+ type: Input
2025
+ }], buttonTwoCancelIcon: [{
2026
+ type: Input
2027
+ }], buttonTwoColor: [{
2028
+ type: Input
2029
+ }], buttonTwoIcon: [{
2030
+ type: Input
2031
+ }], isPlainTableIconButtonTwo: [{
2032
+ type: Input
2033
+ }], buttonDeleteClick: [{
2034
+ type: Output
2035
+ }], buttonTwoClick: [{
2036
+ type: Output
2037
+ }], isDeactivateToggle: [{
2038
+ type: Input
2039
+ }], toggleSwitch: [{
2040
+ type: Output
2041
+ }], isDeactivateToggleTwo: [{
2042
+ type: Input
2043
+ }], toggleTwoSwitch: [{
2044
+ type: Output
2045
+ }], isDeactivateToggleThree: [{
2046
+ type: Input
2047
+ }], toggleThreeSwitch: [{
2048
+ type: Output
2049
+ }], isDeactivateToggleFour: [{
2050
+ type: Input
2051
+ }], toggleFourSwitch: [{
2052
+ type: Output
2053
+ }], showEllipsisFullText: [{
2054
+ type: Input
2055
+ }], checkboxOne: [{
2056
+ type: Output
2057
+ }] } });
2058
+
2059
+ class ExpandedTableComponent {
2060
+ Array = Array;
2061
+ ButtonColor = ButtonColor;
2062
+ isEmpty = isEmpty;
2063
+ // Main Table configuration
2064
+ tableData;
2065
+ tableColumns = [];
2066
+ isPaginatorVisible = false;
2067
+ tableRowCount = 10;
2068
+ isEnabledTable = true;
2069
+ scrollable = false;
2070
+ scrollHeight;
2071
+ isTableLoading = false;
2072
+ mainCaptionColorClass;
2073
+ isEditingTable = false;
2074
+ hideColumnsOnMobile = false;
2075
+ innerTableHideColumnsOnMobile = false;
2076
+ // Main table data
2077
+ tableCaption;
2078
+ // Table header
2079
+ isTableHeaderVisible = true;
2080
+ emptyHeaderColumnList = [];
2081
+ emptyColumnWidth;
2082
+ rowColor;
2083
+ // Main table data - Column one button
2084
+ isButtonOneVisible = false;
2085
+ isPlainTableIconButtonOne = false;
2086
+ buttonLabel;
2087
+ buttonOneLabel;
2088
+ buttonOneHasIcon;
2089
+ buttonOneColor;
2090
+ buttonOneIcon;
2091
+ buttonOneClick = new EventEmitter();
2092
+ // Main table data - Column one button
2093
+ isButtonTwoVisible = false;
2094
+ buttonTwoLabel;
2095
+ buttonTwoHasIcon;
2096
+ buttonTwoColor;
2097
+ buttonTwoIcon;
2098
+ isButtonTwoToggle = true;
2099
+ buttonTwoClick = new EventEmitter();
2100
+ // Main table data - Arrow
2101
+ isArrowToggle = false;
2102
+ // Inner table
2103
+ table;
2104
+ innerTableStyle = '';
2105
+ // Table configuration
2106
+ innerTableColumns = [];
2107
+ innerIsPaginatorVisible = false;
2108
+ innerTableRowCount = 10;
2109
+ innerScrollable = false;
2110
+ innerScrollHeight;
2111
+ innerIsEditingTable = false;
2112
+ innerIsTableLoading = false;
2113
+ // Caption
2114
+ innerTableCaption;
2115
+ innerCaptionColorClass = CaptionColor.today;
2116
+ innerIsCaptionButtonVisible = false;
2117
+ innerCaptionButtonLabel;
2118
+ innerCaptionButtonColor = ButtonColor.primary;
2119
+ innerCaptionButtonClicked = new EventEmitter();
2120
+ // Table header
2121
+ innerIsTableHeaderVisible = true;
2122
+ innerEmptyHeaderColumnList = [];
2123
+ innerEmptyColumnWidth;
2124
+ // Disable switch - toggle
2125
+ innerToggleTableHeaderName;
2126
+ innerToggleWidth = '100px';
2127
+ // Disable switchTwo - toggle
2128
+ innerToggleTwoTableHeaderName;
2129
+ innerToggleTwoWidth = '100px';
2130
+ innerToggleThreeTableHeaderName;
2131
+ innerToggleThreeWidth = '100px';
2132
+ innerToggleFourTableHeaderName;
2133
+ innerToggleFourWidth = '100px';
2134
+ // Form stuff
2135
+ innerFormGroup = new FormGroup({});
2136
+ // Input
2137
+ innerType = InputType.text;
2138
+ innerFormStatus;
2139
+ // Button column one
2140
+ innerIsButtonOneVisible = false;
2141
+ innerIsPlainTableIconButtonOne = false;
2142
+ innerButtonOneLabel;
2143
+ innerButtonOneHasIcon;
2144
+ innerButtonOneEditIcon;
2145
+ innerButtonOneSaveIcon;
2146
+ innerButtonOneColor;
2147
+ innerButtonOneIcon;
2148
+ innerButtonEditClick = new EventEmitter();
2149
+ innerButtonSaveClick = new EventEmitter();
2150
+ innerButtonOneClick = new EventEmitter();
2151
+ // Button column two
2152
+ innerIsButtonTwoVisible = false;
2153
+ innerIsPlainTableIconButtonTwo = false;
2154
+ innerButtonTwoLabel;
2155
+ innerButtonTwoHasIcon;
2156
+ innerButtonTwoDeleteIcon;
2157
+ innerButtonTwoCancelIcon;
2158
+ innerButtonTwoColor;
2159
+ innerButtonTwoIcon;
2160
+ innerButtonDeleteClick = new EventEmitter();
2161
+ innerButtonTwoClick = new EventEmitter();
2162
+ // Deactivate toggle
2163
+ innerIsDeactivateToggle = false;
2164
+ innerToggleSwitch = new EventEmitter();
2165
+ innerIsDeactivateToggleTwo = false;
2166
+ innerToggleTwoSwitch = new EventEmitter();
2167
+ innerIsDeactivateToggleThree = false;
2168
+ innerToggleThreeSwitch = new EventEmitter();
2169
+ innerIsDeactivateToggleFour = false;
2170
+ innerToggleFourSwitch = new EventEmitter();
2171
+ // Main table functions
2172
+ clickButtonOne(event) {
2173
+ this.buttonOneClick.emit(event);
2174
+ }
2175
+ clickButtonTwo(event) {
2176
+ this.buttonTwoClick.emit(event);
2177
+ }
2178
+ // Inner Editing table - BUTTONS
2179
+ onRowEdit(event) {
2180
+ this.table.editingRowKeys = { [event.id]: true };
2181
+ this.innerButtonEditClick.emit(event);
2182
+ }
2183
+ onRowSave(event, htmlTableRowElement) {
2184
+ this.innerButtonSaveClick.emit(event);
2185
+ setTimeout(() => {
2186
+ this.table.saveRowEdit(event, htmlTableRowElement);
2187
+ }, 200);
2188
+ }
2189
+ onRowDelete(event) {
2190
+ this.innerButtonDeleteClick.emit(event);
2191
+ }
2192
+ onRowCancel(event) {
2193
+ this.table.cancelRowEdit(event);
2194
+ }
2195
+ // Inner Caption
2196
+ clickInnerCaptionButton(event) {
2197
+ this.innerCaptionButtonClicked.emit(event);
2198
+ }
2199
+ // Inner Button column one
2200
+ clickInnerButtonOne(event) {
2201
+ this.innerButtonOneClick.emit(event);
2202
+ }
2203
+ // Inner Button column one
2204
+ clickInnerButtonTwo(event) {
2205
+ this.innerButtonTwoClick.emit(event);
2206
+ }
2207
+ // Deactivate toggle
2208
+ toggleEnable(event) {
2209
+ if (!event.$event.checked) {
2210
+ setTimeout(() => {
2211
+ this.onRowCancel(event.rowData);
2212
+ }, 100);
2213
+ }
2214
+ this.innerToggleSwitch.emit(event);
2215
+ }
2216
+ toggleTwoEnable(event) {
2217
+ if (!event.$event.checked) {
2218
+ setTimeout(() => {
2219
+ this.onRowCancel(event.rowData);
2220
+ }, 100);
2221
+ }
2222
+ this.innerToggleTwoSwitch.emit(event);
2223
+ }
2224
+ toggleThreeEnable(event) {
2225
+ if (!event.$event.checked) {
2226
+ setTimeout(() => {
2227
+ this.onRowCancel(event.rowData);
2228
+ }, 100);
2229
+ }
2230
+ this.innerToggleThreeSwitch.emit(event);
2231
+ }
2232
+ toggleFourEnable(event) {
2233
+ if (!event.$event.checked) {
2234
+ setTimeout(() => {
2235
+ this.onRowCancel(event.rowData);
2236
+ }, 100);
2237
+ }
2238
+ this.innerToggleFourSwitch.emit(event);
2239
+ }
2240
+ // Helper method for nested field structures
2241
+ getNestedValue(data, field) {
2242
+ if (!field) {
2243
+ return null;
2244
+ }
2245
+ const fields = field.split('.');
2246
+ let value = data;
2247
+ for (const f of fields) {
2248
+ // eslint-disable-next-line no-prototype-builtins
2249
+ if (value && value.hasOwnProperty(f)) {
2250
+ value = value[f];
2251
+ }
2252
+ else {
2253
+ return null;
2254
+ }
2255
+ }
2256
+ return value;
2257
+ }
2258
+ isMobile() {
2259
+ return window.innerWidth <= 768;
2260
+ }
2261
+ ngOnInit() {
2262
+ // If there is button just add it to the end of header list array
2263
+ const conditions = [
2264
+ this.isButtonOneVisible,
2265
+ this.isButtonTwoVisible,
2266
+ this.isArrowToggle,
2267
+ ];
2268
+ conditions.forEach((condition) => {
2269
+ if (condition) {
2270
+ this.emptyHeaderColumnList.push('');
2271
+ }
2272
+ });
2273
+ const conditionsInner = [this.innerIsButtonOneVisible, this.innerIsButtonTwoVisible];
2274
+ conditionsInner.forEach(condition => {
2275
+ if (condition) {
2276
+ this.innerEmptyHeaderColumnList.push('');
2277
+ }
2278
+ });
2279
+ }
2280
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ExpandedTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2281
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.6", type: ExpandedTableComponent, isStandalone: true, selector: "lib-expanded-table[tableData]", inputs: { tableData: "tableData", tableColumns: "tableColumns", isPaginatorVisible: "isPaginatorVisible", tableRowCount: "tableRowCount", isEnabledTable: "isEnabledTable", scrollable: "scrollable", scrollHeight: "scrollHeight", isTableLoading: "isTableLoading", mainCaptionColorClass: "mainCaptionColorClass", isEditingTable: "isEditingTable", hideColumnsOnMobile: "hideColumnsOnMobile", innerTableHideColumnsOnMobile: "innerTableHideColumnsOnMobile", tableCaption: "tableCaption", isTableHeaderVisible: "isTableHeaderVisible", emptyColumnWidth: "emptyColumnWidth", rowColor: "rowColor", isButtonOneVisible: "isButtonOneVisible", isPlainTableIconButtonOne: "isPlainTableIconButtonOne", buttonLabel: "buttonLabel", buttonOneLabel: "buttonOneLabel", buttonOneHasIcon: "buttonOneHasIcon", buttonOneColor: "buttonOneColor", buttonOneIcon: "buttonOneIcon", isButtonTwoVisible: "isButtonTwoVisible", buttonTwoLabel: "buttonTwoLabel", buttonTwoHasIcon: "buttonTwoHasIcon", buttonTwoColor: "buttonTwoColor", buttonTwoIcon: "buttonTwoIcon", isButtonTwoToggle: "isButtonTwoToggle", isArrowToggle: "isArrowToggle", innerTableStyle: "innerTableStyle", innerTableColumns: "innerTableColumns", innerIsPaginatorVisible: "innerIsPaginatorVisible", innerTableRowCount: "innerTableRowCount", innerScrollable: "innerScrollable", innerScrollHeight: "innerScrollHeight", innerIsEditingTable: "innerIsEditingTable", innerIsTableLoading: "innerIsTableLoading", innerTableCaption: "innerTableCaption", innerCaptionColorClass: "innerCaptionColorClass", innerIsCaptionButtonVisible: "innerIsCaptionButtonVisible", innerCaptionButtonLabel: "innerCaptionButtonLabel", innerCaptionButtonColor: "innerCaptionButtonColor", innerIsTableHeaderVisible: "innerIsTableHeaderVisible", innerEmptyColumnWidth: "innerEmptyColumnWidth", innerToggleTableHeaderName: "innerToggleTableHeaderName", innerToggleWidth: "innerToggleWidth", innerToggleTwoTableHeaderName: "innerToggleTwoTableHeaderName", innerToggleTwoWidth: "innerToggleTwoWidth", innerToggleThreeTableHeaderName: "innerToggleThreeTableHeaderName", innerToggleThreeWidth: "innerToggleThreeWidth", innerToggleFourTableHeaderName: "innerToggleFourTableHeaderName", innerToggleFourWidth: "innerToggleFourWidth", innerFormGroup: "innerFormGroup", innerType: "innerType", innerFormStatus: "innerFormStatus", innerIsButtonOneVisible: "innerIsButtonOneVisible", innerIsPlainTableIconButtonOne: "innerIsPlainTableIconButtonOne", innerButtonOneLabel: "innerButtonOneLabel", innerButtonOneHasIcon: "innerButtonOneHasIcon", innerButtonOneEditIcon: "innerButtonOneEditIcon", innerButtonOneSaveIcon: "innerButtonOneSaveIcon", innerButtonOneColor: "innerButtonOneColor", innerButtonOneIcon: "innerButtonOneIcon", innerIsButtonTwoVisible: "innerIsButtonTwoVisible", innerIsPlainTableIconButtonTwo: "innerIsPlainTableIconButtonTwo", innerButtonTwoLabel: "innerButtonTwoLabel", innerButtonTwoHasIcon: "innerButtonTwoHasIcon", innerButtonTwoDeleteIcon: "innerButtonTwoDeleteIcon", innerButtonTwoCancelIcon: "innerButtonTwoCancelIcon", innerButtonTwoColor: "innerButtonTwoColor", innerButtonTwoIcon: "innerButtonTwoIcon", innerIsDeactivateToggle: "innerIsDeactivateToggle", innerIsDeactivateToggleTwo: "innerIsDeactivateToggleTwo", innerIsDeactivateToggleThree: "innerIsDeactivateToggleThree", innerIsDeactivateToggleFour: "innerIsDeactivateToggleFour" }, outputs: { buttonOneClick: "buttonOneClick", buttonTwoClick: "buttonTwoClick", innerCaptionButtonClicked: "innerCaptionButtonClicked", innerButtonEditClick: "innerButtonEditClick", innerButtonSaveClick: "innerButtonSaveClick", innerButtonOneClick: "innerButtonOneClick", innerButtonDeleteClick: "innerButtonDeleteClick", innerButtonTwoClick: "innerButtonTwoClick", innerToggleSwitch: "innerToggleSwitch", innerToggleTwoSwitch: "innerToggleTwoSwitch", innerToggleThreeSwitch: "innerToggleThreeSwitch", innerToggleFourSwitch: "innerToggleFourSwitch" }, viewQueries: [{ propertyName: "table", first: true, predicate: ["dt"], descendants: true }], ngImport: i0, template: "<p-table\r\n #dt\r\n [value]=\"tableData\"\r\n [paginator]=\"isPaginatorVisible\"\r\n [rows]=\"tableRowCount\"\r\n [showCurrentPageReport]=\"false\"\r\n [scrollable]=\"scrollable\"\r\n [scrollHeight]=\"scrollHeight\"\r\n [ngClass]=\"mainCaptionColorClass\"\r\n dataKey=\"id\"\r\n [loading]=\"isTableLoading\"\r\n>\r\n <ng-template pTemplate=\"caption\" *ngIf=\"!!tableCaption\">{{ tableCaption }}</ng-template>\r\n <ng-template pTemplate=\"header\" *ngIf=\"isTableHeaderVisible\">\r\n <tr>\r\n <ng-container *ngFor=\"let column of tableColumns\">\r\n <ng-container *ngIf=\"!(column.hideOnMobile && isMobile() && hideColumnsOnMobile)\">\r\n <th scope=\"col\" [style.width]=\"column.width\">\r\n {{ column.header | translate }}\r\n </th>\r\n </ng-container>\r\n\r\n </ng-container>\r\n <th *ngFor=\"let _ of emptyHeaderColumnList\" scope=\"col\" [style.width]=\"emptyColumnWidth\"></th>\r\n </tr>\r\n </ng-template>\r\n <ng-template pTemplate=\"body\" let-rowData let-expanded=\"expanded\">\r\n <tr [ngClass]=\"rowColor\">\r\n <ng-container *ngFor=\"let column of tableColumns; let colIndex = index\">\r\n <ng-container *ngIf=\"!(column.hideOnMobile && isMobile() && hideColumnsOnMobile)\">\r\n <td [class.disabled-row]=\"isEditingTable && !rowData?.isEnabled\">\r\n {{ column.suffix ? getNestedValue(rowData, column.field) + ' ' + column.suffix : getNestedValue(rowData, column.field) }}\r\n </td>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <!-- Main table - Button column one -->\r\n <ng-container *ngIf=\"isButtonOneVisible\">\r\n <td [class.disabled-row]=\"isEditingTable && !rowData?.isEnabled\">\r\n <lib-button\r\n [label]=\"buttonOneLabel!\"\r\n [hasIcon]=\"buttonOneHasIcon!\"\r\n [color]=\"buttonOneColor!\"\r\n [icon]=\"buttonOneIcon!\"\r\n (click)=\"clickButtonOne(rowData)\"\r\n ></lib-button>\r\n </td>\r\n </ng-container>\r\n\r\n <!-- Main table - Button column two -->\r\n <ng-container *ngIf=\"isButtonTwoVisible\">\r\n <td [class.disabled-row]=\"isEditingTable && !rowData?.isEnabled\">\r\n <lib-button\r\n [pRowToggler]=\"isButtonTwoToggle ? rowData : null\"\r\n [label]=\"buttonTwoLabel!\"\r\n [hasIcon]=\"buttonTwoHasIcon!\"\r\n [color]=\"buttonTwoColor!\"\r\n [icon]=\"buttonTwoIcon!\"\r\n (click)=\"clickButtonTwo(rowData)\"\r\n ></lib-button>\r\n </td>\r\n </ng-container>\r\n\r\n <!-- Main table - Button column three - Arrow -->\r\n <ng-container *ngIf=\"isArrowToggle\">\r\n <td [ngStyle]=\"{ 'width': '20px' }\">\r\n <i class=\"pi\" [ngClass]=\"expanded ? 'pi pi-chevron-up' : 'pi pi-chevron-down'\"\r\n [pRowToggler]=\"!rowData['isEnabled'] ? null : rowData\"></i>\r\n </td>\r\n </ng-container>\r\n </tr>\r\n </ng-template>\r\n\r\n <!-- Inner table-->\r\n <ng-template pTemplate=\"rowexpansion\" let-rowData>\r\n <tr>\r\n <td colspan=\"7\">\r\n <lib-custom-table\r\n #dt\r\n #htmlTableRowElement\r\n [tableData]=\"rowData.other\"\r\n [tableColumns]=\"innerTableColumns\"\r\n [isPaginatorVisible]=\"innerIsPaginatorVisible\"\r\n [tableRowCount]=\"innerTableRowCount\"\r\n [isEditingTable]=\"innerIsEditingTable\"\r\n [isTableLoading]=\"innerIsTableLoading\"\r\n [scrollable]=\"true\"\r\n [hideColumnsOnMobile]=\"innerTableHideColumnsOnMobile\"\r\n tableMinWidth=\"10rem\"\r\n\r\n [tableCaption]=\"innerTableCaption\"\r\n [captionColorClass]=\"innerCaptionColorClass\"\r\n [isCaptionButtonVisible]=\"innerIsCaptionButtonVisible\"\r\n [captionButtonColor]=\"innerCaptionButtonColor\"\r\n (captionButtonClicked)=\"clickInnerCaptionButton($event)\"\r\n\r\n [isTableHeaderVisible]=\"innerIsTableHeaderVisible\"\r\n [emptyColumnWidth]=\"innerEmptyColumnWidth\"\r\n\r\n [toggleTableHeaderName]=\"innerToggleTableHeaderName\"\r\n [toggleWidth]=\"innerToggleWidth\"\r\n\r\n [toggleTwoTableHeaderName]=\"innerToggleTwoTableHeaderName\"\r\n [toggleTwoWidth]=\"innerToggleTwoWidth\"\r\n\r\n [toggleThreeTableHeaderName]=\"innerToggleThreeTableHeaderName\"\r\n [toggleThreeWidth]=\"innerToggleThreeWidth\"\r\n\r\n [toggleFourTableHeaderName]=\"innerToggleFourTableHeaderName\"\r\n [toggleFourWidth]=\"innerToggleFourWidth\"\r\n\r\n [formGroup]=\"innerFormGroup\"\r\n\r\n [type]=\"innerType\"\r\n [formStatus]=\"innerFormStatus\"\r\n\r\n [isButtonOneVisible]=\"innerIsButtonOneVisible\"\r\n [isPlainTableIconButtonOne]=\"innerIsPlainTableIconButtonOne\"\r\n [buttonOneLabel]=\"innerButtonOneLabel\"\r\n [buttonOneHasIcon]=\"innerButtonOneHasIcon\"\r\n [buttonOneEditIcon]=\"innerButtonOneEditIcon\"\r\n [buttonOneSaveIcon]=\"innerButtonOneSaveIcon\"\r\n [buttonOneColor]=\"innerButtonOneColor\"\r\n [buttonOneIcon]=\"innerButtonOneIcon\"\r\n (buttonEditClick)=\"onRowEdit($event)\"\r\n (buttonSaveClick)=\"onRowSave($event, htmlTableRowElement)\"\r\n (buttonOneClick)=\"clickInnerButtonOne($event)\"\r\n\r\n [isButtonTwoVisible]=\"innerIsButtonTwoVisible\"\r\n [isPlainTableIconButtonTwo]=\"innerIsPlainTableIconButtonTwo\"\r\n [buttonTwoLabel]=\"innerButtonTwoLabel\"\r\n [buttonTwoHasIcon]=\"innerButtonTwoHasIcon\"\r\n [buttonTwoDeleteIcon]=\"innerButtonTwoDeleteIcon\"\r\n [buttonTwoCancelIcon]=\"innerButtonTwoCancelIcon\"\r\n [buttonTwoColor]=\"innerButtonTwoColor\"\r\n [buttonTwoIcon]=\"innerButtonTwoIcon\"\r\n (buttonDeleteClick)=\"onRowDelete($event)\"\r\n (buttonTwoClick)=\"clickInnerButtonTwo($event)\"\r\n\r\n [isDeactivateToggle]=\"innerIsDeactivateToggle\"\r\n (toggleSwitch)=\"toggleEnable($event)\"\r\n\r\n [isDeactivateToggleTwo]=\"innerIsDeactivateToggleTwo\"\r\n (toggleTwoSwitch)=\"toggleTwoEnable($event)\"\r\n\r\n [isDeactivateToggleThree]=\"innerIsDeactivateToggleThree\"\r\n (toggleThreeSwitch)=\"toggleThreeEnable($event)\"\r\n\r\n [isDeactivateToggleFour]=\"innerIsDeactivateToggleFour\"\r\n (toggleFourSwitch)=\"toggleFourEnable($event)\"\r\n ></lib-custom-table>\r\n </td>\r\n </tr>\r\n </ng-template>\r\n</p-table>\r\n\r\n", styles: [":host ::ng-deep .p-datatable{border:1px solid #3E7C94;border-radius:12px;overflow:hidden;padding:0}:host ::ng-deep .p-datatable .p-datatable-header{border-radius:10px 10px 0 0;border:none;color:#fff;padding:.5rem}:host ::ng-deep .p-datatable .p-datatable-header.danger_row_color{background:#f44336}:host ::ng-deep .p-datatable .p-datatable-header.warning_row_color{background:#fdca40}:host ::ng-deep .p-datatable .p-datatable-header.success_row_color{background:#66952e}:host ::ng-deep .p-datatable .p-datatable-thead>tr>th{background:#d9d9d9;border:none;color:#1b495a;font-weight:unset;padding:.5rem}:host ::ng-deep .p-datatable .p-datatable-tbody>tr{background:transparent}:host ::ng-deep .p-datatable .p-datatable-tbody>tr.danger_row_color{background:#f44336}:host ::ng-deep .p-datatable .p-datatable-tbody>tr.warning_row_color{background:#fdca40}:host ::ng-deep .p-datatable .p-datatable-tbody>tr.success_row_color{background:#66952e}:host ::ng-deep .p-datatable .p-datatable-tbody>tr>td{border-color:#3e7c94;padding:.5rem}:host ::ng-deep .p-datatable .p-datatable-tbody>tr:first-child>td{border-color:transparent}:host ::ng-deep .p-paginator{background:transparent}:host ::ng-deep .p-paginator .p-paginator-pages .p-paginator-page.p-highlight{background:#3e7c94;border-color:#3e7c94}\n"], dependencies: [{ kind: "ngmodule", type: TableModule }, { kind: "component", type: i1$6.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "virtualRowHeight", "selectAll"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i1$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i1$6.RowToggler, selector: "[pRowToggler]", inputs: ["pRowToggler", "pRowTogglerDisabled"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: ButtonComponent, selector: "lib-button", inputs: ["hasIcon", "label", "color", "icon", "iconPos", "disabled", "isLoading", "styleClass", "size", "accessibilityText", "buttonType", "isAccessible", "isSelected", "ariaControlsId", "isExpanded", "link", "isTextareaClear"], outputs: ["clickEvent"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: CustomTableComponent, selector: "lib-custom-table[tableData][tableColumns]", inputs: ["tableData", "tableColumns", "isPaginatorVisible", "tableRowCount", "scrollable", "scrollHeight", "selectedProducts", "isEditingTable", "isTableLoading", "hideColumnsOnMobile", "tableMinWidth", "isVirtualScrollButtonVisible", "isVirtualScroll", "virtualScrollRowSize", "tableCaption", "captionColorClass", "isCaptionButtonVisible", "captionButtonLabel", "captionButtonColor", "isTableHeaderVisible", "emptyColumnWidth", "toggleTableHeaderName", "toggleWidth", "toggleTwoTableHeaderName", "toggleTwoWidth", "toggleThreeTableHeaderName", "toggleThreeWidth", "toggleFourTableHeaderName", "toggleFourWidth", "rowColor", "formGroup", "type", "formStatus", "tagColor", "isWarningTextVisible", "isButtonOneVisible", "buttonLabel", "buttonOneLabel", "buttonOneHasIcon", "buttonOneEditIcon", "buttonOneSaveIcon", "buttonOneColor", "buttonOneIcon", "isPlainTableIconButtonOne", "isPlainTableButtonOneLink", "isButtonTwoVisible", "buttonTwoLabel", "buttonTwoHasIcon", "buttonTwoDeleteIcon", "buttonTwoCancelIcon", "buttonTwoColor", "buttonTwoIcon", "isPlainTableIconButtonTwo", "isDeactivateToggle", "isDeactivateToggleTwo", "isDeactivateToggleThree", "isDeactivateToggleFour", "showEllipsisFullText"], outputs: ["captionButtonClicked", "buttonEditClick", "buttonSaveClick", "buttonOneClick", "buttonDeleteClick", "buttonTwoClick", "toggleSwitch", "toggleTwoSwitch", "toggleThreeSwitch", "toggleFourSwitch", "checkboxOne"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }] });
2282
+ }
2283
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ExpandedTableComponent, decorators: [{
2284
+ type: Component,
2285
+ args: [{ selector: 'lib-expanded-table[tableData]', imports: [
2286
+ TableModule,
2287
+ NgClass,
2288
+ NgIf,
2289
+ PrimeTemplate,
2290
+ NgFor,
2291
+ ButtonComponent,
2292
+ NgStyle,
2293
+ CustomTableComponent,
2294
+ FormsModule,
2295
+ ReactiveFormsModule,
2296
+ TranslateModule,
2297
+ ], template: "<p-table\r\n #dt\r\n [value]=\"tableData\"\r\n [paginator]=\"isPaginatorVisible\"\r\n [rows]=\"tableRowCount\"\r\n [showCurrentPageReport]=\"false\"\r\n [scrollable]=\"scrollable\"\r\n [scrollHeight]=\"scrollHeight\"\r\n [ngClass]=\"mainCaptionColorClass\"\r\n dataKey=\"id\"\r\n [loading]=\"isTableLoading\"\r\n>\r\n <ng-template pTemplate=\"caption\" *ngIf=\"!!tableCaption\">{{ tableCaption }}</ng-template>\r\n <ng-template pTemplate=\"header\" *ngIf=\"isTableHeaderVisible\">\r\n <tr>\r\n <ng-container *ngFor=\"let column of tableColumns\">\r\n <ng-container *ngIf=\"!(column.hideOnMobile && isMobile() && hideColumnsOnMobile)\">\r\n <th scope=\"col\" [style.width]=\"column.width\">\r\n {{ column.header | translate }}\r\n </th>\r\n </ng-container>\r\n\r\n </ng-container>\r\n <th *ngFor=\"let _ of emptyHeaderColumnList\" scope=\"col\" [style.width]=\"emptyColumnWidth\"></th>\r\n </tr>\r\n </ng-template>\r\n <ng-template pTemplate=\"body\" let-rowData let-expanded=\"expanded\">\r\n <tr [ngClass]=\"rowColor\">\r\n <ng-container *ngFor=\"let column of tableColumns; let colIndex = index\">\r\n <ng-container *ngIf=\"!(column.hideOnMobile && isMobile() && hideColumnsOnMobile)\">\r\n <td [class.disabled-row]=\"isEditingTable && !rowData?.isEnabled\">\r\n {{ column.suffix ? getNestedValue(rowData, column.field) + ' ' + column.suffix : getNestedValue(rowData, column.field) }}\r\n </td>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <!-- Main table - Button column one -->\r\n <ng-container *ngIf=\"isButtonOneVisible\">\r\n <td [class.disabled-row]=\"isEditingTable && !rowData?.isEnabled\">\r\n <lib-button\r\n [label]=\"buttonOneLabel!\"\r\n [hasIcon]=\"buttonOneHasIcon!\"\r\n [color]=\"buttonOneColor!\"\r\n [icon]=\"buttonOneIcon!\"\r\n (click)=\"clickButtonOne(rowData)\"\r\n ></lib-button>\r\n </td>\r\n </ng-container>\r\n\r\n <!-- Main table - Button column two -->\r\n <ng-container *ngIf=\"isButtonTwoVisible\">\r\n <td [class.disabled-row]=\"isEditingTable && !rowData?.isEnabled\">\r\n <lib-button\r\n [pRowToggler]=\"isButtonTwoToggle ? rowData : null\"\r\n [label]=\"buttonTwoLabel!\"\r\n [hasIcon]=\"buttonTwoHasIcon!\"\r\n [color]=\"buttonTwoColor!\"\r\n [icon]=\"buttonTwoIcon!\"\r\n (click)=\"clickButtonTwo(rowData)\"\r\n ></lib-button>\r\n </td>\r\n </ng-container>\r\n\r\n <!-- Main table - Button column three - Arrow -->\r\n <ng-container *ngIf=\"isArrowToggle\">\r\n <td [ngStyle]=\"{ 'width': '20px' }\">\r\n <i class=\"pi\" [ngClass]=\"expanded ? 'pi pi-chevron-up' : 'pi pi-chevron-down'\"\r\n [pRowToggler]=\"!rowData['isEnabled'] ? null : rowData\"></i>\r\n </td>\r\n </ng-container>\r\n </tr>\r\n </ng-template>\r\n\r\n <!-- Inner table-->\r\n <ng-template pTemplate=\"rowexpansion\" let-rowData>\r\n <tr>\r\n <td colspan=\"7\">\r\n <lib-custom-table\r\n #dt\r\n #htmlTableRowElement\r\n [tableData]=\"rowData.other\"\r\n [tableColumns]=\"innerTableColumns\"\r\n [isPaginatorVisible]=\"innerIsPaginatorVisible\"\r\n [tableRowCount]=\"innerTableRowCount\"\r\n [isEditingTable]=\"innerIsEditingTable\"\r\n [isTableLoading]=\"innerIsTableLoading\"\r\n [scrollable]=\"true\"\r\n [hideColumnsOnMobile]=\"innerTableHideColumnsOnMobile\"\r\n tableMinWidth=\"10rem\"\r\n\r\n [tableCaption]=\"innerTableCaption\"\r\n [captionColorClass]=\"innerCaptionColorClass\"\r\n [isCaptionButtonVisible]=\"innerIsCaptionButtonVisible\"\r\n [captionButtonColor]=\"innerCaptionButtonColor\"\r\n (captionButtonClicked)=\"clickInnerCaptionButton($event)\"\r\n\r\n [isTableHeaderVisible]=\"innerIsTableHeaderVisible\"\r\n [emptyColumnWidth]=\"innerEmptyColumnWidth\"\r\n\r\n [toggleTableHeaderName]=\"innerToggleTableHeaderName\"\r\n [toggleWidth]=\"innerToggleWidth\"\r\n\r\n [toggleTwoTableHeaderName]=\"innerToggleTwoTableHeaderName\"\r\n [toggleTwoWidth]=\"innerToggleTwoWidth\"\r\n\r\n [toggleThreeTableHeaderName]=\"innerToggleThreeTableHeaderName\"\r\n [toggleThreeWidth]=\"innerToggleThreeWidth\"\r\n\r\n [toggleFourTableHeaderName]=\"innerToggleFourTableHeaderName\"\r\n [toggleFourWidth]=\"innerToggleFourWidth\"\r\n\r\n [formGroup]=\"innerFormGroup\"\r\n\r\n [type]=\"innerType\"\r\n [formStatus]=\"innerFormStatus\"\r\n\r\n [isButtonOneVisible]=\"innerIsButtonOneVisible\"\r\n [isPlainTableIconButtonOne]=\"innerIsPlainTableIconButtonOne\"\r\n [buttonOneLabel]=\"innerButtonOneLabel\"\r\n [buttonOneHasIcon]=\"innerButtonOneHasIcon\"\r\n [buttonOneEditIcon]=\"innerButtonOneEditIcon\"\r\n [buttonOneSaveIcon]=\"innerButtonOneSaveIcon\"\r\n [buttonOneColor]=\"innerButtonOneColor\"\r\n [buttonOneIcon]=\"innerButtonOneIcon\"\r\n (buttonEditClick)=\"onRowEdit($event)\"\r\n (buttonSaveClick)=\"onRowSave($event, htmlTableRowElement)\"\r\n (buttonOneClick)=\"clickInnerButtonOne($event)\"\r\n\r\n [isButtonTwoVisible]=\"innerIsButtonTwoVisible\"\r\n [isPlainTableIconButtonTwo]=\"innerIsPlainTableIconButtonTwo\"\r\n [buttonTwoLabel]=\"innerButtonTwoLabel\"\r\n [buttonTwoHasIcon]=\"innerButtonTwoHasIcon\"\r\n [buttonTwoDeleteIcon]=\"innerButtonTwoDeleteIcon\"\r\n [buttonTwoCancelIcon]=\"innerButtonTwoCancelIcon\"\r\n [buttonTwoColor]=\"innerButtonTwoColor\"\r\n [buttonTwoIcon]=\"innerButtonTwoIcon\"\r\n (buttonDeleteClick)=\"onRowDelete($event)\"\r\n (buttonTwoClick)=\"clickInnerButtonTwo($event)\"\r\n\r\n [isDeactivateToggle]=\"innerIsDeactivateToggle\"\r\n (toggleSwitch)=\"toggleEnable($event)\"\r\n\r\n [isDeactivateToggleTwo]=\"innerIsDeactivateToggleTwo\"\r\n (toggleTwoSwitch)=\"toggleTwoEnable($event)\"\r\n\r\n [isDeactivateToggleThree]=\"innerIsDeactivateToggleThree\"\r\n (toggleThreeSwitch)=\"toggleThreeEnable($event)\"\r\n\r\n [isDeactivateToggleFour]=\"innerIsDeactivateToggleFour\"\r\n (toggleFourSwitch)=\"toggleFourEnable($event)\"\r\n ></lib-custom-table>\r\n </td>\r\n </tr>\r\n </ng-template>\r\n</p-table>\r\n\r\n", styles: [":host ::ng-deep .p-datatable{border:1px solid #3E7C94;border-radius:12px;overflow:hidden;padding:0}:host ::ng-deep .p-datatable .p-datatable-header{border-radius:10px 10px 0 0;border:none;color:#fff;padding:.5rem}:host ::ng-deep .p-datatable .p-datatable-header.danger_row_color{background:#f44336}:host ::ng-deep .p-datatable .p-datatable-header.warning_row_color{background:#fdca40}:host ::ng-deep .p-datatable .p-datatable-header.success_row_color{background:#66952e}:host ::ng-deep .p-datatable .p-datatable-thead>tr>th{background:#d9d9d9;border:none;color:#1b495a;font-weight:unset;padding:.5rem}:host ::ng-deep .p-datatable .p-datatable-tbody>tr{background:transparent}:host ::ng-deep .p-datatable .p-datatable-tbody>tr.danger_row_color{background:#f44336}:host ::ng-deep .p-datatable .p-datatable-tbody>tr.warning_row_color{background:#fdca40}:host ::ng-deep .p-datatable .p-datatable-tbody>tr.success_row_color{background:#66952e}:host ::ng-deep .p-datatable .p-datatable-tbody>tr>td{border-color:#3e7c94;padding:.5rem}:host ::ng-deep .p-datatable .p-datatable-tbody>tr:first-child>td{border-color:transparent}:host ::ng-deep .p-paginator{background:transparent}:host ::ng-deep .p-paginator .p-paginator-pages .p-paginator-page.p-highlight{background:#3e7c94;border-color:#3e7c94}\n"] }]
2298
+ }], propDecorators: { tableData: [{
2299
+ type: Input
2300
+ }], tableColumns: [{
2301
+ type: Input
2302
+ }], isPaginatorVisible: [{
2303
+ type: Input
2304
+ }], tableRowCount: [{
2305
+ type: Input
2306
+ }], isEnabledTable: [{
2307
+ type: Input
2308
+ }], scrollable: [{
2309
+ type: Input
2310
+ }], scrollHeight: [{
2311
+ type: Input
2312
+ }], isTableLoading: [{
2313
+ type: Input
2314
+ }], mainCaptionColorClass: [{
2315
+ type: Input
2316
+ }], isEditingTable: [{
2317
+ type: Input
2318
+ }], hideColumnsOnMobile: [{
2319
+ type: Input
2320
+ }], innerTableHideColumnsOnMobile: [{
2321
+ type: Input
2322
+ }], tableCaption: [{
2323
+ type: Input
2324
+ }], isTableHeaderVisible: [{
2325
+ type: Input
2326
+ }], emptyColumnWidth: [{
2327
+ type: Input
2328
+ }], rowColor: [{
2329
+ type: Input
2330
+ }], isButtonOneVisible: [{
2331
+ type: Input
2332
+ }], isPlainTableIconButtonOne: [{
2333
+ type: Input
2334
+ }], buttonLabel: [{
2335
+ type: Input
2336
+ }], buttonOneLabel: [{
2337
+ type: Input
2338
+ }], buttonOneHasIcon: [{
2339
+ type: Input
2340
+ }], buttonOneColor: [{
2341
+ type: Input
2342
+ }], buttonOneIcon: [{
2343
+ type: Input
2344
+ }], buttonOneClick: [{
2345
+ type: Output
2346
+ }], isButtonTwoVisible: [{
2347
+ type: Input
2348
+ }], buttonTwoLabel: [{
2349
+ type: Input
2350
+ }], buttonTwoHasIcon: [{
2351
+ type: Input
2352
+ }], buttonTwoColor: [{
2353
+ type: Input
2354
+ }], buttonTwoIcon: [{
2355
+ type: Input
2356
+ }], isButtonTwoToggle: [{
2357
+ type: Input
2358
+ }], buttonTwoClick: [{
2359
+ type: Output
2360
+ }], isArrowToggle: [{
2361
+ type: Input
2362
+ }], table: [{
2363
+ type: ViewChild,
2364
+ args: ['dt', { static: false }]
2365
+ }], innerTableStyle: [{
2366
+ type: Input
2367
+ }], innerTableColumns: [{
2368
+ type: Input
2369
+ }], innerIsPaginatorVisible: [{
2370
+ type: Input
2371
+ }], innerTableRowCount: [{
2372
+ type: Input
2373
+ }], innerScrollable: [{
2374
+ type: Input
2375
+ }], innerScrollHeight: [{
2376
+ type: Input
2377
+ }], innerIsEditingTable: [{
2378
+ type: Input
2379
+ }], innerIsTableLoading: [{
2380
+ type: Input
2381
+ }], innerTableCaption: [{
2382
+ type: Input
2383
+ }], innerCaptionColorClass: [{
2384
+ type: Input
2385
+ }], innerIsCaptionButtonVisible: [{
2386
+ type: Input
2387
+ }], innerCaptionButtonLabel: [{
2388
+ type: Input
2389
+ }], innerCaptionButtonColor: [{
2390
+ type: Input
2391
+ }], innerCaptionButtonClicked: [{
2392
+ type: Output
2393
+ }], innerIsTableHeaderVisible: [{
2394
+ type: Input
2395
+ }], innerEmptyColumnWidth: [{
2396
+ type: Input
2397
+ }], innerToggleTableHeaderName: [{
2398
+ type: Input
2399
+ }], innerToggleWidth: [{
2400
+ type: Input
2401
+ }], innerToggleTwoTableHeaderName: [{
2402
+ type: Input
2403
+ }], innerToggleTwoWidth: [{
2404
+ type: Input
2405
+ }], innerToggleThreeTableHeaderName: [{
2406
+ type: Input
2407
+ }], innerToggleThreeWidth: [{
2408
+ type: Input
2409
+ }], innerToggleFourTableHeaderName: [{
2410
+ type: Input
2411
+ }], innerToggleFourWidth: [{
2412
+ type: Input
2413
+ }], innerFormGroup: [{
2414
+ type: Input
2415
+ }], innerType: [{
2416
+ type: Input
2417
+ }], innerFormStatus: [{
2418
+ type: Input
2419
+ }], innerIsButtonOneVisible: [{
2420
+ type: Input
2421
+ }], innerIsPlainTableIconButtonOne: [{
2422
+ type: Input
2423
+ }], innerButtonOneLabel: [{
2424
+ type: Input
2425
+ }], innerButtonOneHasIcon: [{
2426
+ type: Input
2427
+ }], innerButtonOneEditIcon: [{
2428
+ type: Input
2429
+ }], innerButtonOneSaveIcon: [{
2430
+ type: Input
2431
+ }], innerButtonOneColor: [{
2432
+ type: Input
2433
+ }], innerButtonOneIcon: [{
2434
+ type: Input
2435
+ }], innerButtonEditClick: [{
2436
+ type: Output
2437
+ }], innerButtonSaveClick: [{
2438
+ type: Output
2439
+ }], innerButtonOneClick: [{
2440
+ type: Output
2441
+ }], innerIsButtonTwoVisible: [{
2442
+ type: Input
2443
+ }], innerIsPlainTableIconButtonTwo: [{
2444
+ type: Input
2445
+ }], innerButtonTwoLabel: [{
2446
+ type: Input
2447
+ }], innerButtonTwoHasIcon: [{
2448
+ type: Input
2449
+ }], innerButtonTwoDeleteIcon: [{
2450
+ type: Input
2451
+ }], innerButtonTwoCancelIcon: [{
2452
+ type: Input
2453
+ }], innerButtonTwoColor: [{
2454
+ type: Input
2455
+ }], innerButtonTwoIcon: [{
2456
+ type: Input
2457
+ }], innerButtonDeleteClick: [{
2458
+ type: Output
2459
+ }], innerButtonTwoClick: [{
2460
+ type: Output
2461
+ }], innerIsDeactivateToggle: [{
2462
+ type: Input
2463
+ }], innerToggleSwitch: [{
2464
+ type: Output
2465
+ }], innerIsDeactivateToggleTwo: [{
2466
+ type: Input
2467
+ }], innerToggleTwoSwitch: [{
2468
+ type: Output
2469
+ }], innerIsDeactivateToggleThree: [{
2470
+ type: Input
2471
+ }], innerToggleThreeSwitch: [{
2472
+ type: Output
2473
+ }], innerIsDeactivateToggleFour: [{
2474
+ type: Input
2475
+ }], innerToggleFourSwitch: [{
2476
+ type: Output
2477
+ }] } });
2478
+
2479
+ class LoaderComponent {
2480
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: LoaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2481
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.6", type: LoaderComponent, isStandalone: true, selector: "lib-loader", ngImport: i0, template: "<p-progressSpinner strokeWidth=\"5\" animationDuration=\"2.5s\"></p-progressSpinner>\r\n", styles: [":host ::ng-deep .p-progressspinner{width:35px;height:35px}:host ::ng-deep .p-progressspinner .p-progressspinner-spin .p-progressspinner-circle{stroke:#1b495a!important}\n"], dependencies: [{ kind: "component", type: ProgressSpinner, selector: "p-progressSpinner, p-progress-spinner, p-progressspinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }] });
2482
+ }
2483
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: LoaderComponent, decorators: [{
2484
+ type: Component,
2485
+ args: [{ selector: 'lib-loader', imports: [ProgressSpinner], template: "<p-progressSpinner strokeWidth=\"5\" animationDuration=\"2.5s\"></p-progressSpinner>\r\n", styles: [":host ::ng-deep .p-progressspinner{width:35px;height:35px}:host ::ng-deep .p-progressspinner .p-progressspinner-spin .p-progressspinner-circle{stroke:#1b495a!important}\n"] }]
2486
+ }] });
2487
+
2488
+ class AccordionComponent {
2489
+ isHeaderEditable = false;
2490
+ isAccordionDeletable = false;
2491
+ isAccordionCloneable = false;
2492
+ headerTitle;
2493
+ selected = false;
2494
+ icon;
2495
+ headerTitlePlaceholder;
2496
+ headerTitleEditable;
2497
+ group;
2498
+ controlName;
2499
+ name;
2500
+ canDisable = false;
2501
+ toggleLabel = 'Label';
2502
+ toggleControlName;
2503
+ clickEvent = new EventEmitter();
2504
+ clickToggleEvent = new EventEmitter();
2505
+ clickCloneEvent = new EventEmitter();
2506
+ stateOptions = [
2507
+ { label: 'Ne', value: false },
2508
+ { label: 'Da', value: true },
2509
+ ];
2510
+ click(event) {
2511
+ this.clickEvent.emit(event);
2512
+ event.stopPropagation();
2513
+ }
2514
+ clickToggleButton(event) {
2515
+ this.clickToggleEvent.emit(event);
2516
+ event.stopPropagation();
2517
+ }
2518
+ clickCloneButton(event) {
2519
+ this.clickCloneEvent.emit(event);
2520
+ event.stopPropagation();
2521
+ }
2522
+ ButtonColor = ButtonColor;
2523
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: AccordionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2524
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.6", type: AccordionComponent, isStandalone: true, selector: "lib-accordion[headerTitle]", inputs: { isHeaderEditable: "isHeaderEditable", isAccordionDeletable: "isAccordionDeletable", isAccordionCloneable: "isAccordionCloneable", headerTitle: "headerTitle", selected: "selected", icon: "icon", headerTitlePlaceholder: "headerTitlePlaceholder", headerTitleEditable: "headerTitleEditable", group: "group", controlName: "controlName", name: "name", canDisable: "canDisable", toggleLabel: "toggleLabel", toggleControlName: "toggleControlName" }, outputs: { clickEvent: "clickEvent", clickToggleEvent: "clickToggleEvent", clickCloneEvent: "clickCloneEvent" }, ngImport: i0, template: "<p-accordion class=\"w-full\" [value]=\"selected ? 1 : 0\" [id]=\"headerTitle\">\r\n <p-accordion-panel [value]=\"1\">\r\n <p-accordion-header>\r\n <div class=\"flex justify-content-between align-items-center overflow-auto\">\r\n <ng-container>\r\n <div class=\"flex align-items-center\" *ngIf=\"!isHeaderEditable\">\r\n <i [ngClass]=\"icon\"></i>\r\n <span class=\"vertical-align-middle\">{{ headerTitle }}</span>\r\n </div>\r\n <div class=\"flex align-items-center\" *ngIf=\"isHeaderEditable\" [formGroup]=\"group\">\r\n <i [ngClass]=\"icon\"></i>\r\n <input type=\"text\" pInputText [formControlName]=\"controlName\" (click)=\"$event.stopPropagation()\"\r\n (keydown.space)=\"$event.stopPropagation()\"/>\r\n </div>\r\n <i class=\"pi pi-ellipsis-v controls-mobile\" (click)=\"controlsMenu.toggle($event)\"\r\n *ngIf=\"canDisable || isAccordionDeletable\"></i>\r\n <div class=\"controls-lg-screen\">\r\n <ng-container *ngIf=\"canDisable || isAccordionDeletable\" [ngTemplateOutlet]=\"controls\"></ng-container>\r\n </div>\r\n </ng-container>\r\n </div>\r\n </p-accordion-header>\r\n <p-accordion-content>\r\n <ng-content></ng-content>\r\n </p-accordion-content>\r\n </p-accordion-panel>\r\n</p-accordion>\r\n\r\n<p-popover #controlsMenu>\r\n <ng-container [ngTemplateOutlet]=\"smallerDevicesControls\"></ng-container>\r\n</p-popover>\r\n\r\n<ng-template #controls>\r\n <div class=\"controls\">\r\n <div class=\"flex align-items-center\">\r\n <form [formGroup]=\"group\" class=\"flex align-items-center ml-5\" *ngIf=\"canDisable\">\r\n <label class=\"mr-2\">{{ toggleLabel }}</label>\r\n <p-selectButton\r\n (click)=\"clickToggleButton($event)\"\r\n [options]=\"stateOptions\"\r\n [formControlName]=\"toggleControlName\"\r\n optionLabel=\"label\"\r\n optionValue=\"value\"\r\n ></p-selectButton>\r\n </form>\r\n <lib-button\r\n *ngIf=\"isAccordionCloneable\"\r\n class=\"ml-5 clone-button\"\r\n label=\"Kopiraj okence\"\r\n [hasIcon]=\"true\"\r\n icon=\"pi pi-clone\"\r\n (clickEvent)=\"clickCloneButton($event)\"\r\n [color]=\"ButtonColor.warning\"\r\n ></lib-button>\r\n </div>\r\n\r\n <lib-button\r\n *ngIf=\"isAccordionDeletable\"\r\n class=\"ml-5 delete-button\"\r\n label=\"Izbri\u0161i okence\"\r\n [hasIcon]=\"true\"\r\n icon=\"pi pi-trash\"\r\n (clickEvent)=\"click($event)\"\r\n [color]=\"ButtonColor.danger\"\r\n ></lib-button>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #smallerDevicesControls>\r\n <div class=\"flex-column p-1\">\r\n <form [formGroup]=\"group\" class=\"flex align-items-center ml-5\" *ngIf=\"canDisable\">\r\n <label class=\"mr-2\">{{ toggleLabel }}</label>\r\n <p-selectButton\r\n (click)=\"clickToggleButton($event)\"\r\n [options]=\"stateOptions\"\r\n [formControlName]=\"toggleControlName\"\r\n optionLabel=\"label\"\r\n optionValue=\"value\"\r\n ></p-selectButton>\r\n </form>\r\n\r\n <div class=\"flex align-items-center mt-2\">\r\n <lib-button\r\n *ngIf=\"isAccordionCloneable\"\r\n class=\"clone-button\"\r\n label=\"Kopiraj okence\"\r\n [hasIcon]=\"true\"\r\n icon=\"pi pi-clone\"\r\n (clickEvent)=\"clickCloneButton($event)\"\r\n [color]=\"ButtonColor.warning\"\r\n ></lib-button>\r\n\r\n <lib-button\r\n *ngIf=\"isAccordionDeletable\"\r\n class=\"ml-2 delete-button\"\r\n label=\"Izbri\u0161i okence\"\r\n [hasIcon]=\"true\"\r\n icon=\"pi pi-trash\"\r\n (clickEvent)=\"click($event)\"\r\n [color]=\"ButtonColor.danger\"\r\n ></lib-button>\r\n </div>\r\n </div>\r\n</ng-template>\r\n", styles: [":host ::ng-deep .p-accordionpanel:not(.p-disabled).p-accordionpanel-active>.p-accordionheader{color:#fff!important;background-color:#3e7c94}:host ::ng-deep .p-accordion .p-accordionheader{background-color:#3e7c94;color:#fff}:host ::ng-deep .p-accordion .p-accordionheader:focus{box-shadow:0 0 2px 3px #ffa142!important}:host ::ng-deep .p-accordion .p-accordionheader:hover{background:#facd9c!important}:host ::ng-deep .p-accordion .p-accordionheader:not(.p-disabled).p-highlight .p-accordionheader-link{color:#fff}:host ::ng-deep .p-accordion .p-accordionheader .p-accordion-toggle-icon{margin-top:-8px;position:absolute;right:.5em;top:50%}:host ::ng-deep .p-accordion .p-accordionheader .delete-button{position:absolute;right:8em;top:50%;transform:translateY(-50%)}:host ::ng-deep .p-accordion .p-accordionheader .pi-chevron-right{transform:rotate(90deg)}:host ::ng-deep .p-accordion .p-accordionheader .pi-chevron-down{transform:rotate(180deg)}:host ::ng-deep .p-accordion .p-accordioncontent-content{margin-top:8px}@media screen and (max-width: 1260px){:host ::ng-deep .p-inputtext,:host ::ng-deep label{font-size:12px}:host ::ng-deep .delete-button .p-button,:host ::ng-deep .clone-button .p-button{font-size:12px}:host ::ng-deep .delete-button .p-button .p-button-label,:host ::ng-deep .clone-button .p-button .p-button-label{display:none}:host ::ng-deep .delete-button .p-button .p-button-icon,:host ::ng-deep .clone-button .p-button .p-button-icon{margin-left:0}}:host ::ng-deep .p-selectbutton .p-button{background:#fff;color:#3e7c94}@media screen and (max-width: 1260px){:host ::ng-deep .p-selectbutton .p-button{font-size:12px}}:host ::ng-deep .p-selectbutton .p-button.p-highlight{background:#ffa142;color:#fff}.controls{display:flex;align-items:center;justify-content:space-between}@media screen and (max-width: 1260px){.controls{flex-direction:column;justify-content:start;align-items:start}.controls form,.controls .delete-button{margin:0!important;padding:5px 15px!important}.controls form{border-bottom:1px solid #3E7C94}}.controls-mobile{display:none}@media screen and (max-width: 1260px){.controls-mobile{margin-left:15px;display:block}}.controls-lg-screen{display:block}@media screen and (max-width: 1260px){.controls-lg-screen{display:none}}\n"], dependencies: [{ kind: "component", type: Accordion, selector: "p-accordion", inputs: ["value", "multiple", "style", "styleClass", "expandIcon", "collapseIcon", "selectOnFocus", "transitionOptions", "activeIndex", "headerAriaLevel"], outputs: ["valueChange", "activeIndexChange", "onClose", "onOpen"] }, { kind: "ngmodule", type: AccordionModule }, { kind: "component", type: i1$7.AccordionPanel, selector: "p-accordion-panel, p-accordionpanel", inputs: ["value", "disabled"], outputs: ["valueChange"] }, { kind: "component", type: i1$7.AccordionHeader, selector: "p-accordion-header, p-accordionheader" }, { kind: "component", type: i1$7.AccordionContent, selector: "p-accordion-content, p-accordioncontent" }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: InputText, selector: "[pInputText]", inputs: ["variant", "fluid", "pSize"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: PopoverModule }, { kind: "component", type: i3$1.Popover, selector: "p-popover", inputs: ["ariaLabel", "ariaLabelledBy", "dismissable", "style", "styleClass", "appendTo", "autoZIndex", "ariaCloseLabel", "baseZIndex", "focusOnShow", "showTransitionOptions", "hideTransitionOptions"], outputs: ["onShow", "onHide"] }, { kind: "component", type: SelectButton, selector: "p-selectButton, p-selectbutton, p-select-button", inputs: ["options", "optionLabel", "optionValue", "optionDisabled", "unselectable", "tabindex", "multiple", "allowEmpty", "style", "styleClass", "ariaLabelledBy", "size", "disabled", "dataKey", "autofocus"], outputs: ["onOptionClick", "onChange"] }, { kind: "component", type: ButtonComponent, selector: "lib-button", inputs: ["hasIcon", "label", "color", "icon", "iconPos", "disabled", "isLoading", "styleClass", "size", "accessibilityText", "buttonType", "isAccessible", "isSelected", "ariaControlsId", "isExpanded", "link", "isTextareaClear"], outputs: ["clickEvent"] }] });
2525
+ }
2526
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: AccordionComponent, decorators: [{
2527
+ type: Component,
2528
+ args: [{ selector: 'lib-accordion[headerTitle]', imports: [
2529
+ Accordion,
2530
+ AccordionModule,
2531
+ NgIf,
2532
+ NgClass,
2533
+ FormsModule,
2534
+ ReactiveFormsModule,
2535
+ InputText,
2536
+ NgTemplateOutlet,
2537
+ PopoverModule,
2538
+ SelectButton,
2539
+ ButtonComponent,
2540
+ ], template: "<p-accordion class=\"w-full\" [value]=\"selected ? 1 : 0\" [id]=\"headerTitle\">\r\n <p-accordion-panel [value]=\"1\">\r\n <p-accordion-header>\r\n <div class=\"flex justify-content-between align-items-center overflow-auto\">\r\n <ng-container>\r\n <div class=\"flex align-items-center\" *ngIf=\"!isHeaderEditable\">\r\n <i [ngClass]=\"icon\"></i>\r\n <span class=\"vertical-align-middle\">{{ headerTitle }}</span>\r\n </div>\r\n <div class=\"flex align-items-center\" *ngIf=\"isHeaderEditable\" [formGroup]=\"group\">\r\n <i [ngClass]=\"icon\"></i>\r\n <input type=\"text\" pInputText [formControlName]=\"controlName\" (click)=\"$event.stopPropagation()\"\r\n (keydown.space)=\"$event.stopPropagation()\"/>\r\n </div>\r\n <i class=\"pi pi-ellipsis-v controls-mobile\" (click)=\"controlsMenu.toggle($event)\"\r\n *ngIf=\"canDisable || isAccordionDeletable\"></i>\r\n <div class=\"controls-lg-screen\">\r\n <ng-container *ngIf=\"canDisable || isAccordionDeletable\" [ngTemplateOutlet]=\"controls\"></ng-container>\r\n </div>\r\n </ng-container>\r\n </div>\r\n </p-accordion-header>\r\n <p-accordion-content>\r\n <ng-content></ng-content>\r\n </p-accordion-content>\r\n </p-accordion-panel>\r\n</p-accordion>\r\n\r\n<p-popover #controlsMenu>\r\n <ng-container [ngTemplateOutlet]=\"smallerDevicesControls\"></ng-container>\r\n</p-popover>\r\n\r\n<ng-template #controls>\r\n <div class=\"controls\">\r\n <div class=\"flex align-items-center\">\r\n <form [formGroup]=\"group\" class=\"flex align-items-center ml-5\" *ngIf=\"canDisable\">\r\n <label class=\"mr-2\">{{ toggleLabel }}</label>\r\n <p-selectButton\r\n (click)=\"clickToggleButton($event)\"\r\n [options]=\"stateOptions\"\r\n [formControlName]=\"toggleControlName\"\r\n optionLabel=\"label\"\r\n optionValue=\"value\"\r\n ></p-selectButton>\r\n </form>\r\n <lib-button\r\n *ngIf=\"isAccordionCloneable\"\r\n class=\"ml-5 clone-button\"\r\n label=\"Kopiraj okence\"\r\n [hasIcon]=\"true\"\r\n icon=\"pi pi-clone\"\r\n (clickEvent)=\"clickCloneButton($event)\"\r\n [color]=\"ButtonColor.warning\"\r\n ></lib-button>\r\n </div>\r\n\r\n <lib-button\r\n *ngIf=\"isAccordionDeletable\"\r\n class=\"ml-5 delete-button\"\r\n label=\"Izbri\u0161i okence\"\r\n [hasIcon]=\"true\"\r\n icon=\"pi pi-trash\"\r\n (clickEvent)=\"click($event)\"\r\n [color]=\"ButtonColor.danger\"\r\n ></lib-button>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #smallerDevicesControls>\r\n <div class=\"flex-column p-1\">\r\n <form [formGroup]=\"group\" class=\"flex align-items-center ml-5\" *ngIf=\"canDisable\">\r\n <label class=\"mr-2\">{{ toggleLabel }}</label>\r\n <p-selectButton\r\n (click)=\"clickToggleButton($event)\"\r\n [options]=\"stateOptions\"\r\n [formControlName]=\"toggleControlName\"\r\n optionLabel=\"label\"\r\n optionValue=\"value\"\r\n ></p-selectButton>\r\n </form>\r\n\r\n <div class=\"flex align-items-center mt-2\">\r\n <lib-button\r\n *ngIf=\"isAccordionCloneable\"\r\n class=\"clone-button\"\r\n label=\"Kopiraj okence\"\r\n [hasIcon]=\"true\"\r\n icon=\"pi pi-clone\"\r\n (clickEvent)=\"clickCloneButton($event)\"\r\n [color]=\"ButtonColor.warning\"\r\n ></lib-button>\r\n\r\n <lib-button\r\n *ngIf=\"isAccordionDeletable\"\r\n class=\"ml-2 delete-button\"\r\n label=\"Izbri\u0161i okence\"\r\n [hasIcon]=\"true\"\r\n icon=\"pi pi-trash\"\r\n (clickEvent)=\"click($event)\"\r\n [color]=\"ButtonColor.danger\"\r\n ></lib-button>\r\n </div>\r\n </div>\r\n</ng-template>\r\n", styles: [":host ::ng-deep .p-accordionpanel:not(.p-disabled).p-accordionpanel-active>.p-accordionheader{color:#fff!important;background-color:#3e7c94}:host ::ng-deep .p-accordion .p-accordionheader{background-color:#3e7c94;color:#fff}:host ::ng-deep .p-accordion .p-accordionheader:focus{box-shadow:0 0 2px 3px #ffa142!important}:host ::ng-deep .p-accordion .p-accordionheader:hover{background:#facd9c!important}:host ::ng-deep .p-accordion .p-accordionheader:not(.p-disabled).p-highlight .p-accordionheader-link{color:#fff}:host ::ng-deep .p-accordion .p-accordionheader .p-accordion-toggle-icon{margin-top:-8px;position:absolute;right:.5em;top:50%}:host ::ng-deep .p-accordion .p-accordionheader .delete-button{position:absolute;right:8em;top:50%;transform:translateY(-50%)}:host ::ng-deep .p-accordion .p-accordionheader .pi-chevron-right{transform:rotate(90deg)}:host ::ng-deep .p-accordion .p-accordionheader .pi-chevron-down{transform:rotate(180deg)}:host ::ng-deep .p-accordion .p-accordioncontent-content{margin-top:8px}@media screen and (max-width: 1260px){:host ::ng-deep .p-inputtext,:host ::ng-deep label{font-size:12px}:host ::ng-deep .delete-button .p-button,:host ::ng-deep .clone-button .p-button{font-size:12px}:host ::ng-deep .delete-button .p-button .p-button-label,:host ::ng-deep .clone-button .p-button .p-button-label{display:none}:host ::ng-deep .delete-button .p-button .p-button-icon,:host ::ng-deep .clone-button .p-button .p-button-icon{margin-left:0}}:host ::ng-deep .p-selectbutton .p-button{background:#fff;color:#3e7c94}@media screen and (max-width: 1260px){:host ::ng-deep .p-selectbutton .p-button{font-size:12px}}:host ::ng-deep .p-selectbutton .p-button.p-highlight{background:#ffa142;color:#fff}.controls{display:flex;align-items:center;justify-content:space-between}@media screen and (max-width: 1260px){.controls{flex-direction:column;justify-content:start;align-items:start}.controls form,.controls .delete-button{margin:0!important;padding:5px 15px!important}.controls form{border-bottom:1px solid #3E7C94}}.controls-mobile{display:none}@media screen and (max-width: 1260px){.controls-mobile{margin-left:15px;display:block}}.controls-lg-screen{display:block}@media screen and (max-width: 1260px){.controls-lg-screen{display:none}}\n"] }]
2541
+ }], propDecorators: { isHeaderEditable: [{
2542
+ type: Input
2543
+ }], isAccordionDeletable: [{
2544
+ type: Input
2545
+ }], isAccordionCloneable: [{
2546
+ type: Input
2547
+ }], headerTitle: [{
2548
+ type: Input
2549
+ }], selected: [{
2550
+ type: Input
2551
+ }], icon: [{
2552
+ type: Input
2553
+ }], headerTitlePlaceholder: [{
2554
+ type: Input
2555
+ }], headerTitleEditable: [{
2556
+ type: Input
2557
+ }], group: [{
2558
+ type: Input
2559
+ }], controlName: [{
2560
+ type: Input
2561
+ }], name: [{
2562
+ type: Input
2563
+ }], canDisable: [{
2564
+ type: Input
2565
+ }], toggleLabel: [{
2566
+ type: Input
2567
+ }], toggleControlName: [{
2568
+ type: Input
2569
+ }], clickEvent: [{
2570
+ type: Output
2571
+ }], clickToggleEvent: [{
2572
+ type: Output
2573
+ }], clickCloneEvent: [{
2574
+ type: Output
2575
+ }] } });
2576
+
2577
+ class ProgressBarComponent {
2578
+ value;
2579
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ProgressBarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2580
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.6", type: ProgressBarComponent, isStandalone: true, selector: "lib-progress-bar[value]", inputs: { value: "value" }, ngImport: i0, template: "<p-progressBar [value]=\"value\"></p-progressBar>\r\n", styles: [":host ::ng-deep .p-progressbar{background:#fff}\n"], dependencies: [{ kind: "component", type: ProgressBar, selector: "p-progressBar, p-progressbar, p-progress-bar", inputs: ["value", "showValue", "styleClass", "valueStyleClass", "style", "unit", "mode", "color"] }] });
2581
+ }
2582
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ProgressBarComponent, decorators: [{
2583
+ type: Component,
2584
+ args: [{ selector: 'lib-progress-bar[value]', imports: [ProgressBar], template: "<p-progressBar [value]=\"value\"></p-progressBar>\r\n", styles: [":host ::ng-deep .p-progressbar{background:#fff}\n"] }]
2585
+ }], propDecorators: { value: [{
2586
+ type: Input
2587
+ }] } });
2588
+
2589
+ class PicklistComponent {
2590
+ // Dynamic class
2591
+ primaryPickList = 'primary-pick-list';
2592
+ sourceData;
2593
+ targetData;
2594
+ name;
2595
+ sourceFilterPlaceholder = 'Iščite...';
2596
+ targetFilterPlaceholder = 'Iščite...';
2597
+ sourceHeader = 'Na voljo';
2598
+ targetHeader = 'Izbrano';
2599
+ style = { height: '15rem' };
2600
+ dragdrop = true;
2601
+ responsive = true;
2602
+ showSourceControls = true;
2603
+ showTargetControls = true;
2604
+ moveToSourceClicked = new EventEmitter();
2605
+ moveToTargetClicked = new EventEmitter();
2606
+ moveToSourceAllClicked = new EventEmitter();
2607
+ moveToTargetAllClicked = new EventEmitter();
2608
+ // Custom headers
2609
+ isCustomSourceHeader = false;
2610
+ isCustomTargetHeader = false;
2611
+ sourceLength;
2612
+ targetLength;
2613
+ moveToSource(event) {
2614
+ this.moveToSourceClicked.emit(event);
2615
+ }
2616
+ moveToTarget(event) {
2617
+ this.moveToTargetClicked.emit(event);
2618
+ }
2619
+ moveAllToSource(event) {
2620
+ this.moveToSourceAllClicked.emit(event);
2621
+ }
2622
+ moveAllToTarget(event) {
2623
+ this.moveToTargetAllClicked.emit(event);
2624
+ }
2625
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: PicklistComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2626
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.6", type: PicklistComponent, isStandalone: true, selector: "lib-picklist[sourceData][targetData][name]", inputs: { primaryPickList: "primaryPickList", sourceData: "sourceData", targetData: "targetData", name: "name", sourceFilterPlaceholder: "sourceFilterPlaceholder", targetFilterPlaceholder: "targetFilterPlaceholder", sourceHeader: "sourceHeader", targetHeader: "targetHeader", style: "style", dragdrop: "dragdrop", responsive: "responsive", showSourceControls: "showSourceControls", showTargetControls: "showTargetControls", isCustomSourceHeader: "isCustomSourceHeader", isCustomTargetHeader: "isCustomTargetHeader", sourceLength: "sourceLength", targetLength: "targetLength" }, outputs: { moveToSourceClicked: "moveToSourceClicked", moveToTargetClicked: "moveToTargetClicked", moveToSourceAllClicked: "moveToSourceAllClicked", moveToTargetAllClicked: "moveToTargetAllClicked" }, ngImport: i0, template: "<p-picklist\r\n [source]=\"sourceData\"\r\n [target]=\"targetData\"\r\n [sourceHeader]=\"sourceHeader\"\r\n [targetHeader]=\"targetHeader\"\r\n [dragdrop]=\"dragdrop\"\r\n [responsive]=\"responsive\"\r\n [sourceStyle]=\"style\"\r\n [showSourceControls]=\"showSourceControls\"\r\n [showTargetControls]=\"showTargetControls\"\r\n [targetStyle]=\"style\"\r\n [filterBy]=\"name\"\r\n [sourceFilterPlaceholder]=\"sourceFilterPlaceholder\"\r\n [targetFilterPlaceholder]=\"targetFilterPlaceholder\"\r\n breakpoint=\"1400px\"\r\n (onMoveToSource)=\"moveToSource($event)\"\r\n (onMoveToTarget)=\"moveToTarget($event)\"\r\n (onMoveAllToSource)=\"moveAllToSource($event)\"\r\n (onMoveAllToTarget)=\"moveAllToTarget($event)\"\r\n [class]=\"primaryPickList\"\r\n>\r\n <ng-template let-product pTemplate=\"item\">\r\n <div class=\"flex flex-wrap p-2 align-items-center gap-3\">\r\n <div class=\"flex-1 flex flex-column gap-2\">\r\n <span class=\"font-bold\">{{ product[name] }}</span>\r\n </div>\r\n </div>\r\n </ng-template>\r\n\r\n <!-- Header template for source list -->\r\n <ng-template let-product pTemplate=\"sourceHeader\" *ngIf=\"isCustomSourceHeader\">\r\n <div class=\"custom-picklist-header flex align-items-center justify-content-between\">\r\n <span>{{ sourceHeader }}</span>\r\n <span>{{ sourceLength }}</span>\r\n </div>\r\n </ng-template>\r\n\r\n <!-- Header template for target list -->\r\n <ng-template let-product pTemplate=\"targetHeader\" *ngIf=\"isCustomTargetHeader\">\r\n <div class=\"custom-picklist-header flex align-items-center justify-content-between\">\r\n <span>{{ targetHeader }}</span>\r\n <span>{{ targetLength }}</span>\r\n </div>\r\n </ng-template>\r\n</p-picklist>\r\n", styles: [":host ::ng-deep .primary-pick-list .p-picklist .p-picklist-header{background:#3e7c94}:host ::ng-deep .primary-pick-list .p-picklist .p-picklist-header .p-picklist-title{color:#fff}:host ::ng-deep .disabled-pick-list .p-picklist .p-picklist-header{background:#6d7375}:host ::ng-deep .disabled-pick-list .p-picklist .p-picklist-header .p-picklist-title{color:#fff}.custom-picklist-header{background:#3e7c94;color:#fff;padding:0 10px;font-weight:600}\n"], dependencies: [{ kind: "ngmodule", type: PickListModule }, { kind: "component", type: i1$8.PickList, selector: "p-pickList, p-picklist, p-pick-list", inputs: ["source", "target", "sourceHeader", "tabindex", "rightButtonAriaLabel", "leftButtonAriaLabel", "allRightButtonAriaLabel", "allLeftButtonAriaLabel", "upButtonAriaLabel", "downButtonAriaLabel", "topButtonAriaLabel", "bottomButtonAriaLabel", "targetHeader", "responsive", "filterBy", "filterLocale", "trackBy", "sourceTrackBy", "targetTrackBy", "showSourceFilter", "showTargetFilter", "metaKeySelection", "dragdrop", "style", "styleClass", "sourceStyle", "targetStyle", "showSourceControls", "showTargetControls", "sourceFilterPlaceholder", "targetFilterPlaceholder", "disabled", "sourceOptionDisabled", "targetOptionDisabled", "ariaSourceFilterLabel", "ariaTargetFilterLabel", "filterMatchMode", "stripedRows", "keepSelection", "scrollHeight", "autoOptionFocus", "buttonProps", "moveUpButtonProps", "moveTopButtonProps", "moveDownButtonProps", "moveBottomButtonProps", "moveToTargetProps", "moveAllToTargetProps", "moveToSourceProps", "moveAllToSourceProps", "breakpoint"], outputs: ["onMoveToSource", "onMoveAllToSource", "onMoveAllToTarget", "onMoveToTarget", "onSourceReorder", "onTargetReorder", "onSourceSelect", "onTargetSelect", "onSourceFilter", "onTargetFilter", "onFocus", "onBlur"] }, { kind: "directive", type: i1$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
2627
+ }
2628
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: PicklistComponent, decorators: [{
2629
+ type: Component,
2630
+ args: [{ selector: 'lib-picklist[sourceData][targetData][name]', imports: [
2631
+ PickListModule,
2632
+ PrimeTemplate,
2633
+ NgIf,
2634
+ ], template: "<p-picklist\r\n [source]=\"sourceData\"\r\n [target]=\"targetData\"\r\n [sourceHeader]=\"sourceHeader\"\r\n [targetHeader]=\"targetHeader\"\r\n [dragdrop]=\"dragdrop\"\r\n [responsive]=\"responsive\"\r\n [sourceStyle]=\"style\"\r\n [showSourceControls]=\"showSourceControls\"\r\n [showTargetControls]=\"showTargetControls\"\r\n [targetStyle]=\"style\"\r\n [filterBy]=\"name\"\r\n [sourceFilterPlaceholder]=\"sourceFilterPlaceholder\"\r\n [targetFilterPlaceholder]=\"targetFilterPlaceholder\"\r\n breakpoint=\"1400px\"\r\n (onMoveToSource)=\"moveToSource($event)\"\r\n (onMoveToTarget)=\"moveToTarget($event)\"\r\n (onMoveAllToSource)=\"moveAllToSource($event)\"\r\n (onMoveAllToTarget)=\"moveAllToTarget($event)\"\r\n [class]=\"primaryPickList\"\r\n>\r\n <ng-template let-product pTemplate=\"item\">\r\n <div class=\"flex flex-wrap p-2 align-items-center gap-3\">\r\n <div class=\"flex-1 flex flex-column gap-2\">\r\n <span class=\"font-bold\">{{ product[name] }}</span>\r\n </div>\r\n </div>\r\n </ng-template>\r\n\r\n <!-- Header template for source list -->\r\n <ng-template let-product pTemplate=\"sourceHeader\" *ngIf=\"isCustomSourceHeader\">\r\n <div class=\"custom-picklist-header flex align-items-center justify-content-between\">\r\n <span>{{ sourceHeader }}</span>\r\n <span>{{ sourceLength }}</span>\r\n </div>\r\n </ng-template>\r\n\r\n <!-- Header template for target list -->\r\n <ng-template let-product pTemplate=\"targetHeader\" *ngIf=\"isCustomTargetHeader\">\r\n <div class=\"custom-picklist-header flex align-items-center justify-content-between\">\r\n <span>{{ targetHeader }}</span>\r\n <span>{{ targetLength }}</span>\r\n </div>\r\n </ng-template>\r\n</p-picklist>\r\n", styles: [":host ::ng-deep .primary-pick-list .p-picklist .p-picklist-header{background:#3e7c94}:host ::ng-deep .primary-pick-list .p-picklist .p-picklist-header .p-picklist-title{color:#fff}:host ::ng-deep .disabled-pick-list .p-picklist .p-picklist-header{background:#6d7375}:host ::ng-deep .disabled-pick-list .p-picklist .p-picklist-header .p-picklist-title{color:#fff}.custom-picklist-header{background:#3e7c94;color:#fff;padding:0 10px;font-weight:600}\n"] }]
2635
+ }], propDecorators: { primaryPickList: [{
2636
+ type: Input
2637
+ }], sourceData: [{
2638
+ type: Input
2639
+ }], targetData: [{
2640
+ type: Input
2641
+ }], name: [{
2642
+ type: Input
2643
+ }], sourceFilterPlaceholder: [{
2644
+ type: Input
2645
+ }], targetFilterPlaceholder: [{
2646
+ type: Input
2647
+ }], sourceHeader: [{
2648
+ type: Input
2649
+ }], targetHeader: [{
2650
+ type: Input
2651
+ }], style: [{
2652
+ type: Input
2653
+ }], dragdrop: [{
2654
+ type: Input
2655
+ }], responsive: [{
2656
+ type: Input
2657
+ }], showSourceControls: [{
2658
+ type: Input
2659
+ }], showTargetControls: [{
2660
+ type: Input
2661
+ }], moveToSourceClicked: [{
2662
+ type: Output
2663
+ }], moveToTargetClicked: [{
2664
+ type: Output
2665
+ }], moveToSourceAllClicked: [{
2666
+ type: Output
2667
+ }], moveToTargetAllClicked: [{
2668
+ type: Output
2669
+ }], isCustomSourceHeader: [{
2670
+ type: Input
2671
+ }], isCustomTargetHeader: [{
2672
+ type: Input
2673
+ }], sourceLength: [{
2674
+ type: Input
2675
+ }], targetLength: [{
2676
+ type: Input
2677
+ }] } });
2678
+
2679
+ class CardComponent {
2680
+ title;
2681
+ cardBody;
2682
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: CardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2683
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.6", type: CardComponent, isStandalone: true, selector: "lib-card", inputs: { title: "title", cardBody: "cardBody" }, ngImport: i0, template: "<p-card header=\"{{ title }}\">\r\n <p class=\"m-0 flex align-items-center\"><i class=\"pi pi-exclamation-triangle mr-3\"></i>{{ cardBody }}</p>\r\n</p-card>\r\n", styles: [":host ::ng-deep .p-card{background:#facd9c;color:#000;font-weight:700}:host ::ng-deep .p-card .p-card-body{padding:0 15px}\n"], dependencies: [{ kind: "component", type: Card, selector: "p-card", inputs: ["header", "subheader", "style", "styleClass"] }] });
2684
+ }
2685
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: CardComponent, decorators: [{
2686
+ type: Component,
2687
+ args: [{ selector: 'lib-card', imports: [Card], template: "<p-card header=\"{{ title }}\">\r\n <p class=\"m-0 flex align-items-center\"><i class=\"pi pi-exclamation-triangle mr-3\"></i>{{ cardBody }}</p>\r\n</p-card>\r\n", styles: [":host ::ng-deep .p-card{background:#facd9c;color:#000;font-weight:700}:host ::ng-deep .p-card .p-card-body{padding:0 15px}\n"] }]
2688
+ }], propDecorators: { title: [{
2689
+ type: Input
2690
+ }], cardBody: [{
2691
+ type: Input
2692
+ }] } });
2693
+
2694
+ class InputMaskComponent {
2695
+ TooltipHoverEventEnum = TooltipHoverEventEnum;
2696
+ _isTooltipVisible;
2697
+ name;
2698
+ type = InputType.text;
2699
+ label;
2700
+ placeholder;
2701
+ accessibilityText = '';
2702
+ group;
2703
+ controlName;
2704
+ isRequired = true;
2705
+ tooltipPosition = TooltipPosition.right;
2706
+ tooltipText = '';
2707
+ formStatus;
2708
+ groupError = false;
2709
+ hasGap = true;
2710
+ mask;
2711
+ ngOnInit() {
2712
+ this._isTooltipVisible = !!this.tooltipText;
2713
+ }
2714
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: InputMaskComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2715
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.6", type: InputMaskComponent, isStandalone: true, selector: "lib-input-mask", inputs: { name: "name", type: "type", label: "label", placeholder: "placeholder", accessibilityText: "accessibilityText", group: "group", controlName: "controlName", isRequired: "isRequired", tooltipPosition: "tooltipPosition", tooltipText: "tooltipText", formStatus: "formStatus", groupError: "groupError", hasGap: "hasGap", mask: "mask" }, ngImport: i0, template: "<div class=\"flex flex-column\" [formGroup]=\"group\" [ngClass]=\"{ 'gap-1': hasGap }\">\r\n <div class=\"flex\">\r\n <label [for]='name' class=\"mr-2\">\r\n {{label}}<span class=\"required\" aria-label=\"Is required filed\" *ngIf=\"isRequired\">*</span>\r\n </label>\r\n <lib-tooltip\r\n *ngIf=\"_isTooltipVisible\"\r\n [position]=\"tooltipPosition\"\r\n [text]=\"tooltipText!\"\r\n ></lib-tooltip>\r\n </div>\r\n <p-inputMask\r\n [inputId]=\"name\"\r\n [formControlName]=\"controlName\"\r\n [mask]=\"mask\"\r\n [placeholder]='placeholder'\r\n [attr.aria-label]=\"accessibilityText\"\r\n [ngClass]=\"{ 'ng-dirty ng-invalid': (group.get(controlName)!.errors && (group.get(controlName)!.touched || formStatus!.isSubmitTriggered)) || groupError }\"\r\n [attr.aria-describedby]=\"name + 'Error'\"\r\n [attr.aria-invalid]=\"(group.get(controlName)!.errors && (group.get(controlName)!.touched || formStatus!.isSubmitTriggered)) || groupError\"\r\n [attr.aria-required]=\"isRequired\"\r\n ></p-inputMask>\r\n</div>\r\n<lib-error\r\n *ngIf=\"(group.get(controlName)!.errors && (group.get(controlName)!.touched) || formStatus!.isSubmitTriggered)\"\r\n [hasError]=\"group.get(controlName)!.errors\"\r\n [isTouched]=\"group.get(controlName)!.touched\"\r\n [isSubmitTriggered]=\"formStatus!.isSubmitTriggered!\"\r\n [hasGroupError]=\"groupError\"\r\n [errorId]=\"name+'Error'\"\r\n></lib-error>\r\n", styles: [":host ::ng-deep .p-inputtext{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: TooltipComponent, selector: " lib-tooltip", inputs: ["icon", "htmlParser", "text", "position", "tooltipEvent", "autoHide", "htmlParse"] }, { kind: "component", type: InputMask, selector: "p-inputmask, p-inputMask, p-input-mask", inputs: ["type", "slotChar", "autoClear", "showClear", "style", "inputId", "styleClass", "placeholder", "size", "maxlength", "tabindex", "title", "variant", "ariaLabel", "ariaLabelledBy", "ariaRequired", "disabled", "readonly", "unmask", "name", "required", "characterPattern", "autofocus", "autoFocus", "autocomplete", "keepBuffer", "mask"], outputs: ["onComplete", "onFocus", "onBlur", "onInput", "onKeydown", "onClear"] }, { kind: "component", type: ErrorComponent, selector: "lib-error", inputs: ["hasError", "isTouched", "isSubmitTriggered", "isNestedFormSubmit", "isDirty", "isRequired", "hasGroupError", "errorId"] }] });
2716
+ }
2717
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: InputMaskComponent, decorators: [{
2718
+ type: Component,
2719
+ args: [{ selector: 'lib-input-mask', imports: [
2720
+ FormsModule,
2721
+ ReactiveFormsModule,
2722
+ NgClass,
2723
+ NgIf,
2724
+ TooltipComponent,
2725
+ InputMask,
2726
+ ErrorComponent,
2727
+ ], template: "<div class=\"flex flex-column\" [formGroup]=\"group\" [ngClass]=\"{ 'gap-1': hasGap }\">\r\n <div class=\"flex\">\r\n <label [for]='name' class=\"mr-2\">\r\n {{label}}<span class=\"required\" aria-label=\"Is required filed\" *ngIf=\"isRequired\">*</span>\r\n </label>\r\n <lib-tooltip\r\n *ngIf=\"_isTooltipVisible\"\r\n [position]=\"tooltipPosition\"\r\n [text]=\"tooltipText!\"\r\n ></lib-tooltip>\r\n </div>\r\n <p-inputMask\r\n [inputId]=\"name\"\r\n [formControlName]=\"controlName\"\r\n [mask]=\"mask\"\r\n [placeholder]='placeholder'\r\n [attr.aria-label]=\"accessibilityText\"\r\n [ngClass]=\"{ 'ng-dirty ng-invalid': (group.get(controlName)!.errors && (group.get(controlName)!.touched || formStatus!.isSubmitTriggered)) || groupError }\"\r\n [attr.aria-describedby]=\"name + 'Error'\"\r\n [attr.aria-invalid]=\"(group.get(controlName)!.errors && (group.get(controlName)!.touched || formStatus!.isSubmitTriggered)) || groupError\"\r\n [attr.aria-required]=\"isRequired\"\r\n ></p-inputMask>\r\n</div>\r\n<lib-error\r\n *ngIf=\"(group.get(controlName)!.errors && (group.get(controlName)!.touched) || formStatus!.isSubmitTriggered)\"\r\n [hasError]=\"group.get(controlName)!.errors\"\r\n [isTouched]=\"group.get(controlName)!.touched\"\r\n [isSubmitTriggered]=\"formStatus!.isSubmitTriggered!\"\r\n [hasGroupError]=\"groupError\"\r\n [errorId]=\"name+'Error'\"\r\n></lib-error>\r\n", styles: [":host ::ng-deep .p-inputtext{width:100%}\n"] }]
2728
+ }], propDecorators: { name: [{
2729
+ type: Input
2730
+ }], type: [{
2731
+ type: Input
2732
+ }], label: [{
2733
+ type: Input
2734
+ }], placeholder: [{
2735
+ type: Input
2736
+ }], accessibilityText: [{
2737
+ type: Input
2738
+ }], group: [{
2739
+ type: Input
2740
+ }], controlName: [{
2741
+ type: Input
2742
+ }], isRequired: [{
2743
+ type: Input
2744
+ }], tooltipPosition: [{
2745
+ type: Input
2746
+ }], tooltipText: [{
2747
+ type: Input
2748
+ }], formStatus: [{
2749
+ type: Input
2750
+ }], groupError: [{
2751
+ type: Input
2752
+ }], hasGap: [{
2753
+ type: Input
2754
+ }], mask: [{
2755
+ type: Input
2756
+ }] } });
2757
+
2758
+ class FilterHeaderComponent {
2759
+ filterItems = [];
2760
+ constructor() { }
2761
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: FilterHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2762
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.6", type: FilterHeaderComponent, isStandalone: true, selector: "app-filter-header", inputs: { filterItems: "filterItems" }, ngImport: i0, template: "<!-- app.component.html -->\r\n\r\n<p-menubar class=\"accordion_menubar \">\r\n <ng-template pTemplate=\"start\">\r\n <div class=\"filter-chips\" >\r\n <p-chip\r\n *ngFor=\"let item of filterItems\"\r\n [label]=\"item\"\r\n styleClass=\"filter-chip\">\r\n </p-chip>\r\n </div>\r\n </ng-template>\r\n</p-menubar>\r\n", styles: [".accordion_menubar{border:none!important}:host ::ng-deep .p-menubar{border:none;width:auto}:host ::ng-deep .p-accordion .p-accordioncontent{max-height:260px}.date__fields{margin-top:1.5rem;display:flex;flex-flow:row;flex-wrap:wrap;justify-content:space-between;gap:.5rem;margin-bottom:1rem}.date__fields label{order:1;padding:.5rem}.date__fields .date-field :deep(.lib-datepicker),.date__fields .date-field :deep(.lib-datepicker input){display:flex;order:2;flex-direction:row;margin-bottom:1rem}.grid_container{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:1.5rem;margin-bottom:10rem}.grid_container .column :deep(.lib-dropdown){width:100%;height:45px}.grid_container .column :deep(.lib-dropdown) .lib-dropdown-label{padding:12px;line-height:21px}.grid_container .column :deep(.lib-dropdown) .lib-dropdown-trigger{width:45px;height:100%}@media screen and (min-width: 768px){.filter-accordion .date_fields{grid-template-columns:repeat(2,1fr)}}@media screen and (min-width: 1200px){.filter-accordion .date_fields{grid-template-columns:repeat(4,1fr)}.filter-accordion .grid_container{grid-template-columns:repeat(3,1fr)}}:host ::ng-deep .filter-chips{display:flex;flex-wrap:wrap;gap:.5rem;padding:.5rem}:host ::ng-deep .filter-chips .p-chip{background:#f0f0f0;padding:.5rem}:host ::ng-deep .filter-chips .p-chip .p-chip-remove-icon{color:#666;margin-left:.5rem;cursor:pointer}:host ::ng-deep .filter-chips .p-chip .p-chip-remove-icon:hover{color:#333}:host ::ng-deep .filter-chips .p-chip .filter-value{margin-left:.5rem;font-weight:500}\n"], dependencies: [{ kind: "ngmodule", type: InputTextModule }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$9.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "ngmodule", type: MenubarModule }, { kind: "component", type: i2$4.Menubar, selector: "p-menubar", inputs: ["model", "style", "styleClass", "autoZIndex", "baseZIndex", "autoDisplay", "autoHide", "breakpoint", "autoHideDelay", "id", "ariaLabel", "ariaLabelledBy"], outputs: ["onFocus", "onBlur"] }, { kind: "directive", type: i1$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "ngmodule", type: ChipModule }, { kind: "component", type: i4.Chip, selector: "p-chip", inputs: ["label", "icon", "image", "alt", "style", "styleClass", "removable", "removeIcon", "chipProps"], outputs: ["onRemove", "onImageError"] }] });
2763
+ }
2764
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: FilterHeaderComponent, decorators: [{
2765
+ type: Component,
2766
+ args: [{ selector: 'app-filter-header', imports: [
2767
+ InputTextModule,
2768
+ FormsModule,
2769
+ ReactiveFormsModule,
2770
+ CommonModule,
2771
+ MenubarModule,
2772
+ ChipModule,
2773
+ ], template: "<!-- app.component.html -->\r\n\r\n<p-menubar class=\"accordion_menubar \">\r\n <ng-template pTemplate=\"start\">\r\n <div class=\"filter-chips\" >\r\n <p-chip\r\n *ngFor=\"let item of filterItems\"\r\n [label]=\"item\"\r\n styleClass=\"filter-chip\">\r\n </p-chip>\r\n </div>\r\n </ng-template>\r\n</p-menubar>\r\n", styles: [".accordion_menubar{border:none!important}:host ::ng-deep .p-menubar{border:none;width:auto}:host ::ng-deep .p-accordion .p-accordioncontent{max-height:260px}.date__fields{margin-top:1.5rem;display:flex;flex-flow:row;flex-wrap:wrap;justify-content:space-between;gap:.5rem;margin-bottom:1rem}.date__fields label{order:1;padding:.5rem}.date__fields .date-field :deep(.lib-datepicker),.date__fields .date-field :deep(.lib-datepicker input){display:flex;order:2;flex-direction:row;margin-bottom:1rem}.grid_container{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:1.5rem;margin-bottom:10rem}.grid_container .column :deep(.lib-dropdown){width:100%;height:45px}.grid_container .column :deep(.lib-dropdown) .lib-dropdown-label{padding:12px;line-height:21px}.grid_container .column :deep(.lib-dropdown) .lib-dropdown-trigger{width:45px;height:100%}@media screen and (min-width: 768px){.filter-accordion .date_fields{grid-template-columns:repeat(2,1fr)}}@media screen and (min-width: 1200px){.filter-accordion .date_fields{grid-template-columns:repeat(4,1fr)}.filter-accordion .grid_container{grid-template-columns:repeat(3,1fr)}}:host ::ng-deep .filter-chips{display:flex;flex-wrap:wrap;gap:.5rem;padding:.5rem}:host ::ng-deep .filter-chips .p-chip{background:#f0f0f0;padding:.5rem}:host ::ng-deep .filter-chips .p-chip .p-chip-remove-icon{color:#666;margin-left:.5rem;cursor:pointer}:host ::ng-deep .filter-chips .p-chip .p-chip-remove-icon:hover{color:#333}:host ::ng-deep .filter-chips .p-chip .filter-value{margin-left:.5rem;font-weight:500}\n"] }]
2774
+ }], ctorParameters: () => [], propDecorators: { filterItems: [{
2775
+ type: Input
2776
+ }] } });
2777
+
2778
+ class GenericTableComponent {
2779
+ translateService;
2780
+ constructor(translateService) {
2781
+ this.translateService = translateService;
2782
+ }
2783
+ // stolpci tabele
2784
+ columns = [];
2785
+ // podatki tabele
2786
+ data = [];
2787
+ // ali prikaže filtre: privzeto v vrstici pod imeni stolpcev
2788
+ filtersEnabled = true;
2789
+ // sporočilo ki se pokaže v body tabele, če filtriranje, iskanje ne najde nič
2790
+ emptyMessage = '';
2791
+ // TODO: tole je, da bi lahko customiziral body tabele - ne deluje
2792
+ customBodyTemplate = null;
2793
+ // za checked vrstice
2794
+ _selectedRows = [];
2795
+ get selectedRows() {
2796
+ return this._selectedRows;
2797
+ }
2798
+ set selectedRows(value) {
2799
+ this._selectedRows = value;
2800
+ this.selectedRowsChange.emit(this._selectedRows); // Emitiramo dogodek ob spremembi
2801
+ }
2802
+ selectedRowsChange = new EventEmitter(); // Dogodek za dvosmerno vezavo
2803
+ ngOnInit() {
2804
+ if (!this.emptyMessage) {
2805
+ this.emptyMessage = this.translateService.instant('errors.table.noData');
2806
+ }
2807
+ }
2808
+ get globalFilterFields() {
2809
+ return this.columns.map(c => c.field);
2810
+ }
2811
+ clearOnEscape(event, filter) {
2812
+ if (event.key === 'Escape') {
2813
+ filter(''); // Počisti vrednost filtra
2814
+ event.target.value = ''; // Počisti vrednost vnosnega polja
2815
+ event.preventDefault(); // Prepreči privzeto vedenje
2816
+ }
2817
+ }
2818
+ // Inicializacija stolpcev (z možnostjo prevodov)
2819
+ initializeColumns(columnsConfig) {
2820
+ this.columns = columnsConfig.map(col => ({
2821
+ ...col,
2822
+ header: this.translateService.instant(col.headerKey),
2823
+ }));
2824
+ }
2825
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: GenericTableComponent, deps: [{ token: i2.TranslateService }], target: i0.ɵɵFactoryTarget.Component });
2826
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.6", type: GenericTableComponent, isStandalone: true, selector: "app-generic-table", inputs: { columns: "columns", data: "data", filtersEnabled: "filtersEnabled", emptyMessage: "emptyMessage", customBodyTemplate: "customBodyTemplate", selectedRows: "selectedRows" }, outputs: { selectedRowsChange: "selectedRowsChange" }, ngImport: i0, template: "<p-table\r\n [value]=\"data\"\r\n [globalFilterFields]=\"globalFilterFields\"\r\n class=\"p-datatable-gridlines\"\r\n [(selection)]=\"selectedRows\"\r\n>\r\n <!-- header tabele -->\r\n <ng-template pTemplate=\"header\">\r\n <!-- header vrstica kjer so imena fieldov -->\r\n <tr>\r\n <th *ngFor=\"let col of columns\">\r\n <ng-container *ngIf=\"col.selectable; else regularHeader\">\r\n <p-tableHeaderCheckbox></p-tableHeaderCheckbox>\r\n </ng-container>\r\n <ng-template #regularHeader>\r\n {{ col.header }}\r\n </ng-template>\r\n </th>\r\n </tr>\r\n <!-- filter vrstica kjer so vsi filtri -->\r\n <tr *ngIf=\"filtersEnabled\">\r\n <th *ngFor=\"let col of columns\">\r\n <!-- text filter -->\r\n <ng-container *ngIf=\"col.filterType === 'text'\">\r\n <p-columnFilter\r\n [field]=\"col.field\"\r\n [type]=\"'text'\"\r\n [showMenu]=\"false\"\r\n [placeholder]=\"col.placeholder || col.header\"\r\n [matchMode]=\"'contains'\"\r\n >\r\n <ng-template pTemplate=\"filter\" let-value let-filter=\"filterCallback\">\r\n <input\r\n pInputText\r\n type=\"text\"\r\n [ngModel]=\"value\"\r\n (ngModelChange)=\"filter($event)\"\r\n (keydown)=\"clearOnEscape($event, filter)\"\r\n [placeholder]=\"col.placeholder || col.header\"\r\n />\r\n </ng-template>\r\n </p-columnFilter>\r\n </ng-container>\r\n\r\n <!-- dropdown filter -->\r\n <ng-container *ngIf=\"col.filterType === 'dropdown'\">\r\n <p-columnFilter [field]=\"col.field\" [showMenu]=\"false\">\r\n <ng-template pTemplate=\"filter\" let-value let-filter=\"filterCallback\">\r\n <p-select\r\n [ngModel]=\"value\"\r\n [options]=\"col.options\"\r\n (onChange)=\"filter($event.value)\"\r\n placeholder=\"{{ col.placeholder || col.header }}\"\r\n [showClear]=\"true\"\r\n ></p-select>\r\n </ng-template>\r\n </p-columnFilter>\r\n </ng-container>\r\n </th>\r\n </tr>\r\n\r\n </ng-template>\r\n\r\n <!-- body tabele -->\r\n <ng-template pTemplate=\"body\" let-rowData>\r\n <tr>\r\n <td *ngFor=\"let col of columns\">\r\n <ng-container *ngIf=\"col.selectable; else regularCell\">\r\n <p-tableCheckbox [value]=\"rowData\"></p-tableCheckbox>\r\n </ng-container>\r\n <ng-template #regularCell>\r\n <ng-container *ngIf=\"!customBodyTemplate; else customBody\">\r\n {{ rowData[col.field] }}\r\n </ng-container>\r\n </ng-template>\r\n </td>\r\n </tr>\r\n </ng-template>\r\n\r\n\r\n\r\n <!-- TODO: tale del z $implicit: rowData ne deluje, me\u010De errorje -->\r\n <ng-template #customBody>\r\n<!-- <ng-container *ngTemplateOutlet=\"customBodyTemplate; context: { $implicit: rowData }\"></ng-container>-->\r\n </ng-template>\r\n\r\n <!-- empty message: \u010De ni podatkov -->\r\n <ng-template pTemplate=\"emptymessage\">\r\n <tr class=\"empty-message\">\r\n <td [attr.colspan]=\"columns.length\">{{ emptyMessage }}</td>\r\n </tr>\r\n </ng-template>\r\n</p-table>\r\n", styles: ["@charset \"UTF-8\";::ng-deep .p-datatable-table .p-select-list{padding:0}::ng-deep .p-datatable-table th,::ng-deep .p-datatable-table td{padding:.5rem!important}::ng-deep .p-datatable-table thead>tr>th{color:#fff!important;background-color:#3e7c94!important;border-width:1px 0 0 0!important}::ng-deep .p-datatable-table .p-datatable-tbody tr:nth-child(odd){background-color:#f1f1f1}::ng-deep .p-datatable-table .p-datatable-tbody tr:nth-child(2n){background-color:#fff}::ng-deep .p-datatable-table tr.empty-message>td{text-align:center!important;padding:2rem!important}\n"], dependencies: [{ kind: "ngmodule", type: TableModule }, { kind: "component", type: i1$6.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "virtualRowHeight", "selectAll"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i1$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i1$6.TableCheckbox, selector: "p-tableCheckbox", inputs: ["value", "disabled", "required", "index", "inputId", "name", "ariaLabel"] }, { kind: "component", type: i1$6.TableHeaderCheckbox, selector: "p-tableHeaderCheckbox", inputs: ["disabled", "inputId", "name", "ariaLabel"] }, { kind: "component", type: i1$6.ColumnFilter, selector: "p-columnFilter", inputs: ["field", "type", "display", "showMenu", "matchMode", "operator", "showOperator", "showClearButton", "showApplyButton", "showMatchModes", "showAddButton", "hideOnClear", "placeholder", "matchModeOptions", "maxConstraints", "minFractionDigits", "maxFractionDigits", "prefix", "suffix", "locale", "localeMatcher", "currency", "currencyDisplay", "useGrouping", "showButtons", "ariaLabel", "filterButtonProps"], outputs: ["onShow", "onHide"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: InputText, selector: "[pInputText]", inputs: ["variant", "fluid", "pSize"] }, { kind: "ngmodule", type: SelectModule }, { kind: "component", type: i3.Select, selector: "p-select", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "size", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "fluid", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }] });
2827
+ }
2828
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: GenericTableComponent, decorators: [{
2829
+ type: Component,
2830
+ args: [{ selector: 'app-generic-table', imports: [TableModule, PrimeTemplate, NgFor, NgIf, FormsModule, InputText, SelectModule], template: "<p-table\r\n [value]=\"data\"\r\n [globalFilterFields]=\"globalFilterFields\"\r\n class=\"p-datatable-gridlines\"\r\n [(selection)]=\"selectedRows\"\r\n>\r\n <!-- header tabele -->\r\n <ng-template pTemplate=\"header\">\r\n <!-- header vrstica kjer so imena fieldov -->\r\n <tr>\r\n <th *ngFor=\"let col of columns\">\r\n <ng-container *ngIf=\"col.selectable; else regularHeader\">\r\n <p-tableHeaderCheckbox></p-tableHeaderCheckbox>\r\n </ng-container>\r\n <ng-template #regularHeader>\r\n {{ col.header }}\r\n </ng-template>\r\n </th>\r\n </tr>\r\n <!-- filter vrstica kjer so vsi filtri -->\r\n <tr *ngIf=\"filtersEnabled\">\r\n <th *ngFor=\"let col of columns\">\r\n <!-- text filter -->\r\n <ng-container *ngIf=\"col.filterType === 'text'\">\r\n <p-columnFilter\r\n [field]=\"col.field\"\r\n [type]=\"'text'\"\r\n [showMenu]=\"false\"\r\n [placeholder]=\"col.placeholder || col.header\"\r\n [matchMode]=\"'contains'\"\r\n >\r\n <ng-template pTemplate=\"filter\" let-value let-filter=\"filterCallback\">\r\n <input\r\n pInputText\r\n type=\"text\"\r\n [ngModel]=\"value\"\r\n (ngModelChange)=\"filter($event)\"\r\n (keydown)=\"clearOnEscape($event, filter)\"\r\n [placeholder]=\"col.placeholder || col.header\"\r\n />\r\n </ng-template>\r\n </p-columnFilter>\r\n </ng-container>\r\n\r\n <!-- dropdown filter -->\r\n <ng-container *ngIf=\"col.filterType === 'dropdown'\">\r\n <p-columnFilter [field]=\"col.field\" [showMenu]=\"false\">\r\n <ng-template pTemplate=\"filter\" let-value let-filter=\"filterCallback\">\r\n <p-select\r\n [ngModel]=\"value\"\r\n [options]=\"col.options\"\r\n (onChange)=\"filter($event.value)\"\r\n placeholder=\"{{ col.placeholder || col.header }}\"\r\n [showClear]=\"true\"\r\n ></p-select>\r\n </ng-template>\r\n </p-columnFilter>\r\n </ng-container>\r\n </th>\r\n </tr>\r\n\r\n </ng-template>\r\n\r\n <!-- body tabele -->\r\n <ng-template pTemplate=\"body\" let-rowData>\r\n <tr>\r\n <td *ngFor=\"let col of columns\">\r\n <ng-container *ngIf=\"col.selectable; else regularCell\">\r\n <p-tableCheckbox [value]=\"rowData\"></p-tableCheckbox>\r\n </ng-container>\r\n <ng-template #regularCell>\r\n <ng-container *ngIf=\"!customBodyTemplate; else customBody\">\r\n {{ rowData[col.field] }}\r\n </ng-container>\r\n </ng-template>\r\n </td>\r\n </tr>\r\n </ng-template>\r\n\r\n\r\n\r\n <!-- TODO: tale del z $implicit: rowData ne deluje, me\u010De errorje -->\r\n <ng-template #customBody>\r\n<!-- <ng-container *ngTemplateOutlet=\"customBodyTemplate; context: { $implicit: rowData }\"></ng-container>-->\r\n </ng-template>\r\n\r\n <!-- empty message: \u010De ni podatkov -->\r\n <ng-template pTemplate=\"emptymessage\">\r\n <tr class=\"empty-message\">\r\n <td [attr.colspan]=\"columns.length\">{{ emptyMessage }}</td>\r\n </tr>\r\n </ng-template>\r\n</p-table>\r\n", styles: ["@charset \"UTF-8\";::ng-deep .p-datatable-table .p-select-list{padding:0}::ng-deep .p-datatable-table th,::ng-deep .p-datatable-table td{padding:.5rem!important}::ng-deep .p-datatable-table thead>tr>th{color:#fff!important;background-color:#3e7c94!important;border-width:1px 0 0 0!important}::ng-deep .p-datatable-table .p-datatable-tbody tr:nth-child(odd){background-color:#f1f1f1}::ng-deep .p-datatable-table .p-datatable-tbody tr:nth-child(2n){background-color:#fff}::ng-deep .p-datatable-table tr.empty-message>td{text-align:center!important;padding:2rem!important}\n"] }]
2831
+ }], ctorParameters: () => [{ type: i2.TranslateService }], propDecorators: { columns: [{
2832
+ type: Input
2833
+ }], data: [{
2834
+ type: Input
2835
+ }], filtersEnabled: [{
2836
+ type: Input
2837
+ }], emptyMessage: [{
2838
+ type: Input
2839
+ }], customBodyTemplate: [{
2840
+ type: Input
2841
+ }], selectedRows: [{
2842
+ type: Input
2843
+ }], selectedRowsChange: [{
2844
+ type: Output
2845
+ }] } });
2846
+
2847
+ /*
2848
+ * Public API Surface of design-system
2849
+ */
2850
+ // Services
2851
+ // Components
2852
+
2853
+ /**
2854
+ * Generated bundle index. Do not edit.
2855
+ */
2856
+
2857
+ export { AccordionComponent, AppConfigService, BreadcrumbsComponent, ButtonComponent, ButtonLinkComponent, CacheService, CardComponent, CheckboxComponent, ConfirmModalComponent, ConfirmModalService, CustomTableComponent, DateInputComponent, DividerComponent, DropdownComponent, DynamicRouteService, ErrorComponent, ExpandedTableComponent, ExportService, FilterHeaderComponent, FooterComponent, GenericTableComponent, IconButtonComponent, InputComponent, InputMaskComponent, LoaderComponent, LocalStorageService, MainMenuComponent, ModalComponent, NavbarComponent, NoInternetService, PicklistComponent, ProgressBarComponent, TagComponent, TextareaComponent, ToggleSwitchComponent, TooltipComponent, TranslationService };
2858
+ //# sourceMappingURL=n-isi-platform-design-system.mjs.map