@tilde-nlp/ngx-common 2.0.0 → 2.0.2

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 (106) hide show
  1. package/esm2020/lib/confirmation-modal/confirmation-modal.component.mjs +24 -0
  2. package/esm2020/lib/confirmation-modal/confirmation-modal.module.mjs +21 -0
  3. package/esm2020/lib/confirmation-modal/index.mjs +5 -0
  4. package/esm2020/lib/confirmation-modal/models/confirmation-body.model.mjs +2 -0
  5. package/esm2020/lib/confirmation-modal/models/confirmation.enum.mjs +6 -0
  6. package/esm2020/lib/directives/drag-and-drop/drag-and-drop.directive.mjs +62 -0
  7. package/esm2020/lib/directives/drag-and-drop/drag-and-drop.module.mjs +24 -0
  8. package/esm2020/lib/directives/drag-and-drop/index.mjs +3 -0
  9. package/esm2020/lib/directives/index.mjs +2 -1
  10. package/esm2020/lib/file-upload/file-upload.component.mjs +107 -0
  11. package/esm2020/lib/file-upload/file-upload.module.mjs +42 -0
  12. package/esm2020/lib/file-upload/index.mjs +4 -0
  13. package/esm2020/lib/file-upload/models/file-upload-error-type.enum.mjs +8 -0
  14. package/esm2020/lib/file-upload/models/file-upload-error.model.mjs +2 -0
  15. package/esm2020/lib/file-upload/models/index.mjs +3 -0
  16. package/esm2020/lib/filter-bar/filter-bar.component.mjs +86 -0
  17. package/esm2020/lib/filter-bar/filter-bar.module.mjs +56 -0
  18. package/esm2020/lib/filter-bar/index.mjs +4 -0
  19. package/esm2020/lib/filter-bar/models/filter-bar-change-event.model.mjs +2 -0
  20. package/esm2020/lib/filter-bar/models/filter-bar-filter-item.model.mjs +2 -0
  21. package/esm2020/lib/filter-bar/models/filter-bar-filter.model.mjs +2 -0
  22. package/esm2020/lib/filter-bar/models/filter-bar-settings.model.mjs +2 -0
  23. package/esm2020/lib/filter-bar/models/index.mjs +4 -0
  24. package/esm2020/lib/helpers/html-element-parse.helper.mjs +14 -0
  25. package/esm2020/lib/helpers/index.mjs +4 -2
  26. package/esm2020/lib/helpers/{missing-translation-helper.mjs → missing-translation.helper.mjs} +1 -1
  27. package/esm2020/lib/helpers/save-file.helper.mjs +11 -0
  28. package/esm2020/lib/multi-functional-table/index.mjs +4 -0
  29. package/esm2020/lib/multi-functional-table/models/column-config.model.mjs +2 -0
  30. package/esm2020/lib/multi-functional-table/models/column-select-config.model.mjs +2 -0
  31. package/esm2020/lib/multi-functional-table/models/export-config.model.mjs +2 -0
  32. package/esm2020/lib/multi-functional-table/models/export-format.enum.mjs +5 -0
  33. package/esm2020/lib/multi-functional-table/models/filter-config.model.mjs +2 -0
  34. package/esm2020/lib/multi-functional-table/models/index.mjs +6 -0
  35. package/esm2020/lib/multi-functional-table/models/multi-functional-table-config.model.mjs +2 -0
  36. package/esm2020/lib/multi-functional-table/models/selected-column-local-storage-config.model.mjs +2 -0
  37. package/esm2020/lib/multi-functional-table/multi-functional-table.component.mjs +176 -0
  38. package/esm2020/lib/multi-functional-table/multi-functional-table.module.mjs +60 -0
  39. package/esm2020/lib/notification-message/notification-message.component.mjs +2 -2
  40. package/esm2020/lib/pipes/date-ago/date-ago.module.mjs +28 -0
  41. package/esm2020/lib/pipes/date-ago/date-ago.pipe.mjs +111 -0
  42. package/esm2020/lib/pipes/date-ago/index.mjs +3 -0
  43. package/esm2020/lib/pipes/date-ago/models/date-ago-interval.model.mjs +2 -0
  44. package/esm2020/lib/pipes/date-ago/models/date-ago-settings.model.mjs +2 -0
  45. package/esm2020/lib/pipes/date-ago/models/date-ago-settings.token.mjs +2 -0
  46. package/esm2020/lib/pipes/date-ago/models/date-ago.model.mjs +2 -0
  47. package/esm2020/lib/pipes/date-ago/models/index.mjs +5 -0
  48. package/esm2020/lib/pipes/index.mjs +2 -1
  49. package/esm2020/public-api.mjs +5 -1
  50. package/fesm2015/tilde-nlp-ngx-common.mjs +787 -8
  51. package/fesm2015/tilde-nlp-ngx-common.mjs.map +1 -1
  52. package/fesm2020/tilde-nlp-ngx-common.mjs +769 -8
  53. package/fesm2020/tilde-nlp-ngx-common.mjs.map +1 -1
  54. package/lib/confirmation-modal/confirmation-modal.component.d.ts +12 -0
  55. package/lib/confirmation-modal/confirmation-modal.module.d.ts +11 -0
  56. package/lib/confirmation-modal/index.d.ts +4 -0
  57. package/lib/confirmation-modal/models/confirmation-body.model.d.ts +6 -0
  58. package/lib/confirmation-modal/models/confirmation.enum.d.ts +4 -0
  59. package/lib/directives/drag-and-drop/drag-and-drop.directive.d.ts +14 -0
  60. package/lib/directives/drag-and-drop/drag-and-drop.module.d.ts +8 -0
  61. package/lib/directives/drag-and-drop/index.d.ts +2 -0
  62. package/lib/directives/index.d.ts +1 -0
  63. package/lib/file-upload/file-upload.component.d.ts +29 -0
  64. package/lib/file-upload/file-upload.module.d.ts +13 -0
  65. package/lib/file-upload/index.d.ts +3 -0
  66. package/lib/file-upload/models/file-upload-error-type.enum.d.ts +6 -0
  67. package/lib/file-upload/models/file-upload-error.model.d.ts +6 -0
  68. package/lib/file-upload/models/index.d.ts +2 -0
  69. package/lib/filter-bar/filter-bar.component.d.ts +36 -0
  70. package/lib/filter-bar/filter-bar.module.d.ts +16 -0
  71. package/lib/filter-bar/index.d.ts +3 -0
  72. package/lib/filter-bar/models/filter-bar-change-event.model.d.ts +6 -0
  73. package/lib/filter-bar/models/filter-bar-filter-item.model.d.ts +4 -0
  74. package/lib/filter-bar/models/filter-bar-filter.model.d.ts +6 -0
  75. package/lib/filter-bar/models/filter-bar-settings.model.d.ts +19 -0
  76. package/lib/filter-bar/models/index.d.ts +3 -0
  77. package/lib/helpers/html-element-parse.helper.d.ts +3 -0
  78. package/lib/helpers/index.d.ts +3 -1
  79. package/lib/helpers/save-file.helper.d.ts +3 -0
  80. package/lib/multi-functional-table/index.d.ts +3 -0
  81. package/lib/multi-functional-table/models/column-config.model.d.ts +14 -0
  82. package/lib/multi-functional-table/models/column-select-config.model.d.ts +14 -0
  83. package/lib/multi-functional-table/models/export-config.model.d.ts +9 -0
  84. package/lib/multi-functional-table/models/export-format.enum.d.ts +3 -0
  85. package/lib/multi-functional-table/models/filter-config.model.d.ts +6 -0
  86. package/lib/multi-functional-table/models/index.d.ts +5 -0
  87. package/lib/multi-functional-table/models/multi-functional-table-config.model.d.ts +29 -0
  88. package/lib/multi-functional-table/models/selected-column-local-storage-config.model.d.ts +20 -0
  89. package/lib/multi-functional-table/multi-functional-table.component.d.ts +48 -0
  90. package/lib/multi-functional-table/multi-functional-table.module.d.ts +17 -0
  91. package/lib/pipes/date-ago/date-ago.module.d.ts +9 -0
  92. package/lib/pipes/date-ago/date-ago.pipe.d.ts +20 -0
  93. package/lib/pipes/date-ago/index.d.ts +2 -0
  94. package/lib/pipes/date-ago/models/date-ago-interval.model.d.ts +5 -0
  95. package/lib/pipes/date-ago/models/date-ago-settings.model.d.ts +26 -0
  96. package/lib/pipes/date-ago/models/date-ago-settings.token.d.ts +1 -0
  97. package/lib/pipes/date-ago/models/date-ago.model.d.ts +4 -0
  98. package/lib/pipes/date-ago/models/index.d.ts +4 -0
  99. package/lib/pipes/index.d.ts +1 -0
  100. package/package.json +1 -1
  101. package/public-api.d.ts +4 -0
  102. package/styles/components/icons.scss +16 -4
  103. package/styles/mixins/material-overrides/mat-progress-bar-overrides.mixin.scss +14 -0
  104. package/styles/mixins/material-overrides/material-overrides.mixin.scss +2 -0
  105. package/styles/mixins/tld-all-mixins.mixin.scss +9 -1
  106. /package/lib/helpers/{missing-translation-helper.d.ts → missing-translation.helper.d.ts} +0 -0
@@ -1,21 +1,42 @@
1
1
  import * as i0 from '@angular/core';
2
- import { Injectable, Directive, Input, HostListener, NgModule, Component, Pipe, EventEmitter, Output, ViewChild } from '@angular/core';
2
+ import { Injectable, Directive, Input, HostListener, NgModule, Component, Pipe, Inject, Optional, EventEmitter, Output, HostBinding, ViewChild, ElementRef, ContentChildren, ContentChild } from '@angular/core';
3
3
  import * as i1 from '@angular/material/icon';
4
+ import { MatIconModule } from '@angular/material/icon';
4
5
  import * as i2 from '@angular/platform-browser';
5
6
  import * as i1$1 from '@angular/common';
6
7
  import { CommonModule } from '@angular/common';
7
8
  import * as i2$1 from '@angular/material/tooltip';
8
9
  import { MatTooltipModule } from '@angular/material/tooltip';
9
10
  import * as i1$2 from '@ngx-translate/core';
10
- import { TranslateModule } from '@ngx-translate/core';
11
- import { Observable, of } from 'rxjs';
12
- import * as i1$3 from '@angular/material/button';
11
+ import { TranslateModule, TranslatePipe } from '@ngx-translate/core';
12
+ import { Observable, of, take } from 'rxjs';
13
+ import * as i5 from '@angular/material/button';
13
14
  import { MatButtonModule } from '@angular/material/button';
14
15
  import { FlexLayoutModule } from '@angular/flex-layout';
15
16
  import * as i6 from '@angular/router';
16
17
  import { RouterModule } from '@angular/router';
17
18
  import * as i2$2 from '@angular/flex-layout/flex';
18
19
  import * as i3 from '@angular/flex-layout/extended';
20
+ import * as i2$3 from '@angular/material/progress-bar';
21
+ import { MatProgressBarModule } from '@angular/material/progress-bar';
22
+ import * as i2$4 from '@angular/material/form-field';
23
+ import { MatFormFieldModule } from '@angular/material/form-field';
24
+ import * as i3$1 from '@angular/material/input';
25
+ import { MatInputModule } from '@angular/material/input';
26
+ import * as i5$1 from '@angular/material/select';
27
+ import { MatSelectModule } from '@angular/material/select';
28
+ import * as i6$1 from '@angular/material/core';
29
+ import * as i7 from '@angular/forms';
30
+ import { FormsModule } from '@angular/forms';
31
+ import { MatSort, MatSortModule } from '@angular/material/sort';
32
+ import * as i4 from '@angular/material/table';
33
+ import { MatNoDataRow, MatHeaderRowDef, MatRowDef, MatColumnDef, MatTable, MatTableModule } from '@angular/material/table';
34
+ import * as i6$2 from '@angular/material/menu';
35
+ import { MatMenuModule } from '@angular/material/menu';
36
+ import * as i7$1 from '@angular/material/checkbox';
37
+ import { MatCheckboxModule } from '@angular/material/checkbox';
38
+ import * as i1$3 from '@angular/material/dialog';
39
+ import { MAT_DIALOG_DATA, MatDialogModule } from '@angular/material/dialog';
19
40
 
20
41
  class IconService {
21
42
  constructor(iconRegistry, sanitizer) {
@@ -347,6 +368,137 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
347
368
  }]
348
369
  }] });
349
370
 
371
+ const DateAgoSettingsToken = "DATE_AGO_SETTINGS";
372
+
373
+ /**
374
+ * Pipe that converts date to date ago and returns translated string.
375
+ */
376
+ class DateAgoPipe {
377
+ constructor(translate, _ref, settings) {
378
+ this.translate = translate;
379
+ this._ref = _ref;
380
+ this.settings = settings;
381
+ this.defaultSettings = {
382
+ intervals: [
383
+ {
384
+ key: "YEAR",
385
+ interval: 31536000,
386
+ min: 1
387
+ },
388
+ {
389
+ key: "MONTH",
390
+ interval: 2592000,
391
+ min: 1
392
+ },
393
+ {
394
+ key: "WEEK",
395
+ interval: 604800,
396
+ min: 2
397
+ },
398
+ {
399
+ key: "DAY",
400
+ interval: 86400,
401
+ min: 1
402
+ },
403
+ {
404
+ key: "HOUR",
405
+ interval: 3600,
406
+ min: 1
407
+ },
408
+ {
409
+ key: "MINUTE",
410
+ interval: 60,
411
+ min: 1
412
+ },
413
+ {
414
+ key: "SECOND",
415
+ interval: 1,
416
+ min: 10
417
+ }
418
+ ],
419
+ localizationPrefix: "DATE_AGO",
420
+ multiplePostfix: "S",
421
+ justNowKey: "JUST_NOW",
422
+ justNowSeconds: 29
423
+ };
424
+ }
425
+ get intervals() { return this.settings?.intervals ?? this.defaultSettings.intervals; }
426
+ get multiplePostfix() { return this.settings?.multiplePostfix ?? this.defaultSettings.multiplePostfix; }
427
+ get localizationPrefix() { return this.settings?.localizationPrefix ?? this.defaultSettings.localizationPrefix; }
428
+ get justNowKey() { return this.settings?.justNowKey ?? this.defaultSettings.justNowKey; }
429
+ get justNowSeconds() { return this.settings?.justNowSeconds ?? this.defaultSettings.justNowSeconds; }
430
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
431
+ transform(value, enableMultiplePostfix = true) {
432
+ const dateAgo = this.calculateDateAgo(value, enableMultiplePostfix);
433
+ if (!dateAgo) {
434
+ return "";
435
+ }
436
+ const translatePipe = new TranslatePipe(this.translate, this._ref);
437
+ return translatePipe.transform(`${this.localizationPrefix}.${dateAgo.key}`, { value: dateAgo.howMany });
438
+ }
439
+ calculateDateAgo(value, enableMultiplePostfix) {
440
+ if (value) {
441
+ const seconds = Math.floor((new Date().getTime() - new Date(value).getTime()) / 1000);
442
+ if (seconds < this.justNowSeconds) // less than 30 seconds ago will show as 'Just now'
443
+ return { key: this.justNowKey };
444
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
445
+ let counter;
446
+ let type;
447
+ for (let i = 0; i < this.intervals.length; i++) {
448
+ const interval = this.intervals[i];
449
+ counter = Math.floor(seconds / interval.interval);
450
+ if (counter >= interval.min) {
451
+ type = interval.key;
452
+ if (enableMultiplePostfix && counter > 1) {
453
+ // add "S" in the end of localization key
454
+ type += this.multiplePostfix;
455
+ }
456
+ break;
457
+ }
458
+ }
459
+ return { key: type, howMany: counter };
460
+ }
461
+ return null;
462
+ }
463
+ }
464
+ DateAgoPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: DateAgoPipe, deps: [{ token: i1$2.TranslateService }, { token: i0.ChangeDetectorRef }, { token: DateAgoSettingsToken, optional: true }], target: i0.ɵɵFactoryTarget.Pipe });
465
+ DateAgoPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "14.3.0", ngImport: i0, type: DateAgoPipe, name: "dateAgo", pure: false });
466
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: DateAgoPipe, decorators: [{
467
+ type: Pipe,
468
+ args: [{
469
+ name: 'dateAgo',
470
+ pure: false
471
+ }]
472
+ }], ctorParameters: function () { return [{ type: i1$2.TranslateService }, { type: i0.ChangeDetectorRef }, { type: undefined, decorators: [{
473
+ type: Inject,
474
+ args: [DateAgoSettingsToken]
475
+ }, {
476
+ type: Optional
477
+ }] }]; } });
478
+
479
+ class DateAgoModule {
480
+ }
481
+ DateAgoModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: DateAgoModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
482
+ DateAgoModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.3.0", ngImport: i0, type: DateAgoModule, declarations: [DateAgoPipe], imports: [CommonModule,
483
+ TranslateModule], exports: [DateAgoPipe] });
484
+ DateAgoModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: DateAgoModule, imports: [CommonModule,
485
+ TranslateModule] });
486
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: DateAgoModule, decorators: [{
487
+ type: NgModule,
488
+ args: [{
489
+ declarations: [
490
+ DateAgoPipe
491
+ ],
492
+ imports: [
493
+ CommonModule,
494
+ TranslateModule
495
+ ],
496
+ exports: [
497
+ DateAgoPipe
498
+ ]
499
+ }]
500
+ }] });
501
+
350
502
  class ClickOutsideDirective {
351
503
  constructor(elementRef) {
352
504
  this.elementRef = elementRef;
@@ -394,6 +546,86 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
394
546
  }]
395
547
  }] });
396
548
 
549
+ class DragAndDropDirective {
550
+ constructor(element) {
551
+ this.element = element;
552
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
553
+ this.fileDropped = new EventEmitter();
554
+ }
555
+ get disabled() { return this.element.nativeElement.disabled; }
556
+ // Dragover listener
557
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
558
+ onDragOver(evt) {
559
+ evt.preventDefault();
560
+ evt.stopPropagation();
561
+ this.active = !this.disabled;
562
+ }
563
+ // Dragleave listener
564
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
565
+ onDragLeave(evt) {
566
+ evt.preventDefault();
567
+ evt.stopPropagation();
568
+ this.active = false;
569
+ }
570
+ // Drop listener
571
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
572
+ ondrop(evt) {
573
+ evt.preventDefault();
574
+ evt.stopPropagation();
575
+ this.active = false;
576
+ if (this.disabled) {
577
+ return;
578
+ }
579
+ const files = evt.dataTransfer.files;
580
+ if (files.length > 0) {
581
+ this.fileDropped.emit(files);
582
+ }
583
+ }
584
+ }
585
+ DragAndDropDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: DragAndDropDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
586
+ DragAndDropDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.3.0", type: DragAndDropDirective, selector: "[tldDragAndDrop]", outputs: { fileDropped: "fileDropped" }, host: { listeners: { "dragover": "onDragOver($event)", "dragleave": "onDragLeave($event)", "drop": "ondrop($event)" }, properties: { "class.tld-file-over": "this.active" } }, ngImport: i0 });
587
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: DragAndDropDirective, decorators: [{
588
+ type: Directive,
589
+ args: [{
590
+ // eslint-disable-next-line @angular-eslint/directive-selector
591
+ selector: '[tldDragAndDrop]'
592
+ }]
593
+ }], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { active: [{
594
+ type: HostBinding,
595
+ args: ['class.tld-file-over']
596
+ }], fileDropped: [{
597
+ type: Output
598
+ }], onDragOver: [{
599
+ type: HostListener,
600
+ args: ['dragover', ['$event']]
601
+ }], onDragLeave: [{
602
+ type: HostListener,
603
+ args: ['dragleave', ['$event']]
604
+ }], ondrop: [{
605
+ type: HostListener,
606
+ args: ['drop', ['$event']]
607
+ }] } });
608
+
609
+ class DragAndDropModule {
610
+ }
611
+ DragAndDropModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: DragAndDropModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
612
+ DragAndDropModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.3.0", ngImport: i0, type: DragAndDropModule, declarations: [DragAndDropDirective], imports: [CommonModule], exports: [DragAndDropDirective] });
613
+ DragAndDropModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: DragAndDropModule, imports: [CommonModule] });
614
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: DragAndDropModule, decorators: [{
615
+ type: NgModule,
616
+ args: [{
617
+ declarations: [
618
+ DragAndDropDirective
619
+ ],
620
+ imports: [
621
+ CommonModule
622
+ ],
623
+ exports: [
624
+ DragAndDropDirective
625
+ ]
626
+ }]
627
+ }] });
628
+
397
629
  class CloseButtonComponent {
398
630
  constructor() {
399
631
  // any type because emitter doesn't really need a value
@@ -406,7 +638,7 @@ class CloseButtonComponent {
406
638
  }
407
639
  }
408
640
  CloseButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CloseButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
409
- CloseButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: CloseButtonComponent, selector: "tld-close-button", inputs: { ariaCode: "ariaCode", disabled: "disabled", tooltip: "tooltip" }, outputs: { tldClick: "tldClick" }, viewQueries: [{ propertyName: "clearButton", first: true, predicate: ["clearButton"], descendants: true }], ngImport: i0, template: "<button [matTooltip]=\"tooltip | translate\"\r\n#clearButton mat-icon-button (click)=\"clicked()\" [attr.aria-label]=\"'ARIA_LABELS.'+ariaCode | translate\"\r\n [disabled]=\"disabled\">\r\n <span class=\"material-icons\">\r\n close\r\n </span>\r\n</button>", dependencies: [{ kind: "component", type: i1$3.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: i2$1.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }] });
641
+ CloseButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: CloseButtonComponent, selector: "tld-close-button", inputs: { ariaCode: "ariaCode", disabled: "disabled", tooltip: "tooltip" }, outputs: { tldClick: "tldClick" }, viewQueries: [{ propertyName: "clearButton", first: true, predicate: ["clearButton"], descendants: true }], ngImport: i0, template: "<button [matTooltip]=\"tooltip | translate\"\r\n#clearButton mat-icon-button (click)=\"clicked()\" [attr.aria-label]=\"'ARIA_LABELS.'+ariaCode | translate\"\r\n [disabled]=\"disabled\">\r\n <span class=\"material-icons\">\r\n close\r\n </span>\r\n</button>", dependencies: [{ kind: "component", type: i5.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: i2$1.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }] });
410
642
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CloseButtonComponent, decorators: [{
411
643
  type: Component,
412
644
  args: [{ selector: 'tld-close-button', template: "<button [matTooltip]=\"tooltip | translate\"\r\n#clearButton mat-icon-button (click)=\"clicked()\" [attr.aria-label]=\"'ARIA_LABELS.'+ariaCode | translate\"\r\n [disabled]=\"disabled\">\r\n <span class=\"material-icons\">\r\n close\r\n </span>\r\n</button>" }]
@@ -478,10 +710,10 @@ class NotificationMessageComponent {
478
710
  }
479
711
  }
480
712
  NotificationMessageComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: NotificationMessageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
481
- NotificationMessageComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: NotificationMessageComponent, selector: "lib-tld-notification-message", inputs: { message: "message", inline: "inline" }, outputs: { buttonClicked: "buttonClicked", closeClicked: "closeClicked", linkClicked: "linkClicked" }, ngImport: i0, template: "<div class=\"notification-message {{className}}\">\r\n <div class=\"notification-message-container tld-default-border\" [ngClass.lt-md]=\"'mobile'\" [class.inline]=\"inline\"\r\n fxLayout=\"row\" fxLayoutAlign=\"start start\" [attr.id]=\"message.id\" aria-live=\"polite\" fxLayout=\"row\">\r\n <span class=\"material-icons message-icon\">\r\n {{iconNames[message.type]}}\r\n </span>\r\n <div class=\"items-container\" fxFlex>\r\n <div fxLayout=\"row\">\r\n <div class=\"text-container\" fxFlex>\r\n <h1 *ngIf=\"message.title\" class=\"message-title\"\r\n [innerHtml]=\"message.title | translate: message.localizationParams\"></h1>\r\n <p *ngIf=\"message.body\" class=\"message-body\">\r\n <span [innerHtml]=\"message.body | translate: message.localizationParams\"></span>\r\n <span *ngIf=\"message.support\" [innerHtml]=\"message.support | translate: message.localizationParams\"></span>\r\n </p>\r\n </div>\r\n <tld-close-button *ngIf=\"!message.hideClose\" class=\"close-button\" (tldClick)=\"closeClick()\">\r\n </tld-close-button>\r\n </div>\r\n <div fxLayout=\"row\" fxLayoutGap=\"16px\" fxLayoutAlign=\"start center\"\r\n *ngIf=\"message.buttonText || message.linkHref || message.routerLink\">\r\n <button class=\"message-action-button\" color=\"accent\" mat-flat-button *ngIf=\"message.buttonText\"\r\n (click)=\"buttonClick()\">{{message.buttonText | translate}} </button>\r\n <a class=\"message-action-link\" *ngIf=\"message.linkHref && message.linkText\" (click)=\"linkClick()\"\r\n [attr.href]=\"message.linkHref\">{{message.linkText |\r\n translate}}</a>\r\n <a class=\"message-action-link\" *ngIf=\"message.routerLink && message.linkText\" (click)=\"linkClick()\"\r\n [routerLink]=\"[message.routerLink]\">{{message.linkText |\r\n translate}}</a>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: [".notification-message.basic .notification-message-container{background-color:var(--base-100);border-color:var(--base-100)}.notification-message.basic .notification-message-container .message-icon{color:var(--base-40)}.notification-message.basic .notification-message-container .message-action-button{background-color:var(--base-40)}.notification-message.error .notification-message-container{background-color:var(--error-light);border-color:var(--base-100)}.notification-message.error .notification-message-container .message-icon{color:var(--error-dark)}.notification-message.error .notification-message-container .message-action-button{background-color:var(--base-40)}.notification-message.warning .notification-message-container{background-color:var(--warning-light);border-color:var(--base-100)}.notification-message.warning .notification-message-container .message-icon{color:var(--warning-dark)}.notification-message.warning .notification-message-container .message-action-button{background-color:var(--base-40)}.notification-message.success .notification-message-container{background-color:var(--success-light);border-color:var(--base-100)}.notification-message.success .notification-message-container .message-icon{color:var(--success-dark)}.notification-message.success .notification-message-container .message-action-button{background-color:var(--base-40)}.notification-message .notification-message-container{border:1px solid var(--base-95);border-radius:.5em}.notification-message .notification-message-container.mobile{padding:.6em .4em!important}.notification-message .notification-message-container.mobile .items-container{margin-left:.4em!important}.notification-message .notification-message-container.mobile .items-container div+div{margin-top:.2em!important}.notification-message .notification-message-container.mobile .items-container .message-title+.message-body{margin-top:0!important}.notification-message .notification-message-container .text-container:first-child{line-height:1.5em}.notification-message .notification-message-container .text-container .message-title{font-weight:500;margin:0}.notification-message .notification-message-container .text-container .message-body{margin:0}.notification-message .notification-message-container:not(.inline){padding:1.5em}.notification-message .notification-message-container:not(.inline) .items-container{margin-left:1em}.notification-message .notification-message-container:not(.inline) .items-container div+div,.notification-message .notification-message-container:not(.inline) .items-container .message-title+.message-body{margin-top:1em}.notification-message .notification-message-container:not(.inline) .message-title{font-size:1.25em}.notification-message .notification-message-container:not(.inline) .message-body{line-height:1.5em}.notification-message .notification-message-container.inline{padding:.75em 1em}.notification-message .notification-message-container.inline .items-container{margin-left:.75em}.notification-message .notification-message-container.inline .items-container div+div{margin-top:.5em}.notification-message .notification-message-container.inline .items-container .message-title+.message-body{margin-top:.2em}.notification-message .notification-message-container.inline .message-title{font-size:1em}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$2.DefaultLayoutDirective, selector: " [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md], [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md], [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm], [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i2$2.DefaultLayoutGapDirective, selector: " [fxLayoutGap], [fxLayoutGap.xs], [fxLayoutGap.sm], [fxLayoutGap.md], [fxLayoutGap.lg], [fxLayoutGap.xl], [fxLayoutGap.lt-sm], [fxLayoutGap.lt-md], [fxLayoutGap.lt-lg], [fxLayoutGap.lt-xl], [fxLayoutGap.gt-xs], [fxLayoutGap.gt-sm], [fxLayoutGap.gt-md], [fxLayoutGap.gt-lg]", inputs: ["fxLayoutGap", "fxLayoutGap.xs", "fxLayoutGap.sm", "fxLayoutGap.md", "fxLayoutGap.lg", "fxLayoutGap.xl", "fxLayoutGap.lt-sm", "fxLayoutGap.lt-md", "fxLayoutGap.lt-lg", "fxLayoutGap.lt-xl", "fxLayoutGap.gt-xs", "fxLayoutGap.gt-sm", "fxLayoutGap.gt-md", "fxLayoutGap.gt-lg"] }, { kind: "directive", type: i2$2.DefaultLayoutAlignDirective, selector: " [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md], [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md], [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm], [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { kind: "directive", type: i2$2.DefaultFlexDirective, selector: " [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md], [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md], [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm], [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { kind: "directive", type: i3.DefaultClassDirective, selector: " [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl], [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl], [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }, { kind: "component", type: CloseButtonComponent, selector: "tld-close-button", inputs: ["ariaCode", "disabled", "tooltip"], outputs: ["tldClick"] }, { kind: "component", type: i1$3.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: i6.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }] });
713
+ NotificationMessageComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: NotificationMessageComponent, selector: "lib-tld-notification-message", inputs: { message: "message", inline: "inline" }, outputs: { buttonClicked: "buttonClicked", closeClicked: "closeClicked", linkClicked: "linkClicked" }, ngImport: i0, template: "<div class=\"notification-message {{className}}\">\r\n <div class=\"notification-message-container tld-default-border\" [ngClass.lt-md]=\"'mobile'\" [class.inline]=\"inline\"\r\n fxLayout=\"row\" fxLayoutAlign=\"start start\" [attr.id]=\"message.id\" aria-live=\"polite\" fxLayout=\"row\">\r\n <span class=\"material-icons message-icon\">\r\n {{iconNames[message.type]}}\r\n </span>\r\n <div class=\"items-container\" fxFlex>\r\n <div fxLayout=\"row\">\r\n <div class=\"text-container\" fxFlex>\r\n <h1 *ngIf=\"message.title\" class=\"message-title\"\r\n [innerHtml]=\"message.title | translate: message.localizationParams\"></h1>\r\n <p *ngIf=\"message.body\" class=\"message-body\">\r\n <span [innerHtml]=\"message.body | translate: message.localizationParams\"></span>\r\n <span *ngIf=\"message.support\" [innerHtml]=\"message.support | translate: message.localizationParams\"></span>\r\n </p>\r\n </div>\r\n <tld-close-button *ngIf=\"!message.hideClose\" class=\"close-button\" (tldClick)=\"closeClick()\">\r\n </tld-close-button>\r\n </div>\r\n <div fxLayout=\"row\" fxLayoutGap=\"16px\" fxLayoutAlign=\"start center\"\r\n *ngIf=\"message.buttonText || message.linkHref || message.routerLink\">\r\n <button class=\"message-action-button\" color=\"accent\" mat-flat-button *ngIf=\"message.buttonText\"\r\n (click)=\"buttonClick()\">{{message.buttonText | translate}} </button>\r\n <a class=\"message-action-link\" *ngIf=\"message.linkHref && message.linkText\" (click)=\"linkClick()\"\r\n [attr.href]=\"message.linkHref\">{{message.linkText |\r\n translate}}</a>\r\n <a class=\"message-action-link\" *ngIf=\"message.routerLink && message.linkText\" (click)=\"linkClick()\"\r\n [routerLink]=\"[message.routerLink]\">{{message.linkText |\r\n translate}}</a>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: [":host{display:inline-block;width:100%}.notification-message.basic .notification-message-container{background-color:var(--base-100);border-color:var(--base-100)}.notification-message.basic .notification-message-container .message-icon{color:var(--base-40)}.notification-message.basic .notification-message-container .message-action-button{background-color:var(--base-40)}.notification-message.error .notification-message-container{background-color:var(--error-light);border-color:var(--base-100)}.notification-message.error .notification-message-container .message-icon{color:var(--error-dark)}.notification-message.error .notification-message-container .message-action-button{background-color:var(--base-40)}.notification-message.warning .notification-message-container{background-color:var(--warning-light);border-color:var(--base-100)}.notification-message.warning .notification-message-container .message-icon{color:var(--warning-dark)}.notification-message.warning .notification-message-container .message-action-button{background-color:var(--base-40)}.notification-message.success .notification-message-container{background-color:var(--success-light);border-color:var(--base-100)}.notification-message.success .notification-message-container .message-icon{color:var(--success-dark)}.notification-message.success .notification-message-container .message-action-button{background-color:var(--base-40)}.notification-message .notification-message-container{border:1px solid var(--base-95);border-radius:.5em}.notification-message .notification-message-container.mobile{padding:.6em .4em!important}.notification-message .notification-message-container.mobile .items-container{margin-left:.4em!important}.notification-message .notification-message-container.mobile .items-container div+div{margin-top:.2em!important}.notification-message .notification-message-container.mobile .items-container .message-title+.message-body{margin-top:0!important}.notification-message .notification-message-container .text-container:first-child{line-height:1.5em}.notification-message .notification-message-container .text-container .message-title{font-weight:500;margin:0}.notification-message .notification-message-container .text-container .message-body{margin:0}.notification-message .notification-message-container:not(.inline){padding:1.5em}.notification-message .notification-message-container:not(.inline) .items-container{margin-left:1em}.notification-message .notification-message-container:not(.inline) .items-container div+div,.notification-message .notification-message-container:not(.inline) .items-container .message-title+.message-body{margin-top:1em}.notification-message .notification-message-container:not(.inline) .message-title{font-size:1.25em}.notification-message .notification-message-container:not(.inline) .message-body{line-height:1.5em}.notification-message .notification-message-container.inline{padding:.75em 1em}.notification-message .notification-message-container.inline .items-container{margin-left:.75em}.notification-message .notification-message-container.inline .items-container div+div{margin-top:.5em}.notification-message .notification-message-container.inline .items-container .message-title+.message-body{margin-top:.2em}.notification-message .notification-message-container.inline .message-title{font-size:1em}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$2.DefaultLayoutDirective, selector: " [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md], [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md], [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm], [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i2$2.DefaultLayoutGapDirective, selector: " [fxLayoutGap], [fxLayoutGap.xs], [fxLayoutGap.sm], [fxLayoutGap.md], [fxLayoutGap.lg], [fxLayoutGap.xl], [fxLayoutGap.lt-sm], [fxLayoutGap.lt-md], [fxLayoutGap.lt-lg], [fxLayoutGap.lt-xl], [fxLayoutGap.gt-xs], [fxLayoutGap.gt-sm], [fxLayoutGap.gt-md], [fxLayoutGap.gt-lg]", inputs: ["fxLayoutGap", "fxLayoutGap.xs", "fxLayoutGap.sm", "fxLayoutGap.md", "fxLayoutGap.lg", "fxLayoutGap.xl", "fxLayoutGap.lt-sm", "fxLayoutGap.lt-md", "fxLayoutGap.lt-lg", "fxLayoutGap.lt-xl", "fxLayoutGap.gt-xs", "fxLayoutGap.gt-sm", "fxLayoutGap.gt-md", "fxLayoutGap.gt-lg"] }, { kind: "directive", type: i2$2.DefaultLayoutAlignDirective, selector: " [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md], [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md], [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm], [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { kind: "directive", type: i2$2.DefaultFlexDirective, selector: " [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md], [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md], [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm], [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { kind: "directive", type: i3.DefaultClassDirective, selector: " [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl], [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl], [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }, { kind: "component", type: CloseButtonComponent, selector: "tld-close-button", inputs: ["ariaCode", "disabled", "tooltip"], outputs: ["tldClick"] }, { kind: "component", type: i5.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: i6.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }] });
482
714
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: NotificationMessageComponent, decorators: [{
483
715
  type: Component,
484
- args: [{ selector: 'lib-tld-notification-message', template: "<div class=\"notification-message {{className}}\">\r\n <div class=\"notification-message-container tld-default-border\" [ngClass.lt-md]=\"'mobile'\" [class.inline]=\"inline\"\r\n fxLayout=\"row\" fxLayoutAlign=\"start start\" [attr.id]=\"message.id\" aria-live=\"polite\" fxLayout=\"row\">\r\n <span class=\"material-icons message-icon\">\r\n {{iconNames[message.type]}}\r\n </span>\r\n <div class=\"items-container\" fxFlex>\r\n <div fxLayout=\"row\">\r\n <div class=\"text-container\" fxFlex>\r\n <h1 *ngIf=\"message.title\" class=\"message-title\"\r\n [innerHtml]=\"message.title | translate: message.localizationParams\"></h1>\r\n <p *ngIf=\"message.body\" class=\"message-body\">\r\n <span [innerHtml]=\"message.body | translate: message.localizationParams\"></span>\r\n <span *ngIf=\"message.support\" [innerHtml]=\"message.support | translate: message.localizationParams\"></span>\r\n </p>\r\n </div>\r\n <tld-close-button *ngIf=\"!message.hideClose\" class=\"close-button\" (tldClick)=\"closeClick()\">\r\n </tld-close-button>\r\n </div>\r\n <div fxLayout=\"row\" fxLayoutGap=\"16px\" fxLayoutAlign=\"start center\"\r\n *ngIf=\"message.buttonText || message.linkHref || message.routerLink\">\r\n <button class=\"message-action-button\" color=\"accent\" mat-flat-button *ngIf=\"message.buttonText\"\r\n (click)=\"buttonClick()\">{{message.buttonText | translate}} </button>\r\n <a class=\"message-action-link\" *ngIf=\"message.linkHref && message.linkText\" (click)=\"linkClick()\"\r\n [attr.href]=\"message.linkHref\">{{message.linkText |\r\n translate}}</a>\r\n <a class=\"message-action-link\" *ngIf=\"message.routerLink && message.linkText\" (click)=\"linkClick()\"\r\n [routerLink]=\"[message.routerLink]\">{{message.linkText |\r\n translate}}</a>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: [".notification-message.basic .notification-message-container{background-color:var(--base-100);border-color:var(--base-100)}.notification-message.basic .notification-message-container .message-icon{color:var(--base-40)}.notification-message.basic .notification-message-container .message-action-button{background-color:var(--base-40)}.notification-message.error .notification-message-container{background-color:var(--error-light);border-color:var(--base-100)}.notification-message.error .notification-message-container .message-icon{color:var(--error-dark)}.notification-message.error .notification-message-container .message-action-button{background-color:var(--base-40)}.notification-message.warning .notification-message-container{background-color:var(--warning-light);border-color:var(--base-100)}.notification-message.warning .notification-message-container .message-icon{color:var(--warning-dark)}.notification-message.warning .notification-message-container .message-action-button{background-color:var(--base-40)}.notification-message.success .notification-message-container{background-color:var(--success-light);border-color:var(--base-100)}.notification-message.success .notification-message-container .message-icon{color:var(--success-dark)}.notification-message.success .notification-message-container .message-action-button{background-color:var(--base-40)}.notification-message .notification-message-container{border:1px solid var(--base-95);border-radius:.5em}.notification-message .notification-message-container.mobile{padding:.6em .4em!important}.notification-message .notification-message-container.mobile .items-container{margin-left:.4em!important}.notification-message .notification-message-container.mobile .items-container div+div{margin-top:.2em!important}.notification-message .notification-message-container.mobile .items-container .message-title+.message-body{margin-top:0!important}.notification-message .notification-message-container .text-container:first-child{line-height:1.5em}.notification-message .notification-message-container .text-container .message-title{font-weight:500;margin:0}.notification-message .notification-message-container .text-container .message-body{margin:0}.notification-message .notification-message-container:not(.inline){padding:1.5em}.notification-message .notification-message-container:not(.inline) .items-container{margin-left:1em}.notification-message .notification-message-container:not(.inline) .items-container div+div,.notification-message .notification-message-container:not(.inline) .items-container .message-title+.message-body{margin-top:1em}.notification-message .notification-message-container:not(.inline) .message-title{font-size:1.25em}.notification-message .notification-message-container:not(.inline) .message-body{line-height:1.5em}.notification-message .notification-message-container.inline{padding:.75em 1em}.notification-message .notification-message-container.inline .items-container{margin-left:.75em}.notification-message .notification-message-container.inline .items-container div+div{margin-top:.5em}.notification-message .notification-message-container.inline .items-container .message-title+.message-body{margin-top:.2em}.notification-message .notification-message-container.inline .message-title{font-size:1em}\n"] }]
716
+ args: [{ selector: 'lib-tld-notification-message', template: "<div class=\"notification-message {{className}}\">\r\n <div class=\"notification-message-container tld-default-border\" [ngClass.lt-md]=\"'mobile'\" [class.inline]=\"inline\"\r\n fxLayout=\"row\" fxLayoutAlign=\"start start\" [attr.id]=\"message.id\" aria-live=\"polite\" fxLayout=\"row\">\r\n <span class=\"material-icons message-icon\">\r\n {{iconNames[message.type]}}\r\n </span>\r\n <div class=\"items-container\" fxFlex>\r\n <div fxLayout=\"row\">\r\n <div class=\"text-container\" fxFlex>\r\n <h1 *ngIf=\"message.title\" class=\"message-title\"\r\n [innerHtml]=\"message.title | translate: message.localizationParams\"></h1>\r\n <p *ngIf=\"message.body\" class=\"message-body\">\r\n <span [innerHtml]=\"message.body | translate: message.localizationParams\"></span>\r\n <span *ngIf=\"message.support\" [innerHtml]=\"message.support | translate: message.localizationParams\"></span>\r\n </p>\r\n </div>\r\n <tld-close-button *ngIf=\"!message.hideClose\" class=\"close-button\" (tldClick)=\"closeClick()\">\r\n </tld-close-button>\r\n </div>\r\n <div fxLayout=\"row\" fxLayoutGap=\"16px\" fxLayoutAlign=\"start center\"\r\n *ngIf=\"message.buttonText || message.linkHref || message.routerLink\">\r\n <button class=\"message-action-button\" color=\"accent\" mat-flat-button *ngIf=\"message.buttonText\"\r\n (click)=\"buttonClick()\">{{message.buttonText | translate}} </button>\r\n <a class=\"message-action-link\" *ngIf=\"message.linkHref && message.linkText\" (click)=\"linkClick()\"\r\n [attr.href]=\"message.linkHref\">{{message.linkText |\r\n translate}}</a>\r\n <a class=\"message-action-link\" *ngIf=\"message.routerLink && message.linkText\" (click)=\"linkClick()\"\r\n [routerLink]=\"[message.routerLink]\">{{message.linkText |\r\n translate}}</a>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: [":host{display:inline-block;width:100%}.notification-message.basic .notification-message-container{background-color:var(--base-100);border-color:var(--base-100)}.notification-message.basic .notification-message-container .message-icon{color:var(--base-40)}.notification-message.basic .notification-message-container .message-action-button{background-color:var(--base-40)}.notification-message.error .notification-message-container{background-color:var(--error-light);border-color:var(--base-100)}.notification-message.error .notification-message-container .message-icon{color:var(--error-dark)}.notification-message.error .notification-message-container .message-action-button{background-color:var(--base-40)}.notification-message.warning .notification-message-container{background-color:var(--warning-light);border-color:var(--base-100)}.notification-message.warning .notification-message-container .message-icon{color:var(--warning-dark)}.notification-message.warning .notification-message-container .message-action-button{background-color:var(--base-40)}.notification-message.success .notification-message-container{background-color:var(--success-light);border-color:var(--base-100)}.notification-message.success .notification-message-container .message-icon{color:var(--success-dark)}.notification-message.success .notification-message-container .message-action-button{background-color:var(--base-40)}.notification-message .notification-message-container{border:1px solid var(--base-95);border-radius:.5em}.notification-message .notification-message-container.mobile{padding:.6em .4em!important}.notification-message .notification-message-container.mobile .items-container{margin-left:.4em!important}.notification-message .notification-message-container.mobile .items-container div+div{margin-top:.2em!important}.notification-message .notification-message-container.mobile .items-container .message-title+.message-body{margin-top:0!important}.notification-message .notification-message-container .text-container:first-child{line-height:1.5em}.notification-message .notification-message-container .text-container .message-title{font-weight:500;margin:0}.notification-message .notification-message-container .text-container .message-body{margin:0}.notification-message .notification-message-container:not(.inline){padding:1.5em}.notification-message .notification-message-container:not(.inline) .items-container{margin-left:1em}.notification-message .notification-message-container:not(.inline) .items-container div+div,.notification-message .notification-message-container:not(.inline) .items-container .message-title+.message-body{margin-top:1em}.notification-message .notification-message-container:not(.inline) .message-title{font-size:1.25em}.notification-message .notification-message-container:not(.inline) .message-body{line-height:1.5em}.notification-message .notification-message-container.inline{padding:.75em 1em}.notification-message .notification-message-container.inline .items-container{margin-left:.75em}.notification-message .notification-message-container.inline .items-container div+div{margin-top:.5em}.notification-message .notification-message-container.inline .items-container .message-title+.message-body{margin-top:.2em}.notification-message .notification-message-container.inline .message-title{font-size:1em}\n"] }]
485
717
  }], propDecorators: { message: [{
486
718
  type: Input
487
719
  }], buttonClicked: [{
@@ -570,6 +802,31 @@ class MissingTranslationHelper {
570
802
  }
571
803
  }
572
804
 
805
+ class SaveFileHelper {
806
+ static saveFile(content, fileName) {
807
+ const file = new Blob([content]);
808
+ const link = document.createElement("a");
809
+ link.href = URL.createObjectURL(file);
810
+ link.download = fileName;
811
+ link.click();
812
+ link.remove();
813
+ }
814
+ }
815
+
816
+ class HtmlElementParseHelper {
817
+ static tableAsCsv(tableElement) {
818
+ const csv_data = [];
819
+ const rows = tableElement.querySelectorAll('tr');
820
+ for (let i = 0; i < rows.length; i++) {
821
+ const cols = rows[i].querySelectorAll('td,th');
822
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
823
+ const csvrow = Array.from(cols).map((element) => element.innerText);
824
+ csv_data.push(csvrow.join(","));
825
+ }
826
+ return csv_data.join('\n');
827
+ }
828
+ }
829
+
573
830
  class CompanyProductComponent {
574
831
  constructor() {
575
832
  this.company = "";
@@ -663,6 +920,510 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
663
920
  }]
664
921
  }] });
665
922
 
923
+ var FileUploadErrorTypeEnum;
924
+ (function (FileUploadErrorTypeEnum) {
925
+ FileUploadErrorTypeEnum["FILE_UPLOAD_UNSUPPORTED_FORMAT"] = "FILE_UPLOAD_UNSUPPORTED_FORMAT";
926
+ FileUploadErrorTypeEnum["FILE_UPLOAD_UNSUPPORTED_FORMAT_REGISTER"] = "FILE_UPLOAD_UNSUPPORTED_FORMAT_REGISTER";
927
+ FileUploadErrorTypeEnum["MAX_SIZE"] = "FILE_UPLOAD_MAX_SIZE";
928
+ FileUploadErrorTypeEnum["FILE_EMPTY"] = "FILE_UPLOAD_EMPTY";
929
+ })(FileUploadErrorTypeEnum || (FileUploadErrorTypeEnum = {}));
930
+
931
+ class FileUploadComponent {
932
+ constructor() {
933
+ this.fileChange = new EventEmitter();
934
+ this.errorEvent = new EventEmitter();
935
+ this._accept = [];
936
+ this.multiple = false;
937
+ }
938
+ set accept(val) {
939
+ this._accept = val;
940
+ this.allowedExtensions = val ? val.join(",") : "";
941
+ }
942
+ get accept() { return this._accept; }
943
+ handleFileInput(event) {
944
+ const target = event.target;
945
+ const files = target.files;
946
+ this.validate(files);
947
+ }
948
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
949
+ onFileDrop(files) {
950
+ this.validate(files);
951
+ }
952
+ emit(files) {
953
+ if (files && files.length > 0) {
954
+ this.fileChange.emit(files);
955
+ }
956
+ }
957
+ emitError(error) {
958
+ this.errorEvent.emit(error);
959
+ }
960
+ validate(files) {
961
+ //let size = 0;
962
+ const validFiles = [];
963
+ for (let i = 0; i < files.length; i++) {
964
+ const file = files[i];
965
+ if (!this.allowEmpty && file.size == 0) {
966
+ this.emitError({ code: FileUploadErrorTypeEnum.FILE_EMPTY, error: "File is empty", fileName: file.name });
967
+ return;
968
+ }
969
+ //size += file.size;
970
+ const extensionErrorCode = this.getExtensionErrorCode(file.name);
971
+ if (extensionErrorCode) {
972
+ const error = { code: extensionErrorCode, error: "Not valid extension.", fileName: file.name };
973
+ this.emitError(error);
974
+ }
975
+ else if (this.maxSize && file.size > this.maxSize) {
976
+ const error = { code: FileUploadErrorTypeEnum.MAX_SIZE, error: "Maximum allowed file size exceeded.", fileName: file.name };
977
+ this.emitError(error);
978
+ }
979
+ else {
980
+ validFiles.push(file);
981
+ }
982
+ }
983
+ this.emit(validFiles);
984
+ this.fileInput.nativeElement.value = '';
985
+ }
986
+ getExtensionErrorCode(fileName) {
987
+ const extension = fileName.slice(fileName.lastIndexOf('.')).toLowerCase();
988
+ if (this.accept.length == 0 || (this.accept.length == 1 && this.accept[0] == '*') || this.accept.includes(extension)) {
989
+ return null;
990
+ }
991
+ else {
992
+ return this.extendedAcceptList?.includes(extension) ? FileUploadErrorTypeEnum.FILE_UPLOAD_UNSUPPORTED_FORMAT_REGISTER : FileUploadErrorTypeEnum.FILE_UPLOAD_UNSUPPORTED_FORMAT;
993
+ }
994
+ }
995
+ }
996
+ FileUploadComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FileUploadComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
997
+ FileUploadComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FileUploadComponent, selector: "tld-file-upload", inputs: { accept: "accept", maxSize: "maxSize", multiple: "multiple", filePreviewProgress: "filePreviewProgress", allowEmpty: "allowEmpty", disabled: "disabled", uploadIconName: "uploadIconName", extendedAcceptList: "extendedAcceptList" }, outputs: { fileChange: "fileChange", errorEvent: "errorEvent" }, viewQueries: [{ propertyName: "fileInput", first: true, predicate: ["fileInput"], descendants: true }, { propertyName: "inputButton", first: true, predicate: ["inputButton"], descendants: true, read: ElementRef }], ngImport: i0, template: "<div class=\"file-upload\" [ngClass.lt-sm]=\"'file-upload-mobile'\">\r\n <mat-progress-bar class=\"tld-file-upload-progress\" color=\"primary\" [value]=\"filePreviewProgress\"\r\n *ngIf=\"filePreviewProgress\"></mat-progress-bar>\r\n <button tldDragAndDrop #inputButton mat-button (fileDropped)=\"onFileDrop($event)\" [disabled]=\"disabled\" type=\"button\"\r\n (click)=\"fileInput.click()\" class=\"upload-button text-l\">\r\n <mat-icon *ngIf=\"uploadIconName\">{{uploadIconName}}</mat-icon>\r\n <ng-content></ng-content>\r\n </button>\r\n</div>\r\n<input #fileInput type=\"file\" (change)=\"handleFileInput($event)\" name=\"files\" class=\"native-file-input\"\r\n [accept]=\"allowedExtensions\" [multiple]=\"multiple\" />\r\n", styles: [".file-upload{max-width:100%;width:100%}.file-upload .upload-button{width:100%;font-size:1em;border:1px dashed #9aa5b1;border-radius:16px;background-color:#fff;font-family:var(--tld-font);padding:1em;white-space:normal;line-height:normal;text-align:left}.file-upload-mobile .upload-button{border:2px solid var(--base-70);padding:.5em 1em!important}.tld-file-over{background-color:#e5e7e8!important;border-color:#00f!important}.mat-icon{color:var(--accent);margin-right:16px}.mat-stroked-button .mat-button-wrapper{pointer-events:none}.native-file-input{display:none}.tld-file-upload-progress ::ng-deep .mat-progress-bar-fill:after{background-color:#1e457c}.tld-file-upload-progress ::ng-deep .mat-progress-bar-buffer{background:white}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2$3.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }, { kind: "directive", type: i3.DefaultClassDirective, selector: " [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl], [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl], [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }, { kind: "component", type: i5.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: DragAndDropDirective, selector: "[tldDragAndDrop]", outputs: ["fileDropped"] }, { kind: "component", type: i1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] });
998
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FileUploadComponent, decorators: [{
999
+ type: Component,
1000
+ args: [{ selector: 'tld-file-upload', template: "<div class=\"file-upload\" [ngClass.lt-sm]=\"'file-upload-mobile'\">\r\n <mat-progress-bar class=\"tld-file-upload-progress\" color=\"primary\" [value]=\"filePreviewProgress\"\r\n *ngIf=\"filePreviewProgress\"></mat-progress-bar>\r\n <button tldDragAndDrop #inputButton mat-button (fileDropped)=\"onFileDrop($event)\" [disabled]=\"disabled\" type=\"button\"\r\n (click)=\"fileInput.click()\" class=\"upload-button text-l\">\r\n <mat-icon *ngIf=\"uploadIconName\">{{uploadIconName}}</mat-icon>\r\n <ng-content></ng-content>\r\n </button>\r\n</div>\r\n<input #fileInput type=\"file\" (change)=\"handleFileInput($event)\" name=\"files\" class=\"native-file-input\"\r\n [accept]=\"allowedExtensions\" [multiple]=\"multiple\" />\r\n", styles: [".file-upload{max-width:100%;width:100%}.file-upload .upload-button{width:100%;font-size:1em;border:1px dashed #9aa5b1;border-radius:16px;background-color:#fff;font-family:var(--tld-font);padding:1em;white-space:normal;line-height:normal;text-align:left}.file-upload-mobile .upload-button{border:2px solid var(--base-70);padding:.5em 1em!important}.tld-file-over{background-color:#e5e7e8!important;border-color:#00f!important}.mat-icon{color:var(--accent);margin-right:16px}.mat-stroked-button .mat-button-wrapper{pointer-events:none}.native-file-input{display:none}.tld-file-upload-progress ::ng-deep .mat-progress-bar-fill:after{background-color:#1e457c}.tld-file-upload-progress ::ng-deep .mat-progress-bar-buffer{background:white}\n"] }]
1001
+ }], propDecorators: { fileInput: [{
1002
+ type: ViewChild,
1003
+ args: ['fileInput']
1004
+ }], inputButton: [{
1005
+ type: ViewChild,
1006
+ args: ['inputButton', { read: ElementRef }]
1007
+ }], fileChange: [{
1008
+ type: Output
1009
+ }], errorEvent: [{
1010
+ type: Output
1011
+ }], accept: [{
1012
+ type: Input
1013
+ }], maxSize: [{
1014
+ type: Input
1015
+ }], multiple: [{
1016
+ type: Input
1017
+ }], filePreviewProgress: [{
1018
+ type: Input
1019
+ }], allowEmpty: [{
1020
+ type: Input
1021
+ }], disabled: [{
1022
+ type: Input
1023
+ }], uploadIconName: [{
1024
+ type: Input
1025
+ }], extendedAcceptList: [{
1026
+ type: Input
1027
+ }] } });
1028
+
1029
+ class FileUploadModule {
1030
+ }
1031
+ FileUploadModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FileUploadModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1032
+ FileUploadModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.3.0", ngImport: i0, type: FileUploadModule, declarations: [FileUploadComponent], imports: [CommonModule,
1033
+ MatProgressBarModule,
1034
+ FlexLayoutModule,
1035
+ MatButtonModule,
1036
+ DragAndDropModule,
1037
+ MatIconModule], exports: [FileUploadComponent] });
1038
+ FileUploadModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FileUploadModule, imports: [CommonModule,
1039
+ MatProgressBarModule,
1040
+ FlexLayoutModule,
1041
+ MatButtonModule,
1042
+ DragAndDropModule,
1043
+ MatIconModule] });
1044
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FileUploadModule, decorators: [{
1045
+ type: NgModule,
1046
+ args: [{
1047
+ declarations: [FileUploadComponent],
1048
+ imports: [
1049
+ CommonModule,
1050
+ MatProgressBarModule,
1051
+ FlexLayoutModule,
1052
+ MatButtonModule,
1053
+ DragAndDropModule,
1054
+ MatIconModule
1055
+ ],
1056
+ exports: [
1057
+ FileUploadComponent
1058
+ ]
1059
+ }]
1060
+ }] });
1061
+
1062
+ class FilterBarComponent {
1063
+ constructor(cdref) {
1064
+ this.cdref = cdref;
1065
+ this._inputText = "";
1066
+ this.filters = {
1067
+ filters: {},
1068
+ input: ""
1069
+ };
1070
+ this.filterOverflow = false;
1071
+ this.filterBarChange = new EventEmitter();
1072
+ this.defaultScrollWidth = 180;
1073
+ }
1074
+ get inputText() {
1075
+ return this._inputText;
1076
+ }
1077
+ set inputText(value) {
1078
+ this._inputText = value;
1079
+ this.filters.input = this._inputText;
1080
+ this.emitFilters();
1081
+ }
1082
+ get showSearch() {
1083
+ return !this.settings?.hideSearch;
1084
+ }
1085
+ get fields() {
1086
+ return this.settings?.filters ?? [];
1087
+ }
1088
+ onResize() {
1089
+ this.checkOverflow();
1090
+ }
1091
+ ngOnInit() {
1092
+ this.searchTooltip = this.settings?.searchTooltip ?? 'FILTER_BAR.SEARCH_TOOLTIP';
1093
+ this.searchTitle = this.settings?.searchTitle ?? 'FILTER_BAR.SEARCH';
1094
+ this.prefixIcon = this.settings?.prefixIcon ?? "filter_alt";
1095
+ this.suffixIcon = this.settings?.suffixIcon ?? "question_mark";
1096
+ this.showSuffixIcon = this.settings?.showSuffixIcon ?? true;
1097
+ }
1098
+ ngAfterViewInit() {
1099
+ this.checkOverflow();
1100
+ this.cdref.detectChanges();
1101
+ }
1102
+ filterChange(filter, event) {
1103
+ this.filters.filters[filter.fieldName] = event.value.map(item => item.value);
1104
+ this.emitFilters();
1105
+ }
1106
+ emitFilters() {
1107
+ this.filterBarChange.next(this.filters);
1108
+ }
1109
+ scrollRight() {
1110
+ this.filterWrapper.nativeElement.scrollTo({ left: (this.filterWrapper.nativeElement.scrollLeft + this.defaultScrollWidth), behavior: 'smooth' });
1111
+ }
1112
+ scrollLeft() {
1113
+ this.filterWrapper.nativeElement.scrollTo({ left: (this.filterWrapper.nativeElement.scrollLeft - this.defaultScrollWidth), behavior: 'smooth' });
1114
+ }
1115
+ checkOverflow() {
1116
+ this.filterOverflow = this.filterWrapper.nativeElement.clientWidth < this.filterWrapper.nativeElement.scrollWidth;
1117
+ }
1118
+ }
1119
+ FilterBarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FilterBarComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
1120
+ FilterBarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FilterBarComponent, selector: "tld-filter-bar", inputs: { settings: "settings" }, outputs: { filterBarChange: "filterBarChange" }, host: { listeners: { "window:resize": "onResize()" } }, viewQueries: [{ propertyName: "filterWrapper", first: true, predicate: ["filterWrapper"], descendants: true }], ngImport: i0, template: "<button mat-icon-button (click)=\"scrollLeft()\" *ngIf=\"filterOverflow\">\r\n <span class=\"material-icons-outlined\">\r\n arrow_back_ios\r\n </span>\r\n</button>\r\n<div fxLayout=\"row\" class=\"filter-wrapper\" #filterWrapper>\r\n <mat-form-field fxFlex *ngIf=\"showSearch\" class=\"filter-bar-search-input\">\r\n <span matPrefix class=\"material-icons-outlined\">\r\n {{prefixIcon}}\r\n </span>\r\n <span matSuffix class=\"material-icons-outlined\" *ngIf=\"showSuffixIcon\" [matTooltip]=\"searchTooltip | translate\">\r\n {{suffixIcon}}\r\n </span>\r\n <input class=\"search-input\" matInput [(ngModel)]=\"inputText\" [placeholder]=\"searchTitle | translate\">\r\n </mat-form-field>\r\n <mat-form-field *ngFor=\"let filter of fields\">\r\n <mat-label>{{filter.title | translate}}</mat-label>\r\n <mat-select multiple (selectionChange)=\"filterChange(filter, $event)\">\r\n <mat-option *ngFor=\"let value of filter.values\" [value]=\"value\">\r\n {{value.key | translate : {default: value.value | titlecase } }}\r\n </mat-option>\r\n </mat-select>\r\n </mat-form-field>\r\n</div>\r\n<button mat-icon-button *ngIf=\"filterOverflow\" (click)=\"scrollRight()\">\r\n <span class=\"material-icons-outlined\">\r\n arrow_forward_ios\r\n </span>\r\n</button>\r\n", styles: [":host{display:flex;background-color:var(--base-95);min-height:40px;min-width:100%;border-radius:.5rem;padding:.5rem 1.25rem 1rem;max-width:100%;align-items:baseline}:host ::ng-deep .mat-form-field-wrapper{padding-bottom:0!important}:host ::ng-deep .mat-form-field-underline{bottom:0!important}.search-input{background-color:unset;border:none}mat-form-field+mat-form-field{margin-left:1rem}.filter-bar-search-input{width:100%}.filter-bar-search-input::ng-deep .material-icons-outlined{vertical-align:bottom}.material-icons-outlined{color:var(--base-40)}.filter-wrapper{max-width:100%;overflow-x:hidden;overflow-y:hidden;display:flex;flex:1}\n"], dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2$4.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$4.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2$4.MatPrefix, selector: "[matPrefix]" }, { kind: "directive", type: i2$4.MatSuffix, selector: "[matSuffix]" }, { kind: "directive", type: i3$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "directive", type: i2$2.DefaultLayoutDirective, selector: " [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md], [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md], [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm], [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i2$2.DefaultFlexDirective, selector: " [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md], [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md], [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm], [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { kind: "component", type: i5$1.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { kind: "component", type: i6$1.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "directive", type: i7.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: i7.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i7.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2$1.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "component", type: i5.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "pipe", type: i1$1.TitleCasePipe, name: "titlecase" }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }] });
1121
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FilterBarComponent, decorators: [{
1122
+ type: Component,
1123
+ args: [{ selector: 'tld-filter-bar', template: "<button mat-icon-button (click)=\"scrollLeft()\" *ngIf=\"filterOverflow\">\r\n <span class=\"material-icons-outlined\">\r\n arrow_back_ios\r\n </span>\r\n</button>\r\n<div fxLayout=\"row\" class=\"filter-wrapper\" #filterWrapper>\r\n <mat-form-field fxFlex *ngIf=\"showSearch\" class=\"filter-bar-search-input\">\r\n <span matPrefix class=\"material-icons-outlined\">\r\n {{prefixIcon}}\r\n </span>\r\n <span matSuffix class=\"material-icons-outlined\" *ngIf=\"showSuffixIcon\" [matTooltip]=\"searchTooltip | translate\">\r\n {{suffixIcon}}\r\n </span>\r\n <input class=\"search-input\" matInput [(ngModel)]=\"inputText\" [placeholder]=\"searchTitle | translate\">\r\n </mat-form-field>\r\n <mat-form-field *ngFor=\"let filter of fields\">\r\n <mat-label>{{filter.title | translate}}</mat-label>\r\n <mat-select multiple (selectionChange)=\"filterChange(filter, $event)\">\r\n <mat-option *ngFor=\"let value of filter.values\" [value]=\"value\">\r\n {{value.key | translate : {default: value.value | titlecase } }}\r\n </mat-option>\r\n </mat-select>\r\n </mat-form-field>\r\n</div>\r\n<button mat-icon-button *ngIf=\"filterOverflow\" (click)=\"scrollRight()\">\r\n <span class=\"material-icons-outlined\">\r\n arrow_forward_ios\r\n </span>\r\n</button>\r\n", styles: [":host{display:flex;background-color:var(--base-95);min-height:40px;min-width:100%;border-radius:.5rem;padding:.5rem 1.25rem 1rem;max-width:100%;align-items:baseline}:host ::ng-deep .mat-form-field-wrapper{padding-bottom:0!important}:host ::ng-deep .mat-form-field-underline{bottom:0!important}.search-input{background-color:unset;border:none}mat-form-field+mat-form-field{margin-left:1rem}.filter-bar-search-input{width:100%}.filter-bar-search-input::ng-deep .material-icons-outlined{vertical-align:bottom}.material-icons-outlined{color:var(--base-40)}.filter-wrapper{max-width:100%;overflow-x:hidden;overflow-y:hidden;display:flex;flex:1}\n"] }]
1124
+ }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { filterBarChange: [{
1125
+ type: Output
1126
+ }], settings: [{
1127
+ type: Input
1128
+ }], filterWrapper: [{
1129
+ type: ViewChild,
1130
+ args: ["filterWrapper"]
1131
+ }], onResize: [{
1132
+ type: HostListener,
1133
+ args: ['window:resize', []]
1134
+ }] } });
1135
+
1136
+ class FilterBarModule {
1137
+ }
1138
+ FilterBarModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FilterBarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1139
+ FilterBarModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.3.0", ngImport: i0, type: FilterBarModule, declarations: [FilterBarComponent], imports: [CommonModule,
1140
+ TranslateModule,
1141
+ MatInputModule,
1142
+ MatFormFieldModule,
1143
+ FlexLayoutModule,
1144
+ MatSelectModule,
1145
+ FormsModule,
1146
+ MatTooltipModule,
1147
+ MatButtonModule], exports: [FilterBarComponent] });
1148
+ FilterBarModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FilterBarModule, imports: [CommonModule,
1149
+ TranslateModule,
1150
+ MatInputModule,
1151
+ MatFormFieldModule,
1152
+ FlexLayoutModule,
1153
+ MatSelectModule,
1154
+ FormsModule,
1155
+ MatTooltipModule,
1156
+ MatButtonModule] });
1157
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FilterBarModule, decorators: [{
1158
+ type: NgModule,
1159
+ args: [{
1160
+ declarations: [
1161
+ FilterBarComponent
1162
+ ],
1163
+ imports: [
1164
+ CommonModule,
1165
+ TranslateModule,
1166
+ MatInputModule,
1167
+ MatFormFieldModule,
1168
+ FlexLayoutModule,
1169
+ MatSelectModule,
1170
+ FormsModule,
1171
+ MatTooltipModule,
1172
+ MatButtonModule
1173
+ ],
1174
+ exports: [
1175
+ FilterBarComponent
1176
+ ]
1177
+ }]
1178
+ }] });
1179
+
1180
+ var ExportFormat;
1181
+ (function (ExportFormat) {
1182
+ ExportFormat["CSV"] = "csv";
1183
+ })(ExportFormat || (ExportFormat = {}));
1184
+
1185
+ class MultiFunctionalTableComponent {
1186
+ constructor(domService, translateService) {
1187
+ this.domService = domService;
1188
+ this.translateService = translateService;
1189
+ //#region Output properties
1190
+ this.filterBarChange = new EventEmitter();
1191
+ this.exported = new EventEmitter();
1192
+ }
1193
+ ngOnInit() {
1194
+ this.readFromLocalStorage();
1195
+ this.setColumnProperties();
1196
+ this.setFilterProperties();
1197
+ this.setExportProperties();
1198
+ }
1199
+ ngAfterContentInit() {
1200
+ this.columnDefs.forEach(columnDef => this.table.addColumnDef(columnDef));
1201
+ this.rowDefs.forEach(rowDef => this.table.addRowDef(rowDef));
1202
+ this.headerRowDefs.forEach(headerRowDef => this.table.addHeaderRowDef(headerRowDef));
1203
+ this.headerRowDefs.forEach(headerRowDef => this.table.addHeaderRowDef(headerRowDef));
1204
+ this.table.setNoDataRow(this.noDataRow);
1205
+ }
1206
+ ngAfterViewInit() {
1207
+ this.config.dataSource.sort = this.sort;
1208
+ }
1209
+ updateDisplayColumns(initial = false) {
1210
+ this.displayColumns = [];
1211
+ this.columns = this.config.columnSelect?.columns ?? [];
1212
+ if (!this.columns.length) {
1213
+ return;
1214
+ }
1215
+ const localStorageValue = this.localStorageValue ?? {};
1216
+ if (!localStorageValue.columns) {
1217
+ localStorageValue.columns = {};
1218
+ }
1219
+ this.columns.forEach((column) => {
1220
+ if (initial) {
1221
+ column.selected = localStorageValue.columns?.[column.name] ?? column.selected;
1222
+ }
1223
+ else {
1224
+ // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
1225
+ localStorageValue.columns[column.name] = column.selected;
1226
+ }
1227
+ if (column.selected) {
1228
+ this.displayColumns.push(column.name);
1229
+ }
1230
+ });
1231
+ if (!initial) {
1232
+ this.updateLocalStorage(localStorageValue);
1233
+ }
1234
+ }
1235
+ toggleFilterBar() {
1236
+ const localstorageObject = this.localStorageValue ?? {};
1237
+ if (!localstorageObject.filter) {
1238
+ localstorageObject.filter = {};
1239
+ }
1240
+ this.filterBarVisible = !this.filterBarVisible;
1241
+ localstorageObject.filter.visible = this.filterBarVisible;
1242
+ this.updateLocalStorage(localstorageObject);
1243
+ }
1244
+ filtersChanged(filters) {
1245
+ this.filterBarChange.emit(filters);
1246
+ }
1247
+ export() {
1248
+ this.config.dataSource.connect().pipe(take(1)).subscribe((data) => {
1249
+ this.exported.emit(data);
1250
+ });
1251
+ if (this.config.export?.fileOptions) {
1252
+ this.exportToFile();
1253
+ }
1254
+ }
1255
+ exportToFile() {
1256
+ if (!this.config.export?.fileOptions?.saveToFile) {
1257
+ return;
1258
+ }
1259
+ let fileString = "";
1260
+ let extension;
1261
+ switch (this.config.export.fileOptions.format) {
1262
+ case ExportFormat.CSV:
1263
+ default:
1264
+ extension = ExportFormat.CSV;
1265
+ fileString = HtmlElementParseHelper.tableAsCsv(this.tableElementRef.nativeElement);
1266
+ break;
1267
+ }
1268
+ const translatedFileName = this.translateService.instant(this.config.export.fileOptions.fileName);
1269
+ SaveFileHelper.saveFile(fileString, `${translatedFileName}.${extension}`);
1270
+ }
1271
+ updateLocalStorage(newValue) {
1272
+ this.localStorageValue = newValue;
1273
+ if (this.config.localStorageKey && newValue) {
1274
+ this.domService.localStorage?.setItem(this.config.localStorageKey, JSON.stringify(newValue));
1275
+ }
1276
+ }
1277
+ readFromLocalStorage() {
1278
+ if (this.config.localStorageKey) {
1279
+ try {
1280
+ const localStorageString = this.domService.localStorage?.getItem(this.config.localStorageKey);
1281
+ if (localStorageString) {
1282
+ this.localStorageValue = JSON.parse(localStorageString);
1283
+ }
1284
+ }
1285
+ // eslint-disable-next-line no-empty
1286
+ catch {
1287
+ }
1288
+ }
1289
+ }
1290
+ setFilterProperties() {
1291
+ if (this.config.columnSelect?.enabled) {
1292
+ this.columnSelectActive = true;
1293
+ this.updateDisplayColumns(true);
1294
+ }
1295
+ }
1296
+ setColumnProperties() {
1297
+ if (this.config.filter?.enabled) {
1298
+ this.filterActive = true;
1299
+ this.filterBarVisible = this.localStorageValue?.filter?.visible ?? this.config.filter.visible ?? false;
1300
+ this.filterSettings = this.config.filter.settings;
1301
+ }
1302
+ }
1303
+ setExportProperties() {
1304
+ if (this.config.export?.enabled) {
1305
+ this.exportActive = true;
1306
+ }
1307
+ }
1308
+ }
1309
+ MultiFunctionalTableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: MultiFunctionalTableComponent, deps: [{ token: DOMService }, { token: i1$2.TranslateService }], target: i0.ɵɵFactoryTarget.Component });
1310
+ MultiFunctionalTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: MultiFunctionalTableComponent, selector: "tld-multi-functional-table", inputs: { config: "config" }, outputs: { filterBarChange: "filterBarChange", exported: "exported" }, queries: [{ propertyName: "noDataRow", first: true, predicate: MatNoDataRow, descendants: true }, { propertyName: "headerRowDefs", predicate: MatHeaderRowDef }, { propertyName: "rowDefs", predicate: MatRowDef }, { propertyName: "columnDefs", predicate: MatColumnDef }], viewQueries: [{ propertyName: "table", first: true, predicate: MatTable, descendants: true, static: true }, { propertyName: "sort", first: true, predicate: MatSort, descendants: true }, { propertyName: "tableElementRef", first: true, predicate: MatTable, descendants: true, read: ElementRef }], ngImport: i0, template: "<div fxLayout=\"column\" fxLayoutGap=\"1rem\">\r\n\r\n <div fxLayout=\"row\">\r\n <div fxFlex fxLayoutGap=\"1rem\">\r\n <button mat-button [matMenuTriggerFor]=\"columnMenu\" *ngIf=\"columnSelectActive\">\r\n <span class=\"material-icons column-select-icon\">menu</span>\r\n <span>{{'MULTI_FUNCTIONAL_TABLE.COLUMN_SELECT' | translate}}</span>\r\n </button>\r\n\r\n <button mat-button *ngIf=\"filterActive\" (click)=\"toggleFilterBar()\">\r\n <span class=\"material-icons\">filter_list</span>\r\n <span>{{'MULTI_FUNCTIONAL_TABLE.FILTER_TOGGLE' | translate}}</span>\r\n </button>\r\n\r\n <button mat-stroked-button *ngIf=\"exportActive\" (click)=\"export()\">\r\n <span class=\"material-icons-outlined\">cloud_download</span>\r\n <span>{{'MULTI_FUNCTIONAL_TABLE.EXPORT' | translate}}</span>\r\n </button>\r\n </div>\r\n\r\n <ng-content select=\"[additionalActions]\"></ng-content>\r\n </div>\r\n\r\n <mat-menu #columnMenu=\"matMenu\">\r\n <div class=\"column-select-wrapper\" (click)=\"$event.stopPropagation()\">\r\n <div *ngFor=\"let column of columns\">\r\n <mat-checkbox [(ngModel)]=\"column.selected\" (change)=\"updateDisplayColumns()\">\r\n {{column.displayName | translate}}\r\n </mat-checkbox>\r\n </div>\r\n </div>\r\n </mat-menu>\r\n\r\n <tld-filter-bar *ngIf=\"filterBarVisible\" [settings]=\"filterSettings\" (filterBarChange)=\"filtersChanged($event)\">\r\n </tld-filter-bar>\r\n <table #table mat-table [dataSource]=\"config.dataSource\">\r\n <ng-content></ng-content>\r\n\r\n <tr mat-header-row *matHeaderRowDef=\"displayColumns\"></tr>\r\n <tr mat-row *matRowDef=\"let row; columns: displayColumns\"></tr>\r\n </table>\r\n\r\n</div>\r\n", styles: ["table{width:100%}.column-select-icon{rotate:90deg}.column-select-wrapper{padding:1rem}.material-icons,.material-icons-outlined{margin-right:.5rem}.table-action-button{margin-bottom:1rem}\n"], dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i4.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i4.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "component", type: i4.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i4.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "component", type: i5.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i6$2.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { kind: "directive", type: i6$2.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { kind: "component", type: i7$1.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex"], exportAs: ["matCheckbox"] }, { kind: "directive", type: i7.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i7.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: FilterBarComponent, selector: "tld-filter-bar", inputs: ["settings"], outputs: ["filterBarChange"] }, { kind: "directive", type: i2$2.DefaultLayoutDirective, selector: " [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md], [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md], [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm], [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i2$2.DefaultLayoutGapDirective, selector: " [fxLayoutGap], [fxLayoutGap.xs], [fxLayoutGap.sm], [fxLayoutGap.md], [fxLayoutGap.lg], [fxLayoutGap.xl], [fxLayoutGap.lt-sm], [fxLayoutGap.lt-md], [fxLayoutGap.lt-lg], [fxLayoutGap.lt-xl], [fxLayoutGap.gt-xs], [fxLayoutGap.gt-sm], [fxLayoutGap.gt-md], [fxLayoutGap.gt-lg]", inputs: ["fxLayoutGap", "fxLayoutGap.xs", "fxLayoutGap.sm", "fxLayoutGap.md", "fxLayoutGap.lg", "fxLayoutGap.xl", "fxLayoutGap.lt-sm", "fxLayoutGap.lt-md", "fxLayoutGap.lt-lg", "fxLayoutGap.lt-xl", "fxLayoutGap.gt-xs", "fxLayoutGap.gt-sm", "fxLayoutGap.gt-md", "fxLayoutGap.gt-lg"] }, { kind: "directive", type: i2$2.DefaultFlexDirective, selector: " [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md], [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md], [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm], [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }] });
1311
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: MultiFunctionalTableComponent, decorators: [{
1312
+ type: Component,
1313
+ args: [{ selector: 'tld-multi-functional-table', template: "<div fxLayout=\"column\" fxLayoutGap=\"1rem\">\r\n\r\n <div fxLayout=\"row\">\r\n <div fxFlex fxLayoutGap=\"1rem\">\r\n <button mat-button [matMenuTriggerFor]=\"columnMenu\" *ngIf=\"columnSelectActive\">\r\n <span class=\"material-icons column-select-icon\">menu</span>\r\n <span>{{'MULTI_FUNCTIONAL_TABLE.COLUMN_SELECT' | translate}}</span>\r\n </button>\r\n\r\n <button mat-button *ngIf=\"filterActive\" (click)=\"toggleFilterBar()\">\r\n <span class=\"material-icons\">filter_list</span>\r\n <span>{{'MULTI_FUNCTIONAL_TABLE.FILTER_TOGGLE' | translate}}</span>\r\n </button>\r\n\r\n <button mat-stroked-button *ngIf=\"exportActive\" (click)=\"export()\">\r\n <span class=\"material-icons-outlined\">cloud_download</span>\r\n <span>{{'MULTI_FUNCTIONAL_TABLE.EXPORT' | translate}}</span>\r\n </button>\r\n </div>\r\n\r\n <ng-content select=\"[additionalActions]\"></ng-content>\r\n </div>\r\n\r\n <mat-menu #columnMenu=\"matMenu\">\r\n <div class=\"column-select-wrapper\" (click)=\"$event.stopPropagation()\">\r\n <div *ngFor=\"let column of columns\">\r\n <mat-checkbox [(ngModel)]=\"column.selected\" (change)=\"updateDisplayColumns()\">\r\n {{column.displayName | translate}}\r\n </mat-checkbox>\r\n </div>\r\n </div>\r\n </mat-menu>\r\n\r\n <tld-filter-bar *ngIf=\"filterBarVisible\" [settings]=\"filterSettings\" (filterBarChange)=\"filtersChanged($event)\">\r\n </tld-filter-bar>\r\n <table #table mat-table [dataSource]=\"config.dataSource\">\r\n <ng-content></ng-content>\r\n\r\n <tr mat-header-row *matHeaderRowDef=\"displayColumns\"></tr>\r\n <tr mat-row *matRowDef=\"let row; columns: displayColumns\"></tr>\r\n </table>\r\n\r\n</div>\r\n", styles: ["table{width:100%}.column-select-icon{rotate:90deg}.column-select-wrapper{padding:1rem}.material-icons,.material-icons-outlined{margin-right:.5rem}.table-action-button{margin-bottom:1rem}\n"] }]
1314
+ }], ctorParameters: function () { return [{ type: DOMService }, { type: i1$2.TranslateService }]; }, propDecorators: { config: [{
1315
+ type: Input
1316
+ }], filterBarChange: [{
1317
+ type: Output
1318
+ }], exported: [{
1319
+ type: Output
1320
+ }], headerRowDefs: [{
1321
+ type: ContentChildren,
1322
+ args: [MatHeaderRowDef]
1323
+ }], rowDefs: [{
1324
+ type: ContentChildren,
1325
+ args: [MatRowDef]
1326
+ }], columnDefs: [{
1327
+ type: ContentChildren,
1328
+ args: [MatColumnDef]
1329
+ }], noDataRow: [{
1330
+ type: ContentChild,
1331
+ args: [MatNoDataRow]
1332
+ }], table: [{
1333
+ type: ViewChild,
1334
+ args: [MatTable, { static: true }]
1335
+ }], sort: [{
1336
+ type: ViewChild,
1337
+ args: [MatSort]
1338
+ }], tableElementRef: [{
1339
+ type: ViewChild,
1340
+ args: [MatTable, { read: ElementRef }]
1341
+ }] } });
1342
+
1343
+ class MultiFunctionalTableModule {
1344
+ }
1345
+ MultiFunctionalTableModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: MultiFunctionalTableModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1346
+ MultiFunctionalTableModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.3.0", ngImport: i0, type: MultiFunctionalTableModule, declarations: [MultiFunctionalTableComponent], imports: [CommonModule,
1347
+ MatTableModule,
1348
+ MatButtonModule,
1349
+ TranslateModule,
1350
+ MatMenuModule,
1351
+ MatCheckboxModule,
1352
+ FormsModule,
1353
+ FilterBarModule,
1354
+ FlexLayoutModule,
1355
+ MatSortModule], exports: [MultiFunctionalTableComponent] });
1356
+ MultiFunctionalTableModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: MultiFunctionalTableModule, imports: [CommonModule,
1357
+ MatTableModule,
1358
+ MatButtonModule,
1359
+ TranslateModule,
1360
+ MatMenuModule,
1361
+ MatCheckboxModule,
1362
+ FormsModule,
1363
+ FilterBarModule,
1364
+ FlexLayoutModule,
1365
+ MatSortModule] });
1366
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: MultiFunctionalTableModule, decorators: [{
1367
+ type: NgModule,
1368
+ args: [{
1369
+ declarations: [
1370
+ MultiFunctionalTableComponent
1371
+ ],
1372
+ imports: [
1373
+ CommonModule,
1374
+ MatTableModule,
1375
+ MatButtonModule,
1376
+ TranslateModule,
1377
+ MatMenuModule,
1378
+ MatCheckboxModule,
1379
+ FormsModule,
1380
+ FilterBarModule,
1381
+ FlexLayoutModule,
1382
+ MatSortModule
1383
+ ],
1384
+ exports: [
1385
+ MultiFunctionalTableComponent
1386
+ ]
1387
+ }]
1388
+ }] });
1389
+
1390
+ var Confirmation;
1391
+ (function (Confirmation) {
1392
+ Confirmation[Confirmation["PRIMARY"] = 1] = "PRIMARY";
1393
+ Confirmation[Confirmation["SECONDARY"] = 2] = "SECONDARY";
1394
+ })(Confirmation || (Confirmation = {}));
1395
+
1396
+ class ConfirmationModalComponent {
1397
+ constructor(dialogRef, data) {
1398
+ this.dialogRef = dialogRef;
1399
+ this.data = data;
1400
+ this.confirmation = Confirmation;
1401
+ }
1402
+ }
1403
+ ConfirmationModalComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ConfirmationModalComponent, deps: [{ token: i1$3.MatDialogRef }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component });
1404
+ ConfirmationModalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ConfirmationModalComponent, selector: "lib-confirmation-modal", ngImport: i0, template: "<div class=\"confirmation-dialog\">\r\n <p class=\"text-xl-semi-bold\">{{ data.title | translate }}</p>\r\n <div mat-dialog-content>\r\n <p>{{ data.descriptioon | translate }}</p>\r\n </div>\r\n <div class=\"d-flex justify-content-center\" mat-dialog-actions>\r\n <button\r\n mat-flat-button\r\n color=\"accent\"\r\n [mat-dialog-close]=\"confirmation.PRIMARY\"\r\n >\r\n {{ data.confirmationText | translate }}\r\n </button>\r\n <button\r\n mat-stroked-button\r\n class=\"ml-3\"\r\n [mat-dialog-close]=\"confirmation.SECONDARY\"\r\n >\r\n {{ data.rejectionText | translate }}\r\n </button>\r\n </div>\r\n</div>\r\n", styles: [".confirmation-dialog{min-width:350px}\n"], dependencies: [{ kind: "directive", type: i1$3.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: i1$3.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "directive", type: i1$3.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "component", type: i5.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }] });
1405
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ConfirmationModalComponent, decorators: [{
1406
+ type: Component,
1407
+ args: [{ selector: 'lib-confirmation-modal', template: "<div class=\"confirmation-dialog\">\r\n <p class=\"text-xl-semi-bold\">{{ data.title | translate }}</p>\r\n <div mat-dialog-content>\r\n <p>{{ data.descriptioon | translate }}</p>\r\n </div>\r\n <div class=\"d-flex justify-content-center\" mat-dialog-actions>\r\n <button\r\n mat-flat-button\r\n color=\"accent\"\r\n [mat-dialog-close]=\"confirmation.PRIMARY\"\r\n >\r\n {{ data.confirmationText | translate }}\r\n </button>\r\n <button\r\n mat-stroked-button\r\n class=\"ml-3\"\r\n [mat-dialog-close]=\"confirmation.SECONDARY\"\r\n >\r\n {{ data.rejectionText | translate }}\r\n </button>\r\n </div>\r\n</div>\r\n", styles: [".confirmation-dialog{min-width:350px}\n"] }]
1408
+ }], ctorParameters: function () { return [{ type: i1$3.MatDialogRef }, { type: undefined, decorators: [{
1409
+ type: Inject,
1410
+ args: [MAT_DIALOG_DATA]
1411
+ }] }]; } });
1412
+
1413
+ class ConfirmationModalModule {
1414
+ }
1415
+ ConfirmationModalModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ConfirmationModalModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1416
+ ConfirmationModalModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.3.0", ngImport: i0, type: ConfirmationModalModule, declarations: [ConfirmationModalComponent], imports: [CommonModule, MatDialogModule, MatButtonModule, TranslateModule], exports: [ConfirmationModalComponent] });
1417
+ ConfirmationModalModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ConfirmationModalModule, imports: [CommonModule, MatDialogModule, MatButtonModule, TranslateModule] });
1418
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ConfirmationModalModule, decorators: [{
1419
+ type: NgModule,
1420
+ args: [{
1421
+ declarations: [ConfirmationModalComponent],
1422
+ imports: [CommonModule, MatDialogModule, MatButtonModule, TranslateModule],
1423
+ exports: [ConfirmationModalComponent],
1424
+ }]
1425
+ }] });
1426
+
666
1427
  /*
667
1428
  * Public API Surface of ngx-common
668
1429
  */
@@ -671,5 +1432,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
671
1432
  * Generated bundle index. Do not edit.
672
1433
  */
673
1434
 
674
- export { ClickOutsideDirective, ClickOutsideModule, CloseButtonComponent, CloseButtonModule, CompanyProductComponent, CompanyProductModule, DOMService, FilterWithHighlightModule, FilterWithHighlightPipe, FooterComponent, FooterModule, IconService, InlineMessageComponent, InlineMessageIconPosition, InlineMessageModule, InlineMessageType, MissingTranslationHelper, NotificationMessageComponent, NotificationMessageModule, NotificationMessageType, PlausibleEventDirective, PlausibleHelper, PlausibleModule, SortTranslationsModule, SortTranslationsPipe, TldLoaderComponent, TldLoaderModule };
1435
+ export { ClickOutsideDirective, ClickOutsideModule, CloseButtonComponent, CloseButtonModule, CompanyProductComponent, CompanyProductModule, Confirmation, ConfirmationModalComponent, ConfirmationModalModule, DOMService, DateAgoModule, DateAgoPipe, DragAndDropDirective, DragAndDropModule, ExportFormat, FileUploadComponent, FileUploadErrorTypeEnum, FileUploadModule, FilterBarComponent, FilterBarModule, FilterWithHighlightModule, FilterWithHighlightPipe, FooterComponent, FooterModule, HtmlElementParseHelper, IconService, InlineMessageComponent, InlineMessageIconPosition, InlineMessageModule, InlineMessageType, MissingTranslationHelper, MultiFunctionalTableComponent, MultiFunctionalTableModule, NotificationMessageComponent, NotificationMessageModule, NotificationMessageType, PlausibleEventDirective, PlausibleHelper, PlausibleModule, SaveFileHelper, SortTranslationsModule, SortTranslationsPipe, TldLoaderComponent, TldLoaderModule };
675
1436
  //# sourceMappingURL=tilde-nlp-ngx-common.mjs.map