@klippa/ngx-enhancy-forms 14.20.5 → 14.22.0

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 (12) hide show
  1. package/esm2020/lib/form/form-element/form-element.component.mjs +6 -3
  2. package/esm2020/lib/form/form.component.mjs +29 -2
  3. package/esm2020/lib/types.mjs +1 -1
  4. package/esm2020/lib/withTooltip.component.mjs +42 -6
  5. package/fesm2015/klippa-ngx-enhancy-forms.mjs +80 -11
  6. package/fesm2015/klippa-ngx-enhancy-forms.mjs.map +1 -1
  7. package/fesm2020/klippa-ngx-enhancy-forms.mjs +74 -8
  8. package/fesm2020/klippa-ngx-enhancy-forms.mjs.map +1 -1
  9. package/lib/form/form.component.d.ts +3 -1
  10. package/lib/types.d.ts +1 -0
  11. package/lib/withTooltip.component.d.ts +7 -3
  12. package/package.json +1 -1
package/esm2020/lib/withTooltip.component.mjs CHANGED
@@ -9,13 +9,17 @@ const colors = {
9
9
  };
10
10
  export class WithTooltipDirective {
11
11
  constructor(el) {
12
+ this.el = el;
12
13
  this.klpWithTooltip = 'orange';
13
14
  el.nativeElement.addEventListener('mouseenter', () => {
14
- const textToDisplay = this.tooltipText || el.nativeElement.innerText.trim();
15
+ let textToDisplay;
16
+ if (!this.templateInstance) {
17
+ textToDisplay = this.tooltipText || el.nativeElement.innerText.trim();
18
+ }
15
19
  if (!stringIsSetAndFilled(this.klpWithTooltip)) {
16
20
  return;
17
21
  }
18
- if (textToDisplay.length < 1) {
22
+ if (!stringIsSetAndFilled(textToDisplay) && !this.tooltipTemplate) {
19
23
  return;
20
24
  }
21
25
  if (stringIsSetAndFilled(this.tooltipText)) {
@@ -23,6 +27,9 @@ export class WithTooltipDirective {
23
27
  return;
24
28
  }
25
29
  }
30
+ else if (this.tooltipTemplate) {
31
+ // no need to check here, just render the template
32
+ }
26
33
  else {
27
34
  if (el.nativeElement.offsetWidth >= el.nativeElement.scrollWidth) {
28
35
  return;
@@ -46,7 +53,18 @@ export class WithTooltipDirective {
46
53
  this.div.style.padding = '0.3rem 0.5rem';
47
54
  this.div.style.boxSizing = 'border-box';
48
55
  this.div.style.borderRadius = '3px';
49
- this.div.textContent = textToDisplay;
56
+ if (stringIsSetAndFilled(textToDisplay)) {
57
+ this.div.textContent = textToDisplay;
58
+ }
59
+ else if (this.templateInstance) {
60
+ this.div.style.visibility = 'hidden';
61
+ this.div.appendChild(this.templateInstance);
62
+ setTimeout(() => {
63
+ const color = getComputedStyle(this.templateInstance).backgroundColor || getComputedStyle(this.templateInstance).background;
64
+ this.div.style.backgroundColor = color;
65
+ this.div.style.visibility = 'visible';
66
+ });
67
+ }
50
68
  el.nativeElement.prepend(this.div);
51
69
  this.triangle = document.createElement('div');
52
70
  this.triangle.style.zIndex = `${zIndexStart + 1}`;
@@ -70,7 +88,17 @@ export class WithTooltipDirective {
70
88
  this.triangleWhite.style.height = '0';
71
89
  this.triangleWhite.style.borderLeft = `${triangleSize} solid transparent`;
72
90
  this.triangleWhite.style.borderRight = `${triangleSize} solid transparent`;
73
- this.triangleWhite.style.borderTop = `${triangleSize} solid white`;
91
+ if (stringIsSetAndFilled(textToDisplay)) {
92
+ this.triangleWhite.style.borderTop = `${triangleSize} solid white`;
93
+ }
94
+ else if (this.templateInstance) {
95
+ this.div.style.visibility = 'hidden';
96
+ setTimeout(() => {
97
+ const color = getComputedStyle(this.templateInstance).backgroundColor || getComputedStyle(this.templateInstance).background;
98
+ this.triangleWhite.style.borderTop = `${triangleSize} solid ${color}`;
99
+ this.div.style.visibility = 'visible';
100
+ });
101
+ }
74
102
  el.nativeElement.prepend(this.triangleWhite);
75
103
  });
76
104
  el.nativeElement.addEventListener('mouseleave', () => {
@@ -88,9 +116,15 @@ export class WithTooltipDirective {
88
116
  catch (ex) { }
89
117
  });
90
118
  }
119
+ ngOnChanges(simpleChanges) {
120
+ if (simpleChanges.tooltipTemplate?.currentValue) {
121
+ const viewRef = this.tooltipTemplate.createEmbeddedView(null);
122
+ this.templateInstance = viewRef.rootNodes[0];
123
+ }
124
+ }
91
125
  }
92
126
  WithTooltipDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.8", ngImport: i0, type: WithTooltipDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
93
- WithTooltipDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.2.8", type: WithTooltipDirective, selector: "[klpWithTooltip]", inputs: { klpWithTooltip: "klpWithTooltip", tooltipText: "tooltipText" }, ngImport: i0 });
127
+ WithTooltipDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.2.8", type: WithTooltipDirective, selector: "[klpWithTooltip]", inputs: { klpWithTooltip: "klpWithTooltip", tooltipText: "tooltipText", tooltipTemplate: "tooltipTemplate" }, usesOnChanges: true, ngImport: i0 });
94
128
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.8", ngImport: i0, type: WithTooltipDirective, decorators: [{
95
129
  type: Directive,
96
130
  args: [{
@@ -100,5 +134,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.8", ngImpor
100
134
  type: Input
101
135
  }], tooltipText: [{
102
136
  type: Input
137
+ }], tooltipTemplate: [{
138
+ type: Input
103
139
  }] } });
104
- //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoid2l0aFRvb2x0aXAuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMva2xpcHBhL25neC1lbmhhbmN5LWZvcm1zL3NyYy9saWIvd2l0aFRvb2x0aXAuY29tcG9uZW50LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBQyxTQUFTLEVBQWMsS0FBSyxFQUFDLE1BQU0sZUFBZSxDQUFDO0FBQzNELE9BQU8sRUFBQyxvQkFBb0IsRUFBQyxNQUFNLGVBQWUsQ0FBQzs7QUFFbkQsTUFBTSxZQUFZLEdBQUcsTUFBTSxDQUFDO0FBQzVCLE1BQU0sV0FBVyxHQUFHLFFBQVEsQ0FBQztBQUU3QixNQUFNLE1BQU0sR0FBRztJQUNkLE1BQU0sRUFBRSxFQUFFLE9BQU8sRUFBRSxrQkFBa0IsRUFBRSxTQUFTLEVBQUUsaUNBQWlDLEVBQUM7SUFDcEYsS0FBSyxFQUFFLEVBQUUsT0FBTyxFQUFFLGlCQUFpQixFQUFFLFNBQVMsRUFBRSxnQ0FBZ0MsRUFBQztDQUNqRixDQUFDO0FBS0YsTUFBTSxPQUFPLG9CQUFvQjtJQU1oQyxZQUFZLEVBQWM7UUFGakIsbUJBQWMsR0FBc0IsUUFBUSxDQUFDO1FBR3JELEVBQUUsQ0FBQyxhQUFhLENBQUMsZ0JBQWdCLENBQUMsWUFBWSxFQUFFLEdBQUcsRUFBRTtZQUNwRCxNQUFNLGFBQWEsR0FBRyxJQUFJLENBQUMsV0FBVyxJQUFJLEVBQUUsQ0FBQyxhQUFhLENBQUMsU0FBUyxDQUFDLElBQUksRUFBRSxDQUFDO1lBQzVFLElBQUksQ0FBQyxvQkFBb0IsQ0FBQyxJQUFJLENBQUMsY0FBYyxDQUFDLEVBQUU7Z0JBQy9DLE9BQU87YUFDUDtZQUNELElBQUksYUFBYSxDQUFDLE1BQU0sR0FBRyxDQUFDLEVBQUU7Z0JBQzdCLE9BQU87YUFDUDtZQUNELElBQUksb0JBQW9CLENBQUMsSUFBSSxDQUFDLFdBQVcsQ0FBQyxFQUFFO2dCQUMzQyxJQUFJLElBQUks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LENBQUM7YUFDNUM7WUFBQyxPQUFPLEVBQUUsRUFBRSxHQUFFO1lBQ2YsSUFBSTtnQkFDSCxFQUFFLENBQUMsYUFBYSxDQUFDLFdBQVcsQ0FBQyxJQUFJLENBQUMsYUFBYSxDQUFDLENBQUM7YUFDakQ7WUFBQyxPQUFPLEVBQUUsRUFBRSxHQUFFO1FBQ2hCLENBQUMsQ0FBQyxDQUFDO0lBQ0osQ0FBQzs7aUhBcEZXLG9CQUFvQjtxR0FBcEIsb0JBQW9COzJGQUFwQixvQkFBb0I7a0JBSGhDLFNBQVM7bUJBQUM7b0JBQ1YsUUFBUSxFQUFFLGtCQUFrQjtpQkFDNUI7aUdBS1MsY0FBYztzQkFBdEIsS0FBSztnQkFDRyxXQUFXO3NCQUFuQixLQUFLIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtEaXJlY3RpdmUsIEVsZW1lbnRSZWYsIElucHV0fSBmcm9tIFwiQGFuZ3VsYXIvY29yZVwiO1xuaW1wb3J0IHtzdHJpbmdJc1NldEFuZEZpbGxlZH0gZnJvbSBcIi4vdXRpbC92YWx1ZXNcIjtcblxuY29uc3QgdHJpYW5nbGVTaXplID0gJzEycHgnO1xuY29uc3QgekluZGV4U3RhcnQgPSA5OTk5OTk5OTtcblxuY29uc3QgY29sb3JzID0ge1xuXHRvcmFuZ2U6IHsgbm9BbHBoYTogJ3JnYigyNTUsIDEyOCwgMCknLCB3aXRoQWxwaGE6ICdyZ2JhKDI1NSwgMTI4LCAwLCAwLjEyNTQ5MDE5NjEpJ30sXG5cdGJsYWNrOiB7IG5vQWxwaGE6ICdyZ2IoNDAsIDQwLCA0MCknLCB3aXRoQWxwaGE6ICdyZ2JhKDQwLCA0MCwgNDAsIDAuMTI1NDkwMTk2MSknfSxcbn07XG5cbkBEaXJlY3RpdmUoe1xuXHRzZWxlY3RvcjogJ1trbHBXaXRoVG9vbHRpcF0nXG59KVxuZXhwb3J0IGNsYXNzIFdpdGhUb29sdGlwRGlyZWN0aXZlIHtcblx0cHJpdmF0ZSBkaXY6IEhUTUxFbGVtZW50O1xuXHRwcml2YXRlIHRyaWFuZ2xlOiBIVE1MRWxlbWVudDtcblx0cHJpdmF0ZSB0cmlhbmdsZVdoaXRlOiBIVE1MRWxlbWVudDtcblx0QElucHV0KCkga2xwV2l0aFRvb2x0aXA6ICdvcmFuZ2UnfCAnYmxhY2snID0gJ29yYW5nZSc7XG5cdEBJbnB1dCgpIHRvb2x0aXBUZXh0OiBzdHJpbmc7XG5cdGNvbnN0cnVjdG9yKGVsOiBFbGVtZW50UmVmKSB7XG5cdFx0ZWwubmF0aXZlRWxlbWVudC5hZGRFdmVudExpc3RlbmVyKCdtb3VzZWVudGVyJywgKCkgPT4ge1xuXHRcdFx0Y29uc3QgdGV4dFRvRGlzcGxheSA9IHRoaXMudG9vbHRpcFRleHQgfHwgZWwubmF0aXZlRWxlbWVudC5pbm5lclRleHQudHJpbSgpO1xuXHRcdFx0aWYgKCFzdHJpbmdJc1NldEFuZEZpbGxlZCh0aGlzLmtscFdpdGhUb29sdGlwKSkge1xuXHRcdFx0XHRyZXR1cm47XG5cdFx0XHR9XG5cdFx0XHRpZiAodGV4dFRvRGlzcGxheS5sZW5ndGggPCAxKSB7XG5cdFx0XHRcdHJldHVybjtcblx0XHRcdH1cblx0XHRcdGlmIChzdHJpbmdJc1NldEFuZEZpbGxlZCh0aGlzLnRvb2x0aXBUZXh0KSkge1xuXHRcdFx0XHRpZiAodGhpcy50b29sdGlwVGV4dCA9PT0gZWwubmF0aXZlRWxlbWVudC5pbm5lclRleHQpIHtcblx0XHRcdFx0XHRyZXR1cm47XG5cdFx0XHRcdH1cblx0XHRcdH0gZWxzZSB7XG5cdFx0XHRcdGlmIChlbC5uYXRpdmVFbGVtZW50Lm9mZnNldFdpZHRoID49IGVsLm5hdGl2ZUVsZW1lbnQuc2Nyb2xsV2lkdGgpIHtcblx0XHRcdFx0XHRyZXR1cm47XG5cdFx0XHRcdH1cblx0XHRcdH1cblx0XHRcdGlmIChnZXRDb21wdXRlZFN0eWxlKGVsLm5hdGl2ZUVsZW1lbnQpLnBvc2l0aW9uID09PSAnc3RhdGljJykge1xuXHRcdFx0XHRlbC5uYXRpdmVFbGVtZW50LnN0eWxlLnBvc2l0aW9uID0gJ3JlbGF0aXZlJztcblx0XHRcdH1cblxuXHRcdFx0dGhpcy5kaXYgPSBkb2N1bWVudC5jcmVhdGVFbGVtZW50KCdkaXYnKTtcblx0XHRcdHRoaXMuZGl2LnN0eWxlLnpJbmRleCA9IGAke3pJbmRleFN0YXJ0ICsgMn1gO1xuXHRcdFx0dGhpcy5kaXYuc3R5bGUuY29sb3IgPSBgJHtjb2xvcnNbdGhpcy5rbHBXaXRoVG9vbHRpcF0ubm9BbHBoYX1gO1xuXHRcdFx0dGhpcy5kaXYuc3R5bGUucG9zaXRpb24gPSAnZml4ZWQnO1xuXHRcdFx0dGhpcy5kaXYuc3R5bGUubGVmdCA9IGAke2VsLm5hdGl2ZUVsZW1lbnQuZ2V0Qm91bmRpbmdDbGllbnRSZWN0KCkueH1weGA7XG5cdFx0XHR0aGlzLmRpdi5zdHlsZS50b3AgPSBgJHtlbC5uYXRpdmVFbGVtZW50LmdldEJvdW5kaW5nQ2xpZW50UmVjdCgpLnl9cHhgO1xuXHRcdFx0dGhpcy5kaXYuc3R5bGUudHJhbnNmb3JtID0gYHRyYW5zbGF0ZShjYWxjKC0xMDAlICsgJHtlbC5uYXRpdmVFbGVtZW50LmdldEJvdW5kaW5nQ2xpZW50UmVjdCgpLndpZHRofXB4KSwgY2FsYygtMTAwJSAtIDAuM3JlbSkpYDtcblx0XHRcdHRoaXMuZGl2LnN0eWxlLm1heFdpZHRoID0gJzIwMHB4Jztcblx0XHRcdHRoaXMuZGl2LnN0eWxlLndoaXRlU3BhY2UgPSAnYnJlYWstc3BhY2VzJztcblx0XHRcdHRoaXMuZGl2LnN0eWxlLmJhY2tncm91bmRDb2xvciA9ICd3aGl0ZSc7XG5cdFx0XHR0aGlzLmRpdi5zdHlsZS5ib3JkZXIgPSBgMXB4IHNvbGlkICR7Y29sb3JzW3RoaXMua2xwV2l0aFRvb2x0aXBdLndpdGhBbHBoYX1gO1xuXHRcdFx0dGhpcy5kaXYuc3R5bGUuYm94U2hhZG93ID0gYDJweCAzcHggMTBweCAwcHggJHtjb2xvcnNbdGhpcy5rbHBXaXRoVG9vbHRpcF0ud2l0aEFscGhhfWA7XG5cdFx0XHR0aGlzLmRpdi5zdHlsZS5wYWRkaW5nID0gJzAuM3JlbSAwLjVyZW0nO1xuXHRcdFx0dGhpcy5kaXYuc3R5bGUuYm94U2l6aW5nID0gJ2JvcmRlci1ib3gnO1xuXHRcdFx0dGhpcy5kaXYuc3R5bGUuYm9yZGVyUmFkaXVzID0gJzNweCc7XG5cdFx0XHR0aGlzLmRpdi50ZXh0Q29udGVudCA9IHRleHRUb0Rpc3BsYXk7XG5cdFx0XHRlbC5uYXRpdmVFbGVtZW50LnByZXBlbmQodGhpcy5kaXYpO1xuXG5cdFx0XHR0aGlzLnRyaWFuZ2xlID0gZG9jdW1lbnQuY3JlYXRlRWxlbWVudCgnZGl2Jyk7XG5cdFx0XHR0aGlzLnRyaWFuZ2xlLnN0eWxlLnpJbmRleCA9IGAke3pJbmRleFN0YXJ0ICsgMX1gO1xuXHRcdFx0dGhpcy50cmlhbmdsZS5zdHlsZS5wb3NpdGlvbiA9ICdmaXhlZCc7XG5cdFx0XHR0aGlzLnRyaWFuZ2xlLnN0eWxlLmxlZnQgPSBgY2FsYygke2VsLm5hdGl2ZUVsZW1lbnQuZ2V0Qm91bmRpbmdDbGllbnRSZWN0KCkueCArIGVsLm5hdGl2ZUVsZW1lbnQuZ2V0Qm91bmRpbmdDbGllbnRSZWN0KCkud2lkdGh9cHggLSAycmVtKWA7XG5cdFx0XHR0aGlzLnRyaWFuZ2xlLnN0eWxlLnRvcCA9IGAke2VsLm5hdGl2ZUVsZW1lbnQuZ2V0Qm91bmRpbmdDbGllbnRSZWN0KCkueX1weGA7XG5cdFx0XHR0aGlzLnRyaWFuZ2xlLnN0eWxlLnRyYW5zZm9ybSA9IGB0cmFuc2xhdGUoLTUwJSwgY2FsYygtMTAwJSArIDAuMXJlbSkpYDtcblx0XHRcdHRoaXMudHJpYW5nbGUuc3R5bGUud2lkdGggPSAnMCc7XG5cdFx0XHR0aGlzLnRyaWFuZ2xlLnN0eWxlLmhlaWdodCA9ICcwJztcblx0XHRcdHRoaXMudHJpYW5nbGUuc3R5bGUuYm9yZGVyTGVmdCA9IGAke3RyaWFuZ2xlU2l6ZX0gc29saWQgdHJhbnNwYXJlbnRgO1xuXHRcdFx0dGhpcy50cmlhbmdsZS5zdHlsZS5ib3JkZXJSaWdodCA9IGAke3RyaWFuZ2xlU2l6ZX0gc29saWQgdHJhbnNwYXJlbnRgO1xuXHRcdFx0dGhpcy50cmlhbmdsZS5zdHlsZS5ib3JkZXJUb3AgPSBgJHt0cmlhbmdsZVNpemV9IHNvbGlkICR7Y29sb3JzW3RoaXMua2xwV2l0aFRvb2x0aXBdLndpdGhBbHBoYX1gO1xuXHRcdFx0ZWwubmF0aXZlRWxlbWVudC5wcmVwZW5kKHRoaXMudHJpYW5nbGUpO1xuXG5cdFx0XHR0aGlzLnRyaWFuZ2xlV2hpdGUgPSBkb2N1bWVudC5jcmVhdGVFbGVtZW50KCdkaXYnKTtcblx0XHRcdHRoaXMudHJpYW5nbGVXaGl0ZS5zdHlsZS56SW5kZXggPSBgJHt6SW5kZXhTdGFydCArIDN9YDtcblx0XHRcdHRoaXMudHJpYW5nbGVXaGl0ZS5zdHlsZS5wb3NpdGlvbiA9ICdmaXhlZCc7XG5cdFx0XHR0aGlzLnRyaWFuZ2xlV2hpdGUuc3R5bGUubGVmdCA9IGBjYWxjKCR7ZWwubmF0aXZlRWxlbWVudC5nZXRCb3VuZGluZ0NsaWVudFJlY3QoKS54ICsgZWwubmF0aXZlRWxlbWVudC5nZXRCb3VuZGluZ0NsaWVudFJlY3QoKS53aWR0aH1weCAtIDJyZW0pYDtcblx0XHRcdHRoaXMudHJpYW5nbGVXaGl0ZS5zdHlsZS50b3AgPSBgJHtlbC5uYXRpdmVFbGVtZW50LmdldEJvdW5kaW5nQ2xpZW50UmVjdCgpLnl9cHhgO1xuXHRcdFx0dGhpcy50cmlhbmdsZVdoaXRlLnN0eWxlLnRyYW5zZm9ybSA9IGB0cmFuc2xhdGUoLTUwJSwgY2FsYygtMTAwJSArIDAuMXJlbSAtIDJweCkpYDtcblx0XHRcdHRoaXMudHJpYW5nbGVXaGl0ZS5zdHlsZS53aWR0aCA9ICcwJztcblx0XHRcdHRoaXMudHJpYW5nbGVXaGl0ZS5zdHlsZS5oZWlnaHQgPSAnMCc7XG5cdFx0XHR0aGlzLnRyaWFuZ2xlV2hpdGUuc3R5bGUuYm9yZGVyTGVmdCA9IGAke3RyaWFuZ2xlU2l6ZX0gc29saWQgdHJhbnNwYXJlbnRgO1xuXHRcdFx0dGhpcy50cmlhbmdsZVdoaXRlLnN0eWxlLmJvcmRlclJpZ2h0ID0gYCR7dHJpYW5nbGVTaXplfSBzb2xpZCB0cmFuc3BhcmVudGA7XG5cdFx0XHR0aGlzLnRyaWFuZ2xlV2hpdGUuc3R5bGUuYm9yZGVyVG9wID0gYCR7dHJpYW5nbGVTaXplfSBzb2xpZCB3aGl0ZWA7XG5cdFx0XHRlbC5uYXRpdmVFbGVtZW50LnByZXBlbmQodGhpcy50cmlhbmdsZVdoaXRlKTtcblx0XHR9KTtcblxuXHRcdGVsLm5hdGl2ZUVsZW1lbnQuYWRkRXZlbnRMaXN0ZW5lcignbW91c2VsZWF2ZScsICgpID0+IHtcblx0XHRcdHRyeSB7XG5cdFx0XHRcdGVsLm5hdGl2ZUVsZW1lbnQucmVtb3ZlQ2hpbGQodGhpcy5kaXYpO1xuXHRcdFx0fSBjYXRjaCAoZXgpIHt9XG5cdFx0XHR0cnkge1xuXHRcdFx0XHRlbC5uYXRpdmVFbGVtZW50LnJlbW92ZUNoaWxkKHRoaXMudHJpYW5nbGUpO1xuXHRcdFx0fSBjYXRjaCAoZXgpIHt9XG5cdFx0XHR0cnkge1xuXHRcdFx0XHRlbC5uYXRpdmVFbGVtZW50LnJlbW92ZUNoaWxkKHRoaXMudHJpYW5nbGVXaGl0ZSk7XG5cdFx0XHR9IGNhdGNoIChleCkge31cblx0XHR9KTtcblx0fVxufVxuIl19
140
+ //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoid2l0aFRvb2x0aXAuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMva2xpcHBhL25neC1lbmhhbmN5LWZvcm1zL3NyYy9saWIvd2l0aFRvb2x0aXAuY29tcG9uZW50LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBQyxTQUFTLEVBQWMsS0FBSyxFQUF3QyxNQUFNLGVBQWUsQ0FBQztBQUNsRyxPQUFPLEVBQUMsb0JBQW9CLEVBQUMsTUFBTSxlQUFlLENBQUM7O0FBRW5ELE1BQU0sWUFBWSxHQUFHLE1BQU0sQ0FBQztBQUM1QixNQUFNLFdBQVcsR0FBRyxRQUFRLENBQUM7QUFFN0IsTUFBTSxNQUFNLEdBQUc7SUFDZCxNQUFNLEVBQUUsRUFBRSxPQUFPLEVBQUUsa0JBQWtCLEVBQUUsU0FBUyxFQUFFLGlDQUFpQyxFQUFDO0lBQ3BGLEtBQUssRUFBRSxFQUFFLE9BQU8sRUFBRSxpQkFBaUIsRUFBRSxTQUFTLEVBQUUsZ0NBQWdDLEVBQUM7Q0FDakYsQ0FBQztBQUtGLE1BQU0sT0FBTyxvQkFBb0I7SUFRaEMsWUFBb0IsRUFBYztRQUFkLE9BQUUsR0FBRixFQUFFLENBQVk7UUFKekIsbUJBQWMsR0FBc0IsUUFBUSxDQUFDO1FBS3JELEVBQUUsQ0FBQyxhQUFhLENBQUMsZ0JBQWdCLENBQUMsWUFBWSxFQUFFLEdBQUcsRUFBRTtZQUNwRCxJQUFJLGFBQXFCLENBQUM7WUFDMUIsSUFBSSxDQUFDLElBQUksQ0FBQyxnQkFBZ0IsRUFBRTtnQkFDM0IsYUFBYSxHQUFHLElBQUksQ0FBQyxXQUFXLElBQUksRUFBRSxDQUFDLGFBQWEsQ0FBQyxTQUFTLENBQUMsSUFBSSxFQUFFLENBQUM7YUFDdEU7WUFDRCxJQUFJLENBQUMsb0JBQW9CLENBQUMsSUFBSSxDQUFDLGNBQWMsQ0FBQyxFQUFFO2dCQUMvQyxPQUFPO2FBQ1A7WUFDRCxJQUFJLENBQUMsb0JBQW9CLENBQUMsYUFBYSxD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QUFDLFlBQVksRUFBRSxHQUFHLEVBQUU7WUFDcEQsSUFBSTtnQkFDSCxFQUFFLENBQUMsYUFBYSxDQUFDLFdBQVcsQ0FBQyxJQUFJLENBQUMsR0FBRyxDQUFDLENBQUM7YUFDdkM7WUFBQyxPQUFPLEVBQUUsRUFBRSxHQUFFO1lBQ2YsSUFBSTtnQkFDSCxFQUFFLENBQUMsYUFBYSxDQUFDLFdBQVcsQ0FBQyxJQUFJLENBQUMsUUFBUSxDQUFDLENBQUM7YUFDNUM7WUFBQyxPQUFPLEVBQUUsRUFBRSxHQUFFO1lBQ2YsSUFBSTtnQkFDSCxFQUFFLENBQUMsYUFBYSxDQUFDLFdBQVcsQ0FBQyxJQUFJLENBQUMsYUFBYSxDQUFDLENBQUM7YUFDakQ7WUFBQyxPQUFPLEVBQUUsRUFBRSxHQUFFO1FBQ2hCLENBQUMsQ0FBQyxDQUFDO0lBQ0osQ0FBQztJQUVNLFdBQVcsQ0FBQyxhQUE0QjtRQUM5QyxJQUFJLGFBQWEsQ0FBQyxlQUFlLEVBQUUsWUFBWSxFQUFFO1lBQ2hELE1BQU0sT0FBTyxHQUFHLElBQUksQ0FBQyxlQUFlLENBQUMsa0JBQWtCLENBQUMsSUFBSSxDQUFDLENBQUM7WUFDOUQsSUFBSSxDQUFDLGdCQUFnQixHQUFHLE9BQU8sQ0FBQyxTQUFTLENBQUMsQ0FBQyxDQUFDLENBQUM7U0FDN0M7SUFDRixDQUFDOztpSEF2SFcsb0JBQW9CO3FHQUFwQixvQkFBb0I7MkZBQXBCLG9CQUFvQjtrQkFIaEMsU0FBUzttQkFBQztvQkFDVixRQUFRLEVBQUUsa0JBQWtCO2lCQUM1QjtpR0FLUyxjQUFjO3NCQUF0QixLQUFLO2dCQUNHLFdBQVc7c0JBQW5CLEtBQUs7Z0JBQ0csZUFBZTtzQkFBdkIsS0FBSyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7RGlyZWN0aXZlLCBFbGVtZW50UmVmLCBJbnB1dCwgT25DaGFuZ2VzLCBTaW1wbGVDaGFuZ2VzLCBUZW1wbGF0ZVJlZn0gZnJvbSBcIkBhbmd1bGFyL2NvcmVcIjtcbmltcG9ydCB7c3RyaW5nSXNTZXRBbmRGaWxsZWR9IGZyb20gXCIuL3V0aWwvdmFsdWVzXCI7XG5cbmNvbnN0IHRyaWFuZ2xlU2l6ZSA9ICcxMnB4JztcbmNvbnN0IHpJbmRleFN0YXJ0ID0gOTk5OTk5OTk7XG5cbmNvbnN0IGNvbG9ycyA9IHtcblx0b3JhbmdlOiB7IG5vQWxwaGE6ICdyZ2IoMjU1LCAxMjgsIDApJywgd2l0aEFscGhhOiAncmdiYSgyNTUsIDEyOCwgMCwgMC4xMjU0OTAxOTYxKSd9LFxuXHRibGFjazogeyBub0FscGhhOiAncmdiKDQwLCA0MCwgNDApJywgd2l0aEFscGhhOiAncmdiYSg0MCwgNDAsIDQwLCAwLjEyNTQ5MDE5NjEpJ30sXG59O1xuXG5ARGlyZWN0aXZlKHtcblx0c2VsZWN0b3I6ICdba2xwV2l0aFRvb2x0aXBdJ1xufSlcbmV4cG9ydCBjbGFzcyBXaXRoVG9vbHRpcERpcmVjdGl2ZSBpbXBsZW1lbnRzIE9uQ2hhbmdlc3tcblx0cHJpdmF0ZSBkaXY6IEhUTUxFbGVtZW50O1xuXHRwcml2YXRlIHRyaWFuZ2xlOiBIVE1MRWxlbWVudDtcblx0cHJpdmF0ZSB0cmlhbmdsZVdoaXRlOiBIVE1MRWxlbWVudDtcblx0QElucHV0KCkga2xwV2l0aFRvb2x0aXA6ICdvcmFuZ2UnfCAnYmxhY2snID0gJ29yYW5nZSc7XG5cdEBJbnB1dCgpIHRvb2x0aXBUZXh0OiBzdHJpbmc7XG5cdEBJbnB1dCgpIHRvb2x0aXBUZW1wbGF0ZTogVGVtcGxhdGVSZWY8YW55Pjtcblx0cHJpdmF0ZSB0ZW1wbGF0ZUluc3RhbmNlOiBIVE1MRWxlbWVudDtcblx0Y29uc3RydWN0b3IocHJpdmF0ZSBlbDogRWxlbWVudFJlZikge1xuXHRcdGVsLm5hdGl2ZUVsZW1lbnQuYWRkRXZlbnRMaXN0ZW5lcignbW91c2VlbnRlcicsICgpID0+IHtcblx0XHRcdGxldCB0ZXh0VG9EaXNwbGF5OiBzdHJpbmc7XG5cdFx0XHRpZiAoIXRoaXMudGVtcGxhdGVJbnN0YW5jZSkge1xuXHRcdFx0XHR0ZXh0VG9EaXNwbGF5ID0gdGhpcy50b29sdGlwVGV4dCB8fCBlbC5uYXRpdmVFbGVtZW50LmlubmVyVGV4dC50cmltKCk7XG5cdFx0XHR9XG5cdFx0XHRpZiAoIXN0cmluZ0lzU2V0QW5kRmlsbGVkKHRoaXMua2xwV2l0aFRvb2x0aXApKSB7XG5cdFx0XHRcdHJldHVybjtcblx0XHRcdH1cblx0XHRcdGlmICghc3RyaW5nSXNTZXRBbmRGaWxsZWQodGV4dFRvRGlzcGxheSkgJiYgIXRoaXMudG9vbHRpcFRlbXBsYXRlKSB7XG5cdFx0XHRcdHJldHVybjtcblx0XHRcdH1cblx0XHRcdGlmIChzdHJpbmdJc1NldEFuZEZpbGxlZCh0aGlzLnRvb2x0aXBUZXh0KSkge1xuXHRcdFx0XHRpZiAodGhpcy50b29sdGlwVGV4dCA9PT0gZWwubmF0aXZlRWxlbWVudC5pbm5lclRleHQpIHtcblx0XHRcdFx0XHRyZXR1cm47XG5cdFx0XHRcdH1cblx0XHRcdH0gZWxzZSBpZiAodGhpcy50b29sdGlwVGVtcGxhdGUpIHtcblx0XHRcdFx0Ly8gbm8gbmVlZCB0byBjaGVjayBoZXJlLCBqdXN0IHJlbmRlciB0aGUgdGVtcGxhdGVcblx0XHRcdH0gZWxzZSB7XG5cdFx0XHRcdGlmIChlbC5uYXRpdmVFbGVtZW50Lm9mZnNldFdpZHRoID49IGVsLm5hdGl2ZUVsZW1lbnQuc2Nyb2xsV2lkdGgpIHtcblx0XHRcdFx0XHRyZXR1cm47XG5cdFx0XHRcdH1cblx0XHRcdH1cblx0XHRcdGlmIChnZXRDb21wdXRlZFN0eWxlKGVsLm5hdGl2ZUVsZW1lbnQpLnBvc2l0aW9uID09PSAnc3RhdGljJykge1xuXHRcdFx0XHRlbC5uYXRpdmVFbGVtZW50LnN0eWxlLnBvc2l0aW9uID0gJ3JlbGF0aXZlJztcblx0XHRcdH1cblxuXHRcdFx0dGhpcy5kaXYgPSBkb2N1bWVudC5jcmVhdGVFbGVtZW50KCdkaXYnKTtcblx0XHRcdHRoaXMuZGl2LnN0eWxlLnpJbmRleCA9IGAke3pJbmRleFN0YXJ0ICsgMn1gO1xuXHRcdFx0dGhpcy5kaXYuc3R5bGUuY29sb3IgPSBgJHtjb2xvcnNbdGhpcy5rbHBXaXRoVG9vbHRpcF0ubm9BbHBoYX1gO1xuXHRcdFx0dGhpcy5kaXYuc3R5bGUucG9zaXRpb24gPSAnZml4ZWQnO1xuXHRcdFx0dGhpcy5kaXYuc3R5bGUubGVmdCA9IGAke2VsLm5hdGl2ZUVsZW1lbnQuZ2V0Qm91bmRpbmdDbGllbnRSZWN0KCkueH1weGA7XG5cdFx0XHR0aGlzLmRpdi5zdHlsZS50b3AgPSBgJHtlbC5uYXRpdmVFbGVtZW50LmdldEJvdW5kaW5nQ2xpZW50UmVjdCgpLnl9cHhgO1xuXHRcdFx0dGhpcy5kaXYuc3R5bGUudHJhbnNmb3JtID0gYHRyYW5zbGF0ZShjYWxjKC0xMDAlICsgJHtlbC5uYXRpdmVFbGVtZW50LmdldEJvdW5kaW5nQ2xpZW50UmVjdCgpLndpZHRofXB4KSwgY2FsYygtMTAwJSAtIDAuM3JlbSkpYDtcblx0XHRcdHRoaXMuZGl2LnN0eWxlLm1heFdpZHRoID0gJzIwMHB4Jztcblx0XHRcdHRoaXMuZGl2LnN0eWxlLndoaXRlU3BhY2UgPSAnYnJlYWstc3BhY2VzJztcblx0XHRcdHRoaXMuZGl2LnN0eWxlLmJhY2tncm91bmRDb2xvciA9ICd3aGl0ZSc7XG5cdFx0XHR0aGlzLmRpdi5zdHlsZS5ib3JkZXIgPSBgMXB4IHNvbGlkICR7Y29sb3JzW3RoaXMua2xwV2l0aFRvb2x0aXBdLndpdGhBbHBoYX1gO1xuXHRcdFx0dGhpcy5kaXYuc3R5bGUuYm94U2hhZG93ID0gYDJweCAzcHggMTBweCAwcHggJHtjb2xvcnNbdGhpcy5rbHBXaXRoVG9vbHRpcF0ud2l0aEFscGhhfWA7XG5cdFx0XHR0aGlzLmRpdi5zdHlsZS5wYWRkaW5nID0gJzAuM3JlbSAwLjVyZW0nO1xuXHRcdFx0dGhpcy5kaXYuc3R5bGUuYm94U2l6aW5nID0gJ2JvcmRlci1ib3gnO1xuXHRcdFx0dGhpcy5kaXYuc3R5bGUuYm9yZGVyUmFkaXVzID0gJzNweCc7XG5cdFx0XHRpZiAoc3RyaW5nSXNTZXRBbmRGaWxsZWQodGV4dFRvRGlzcGxheSkpIHtcblx0XHRcdFx0dGhpcy5kaXYudGV4dENvbnRlbnQgPSB0ZXh0VG9EaXNwbGF5O1xuXHRcdFx0fSBlbHNlIGlmICh0aGlzLnRlbXBsYXRlSW5zdGFuY2UpIHtcblx0XHRcdFx0dGhpcy5kaXYuc3R5bGUudmlzaWJpbGl0eSA9ICdoaWRkZW4nO1xuXHRcdFx0XHR0aGlzLmRpdi5hcHBlbmRDaGlsZCh0aGlzLnRlbXBsYXRlSW5zdGFuY2UpO1xuXHRcdFx0XHRzZXRUaW1lb3V0KCgpID0+IHtcblx0XHRcdFx0XHRjb25zdCBjb2xvciA9IGdldENvbXB1dGVkU3R5bGUodGhpcy50ZW1wbGF0ZUluc3RhbmNlKS5iYWNrZ3JvdW5kQ29sb3IgfHwgZ2V0Q29tcHV0ZWRTdHlsZSh0aGlzLnRlbXBsYXRlSW5zdGFuY2UpLmJhY2tncm91bmQ7XG5cdFx0XHRcdFx0dGhpcy5kaXYuc3R5bGUuYmFja2dyb3VuZENvbG9yID0gY29sb3I7XG5cdFx0XHRcdFx0dGhpcy5kaXYuc3R5bGUudmlzaWJpbGl0eSA9ICd2aXNpYmxlJztcblx0XHRcdFx0fSk7XG5cdFx0XHR9XG5cdFx0XHRlbC5uYXRpdmVFbGVtZW50LnByZXBlbmQodGhpcy5kaXYpO1xuXG5cdFx0XHR0aGlzLnRyaWFuZ2xlID0gZG9jdW1lbnQuY3JlYXRlRWxlbWVudCgnZGl2Jyk7XG5cdFx0XHR0aGlzLnRyaWFuZ2xlLnN0eWxlLnpJbmRleCA9IGAke3pJbmRleFN0YXJ0ICsgMX1gO1xuXHRcdFx0dGhpcy50cmlhbmdsZS5zdHlsZS5wb3NpdGlvbiA9ICdmaXhlZCc7XG5cdFx0XHR0aGlzLnRyaWFuZ2xlLnN0eWxlLmxlZnQgPSBgY2FsYygke2VsLm5hdGl2ZUVsZW1lbnQuZ2V0Qm91bmRpbmdDbGllbnRSZWN0KCkueCArIGVsLm5hdGl2ZUVsZW1lbnQuZ2V0Qm91bmRpbmdDbGllbnRSZWN0KCkud2lkdGh9cHggLSAycmVtKWA7XG5cdFx0XHR0aGlzLnRyaWFuZ2xlLnN0eWxlLnRvcCA9IGAke2VsLm5hdGl2ZUVsZW1lbnQuZ2V0Qm91bmRpbmdDbGllbnRSZWN0KCkueX1weGA7XG5cdFx0XHR0aGlzLnRyaWFuZ2xlLnN0eWxlLnRyYW5zZm9ybSA9IGB0cmFuc2xhdGUoLTUwJSwgY2FsYygtMTAwJSArIDAuMXJlbSkpYDtcblx0XHRcdHRoaXMudHJpYW5nbGUuc3R5bGUud2lkdGggPSAnMCc7XG5cdFx0XHR0aGlzLnRyaWFuZ2xlLnN0eWxlLmhlaWdodCA9ICcwJztcblx0XHRcdHRoaXMudHJpYW5nbGUuc3R5bGUuYm9yZGVyTGVmdCA9IGAke3RyaWFuZ2xlU2l6ZX0gc29saWQgdHJhbnNwYXJlbnRgO1xuXHRcdFx0dGhpcy50cmlhbmdsZS5zdHlsZS5ib3JkZXJSaWdodCA9IGAke3RyaWFuZ2xlU2l6ZX0gc29saWQgdHJhbnNwYXJlbnRgO1xuXHRcdFx0dGhpcy50cmlhbmdsZS5zdHlsZS5ib3JkZXJUb3AgPSBgJHt0cmlhbmdsZVNpemV9IHNvbGlkICR7Y29sb3JzW3RoaXMua2xwV2l0aFRvb2x0aXBdLndpdGhBbHBoYX1gO1xuXHRcdFx0ZWwubmF0aXZlRWxlbWVudC5wcmVwZW5kKHRoaXMudHJpYW5nbGUpO1xuXG5cdFx0XHR0aGlzLnRyaWFuZ2xlV2hpdGUgPSBkb2N1bWVudC5jcmVhdGVFbGVtZW50KCdkaXYnKTtcblx0XHRcdHRoaXMudHJpYW5nbGVXaGl0ZS5zdHlsZS56SW5kZXggPSBgJHt6SW5kZXhTdGFydCArIDN9YDtcblx0XHRcdHRoaXMudHJpYW5nbGVXaGl0ZS5zdHlsZS5wb3NpdGlvbiA9ICdmaXhlZCc7XG5cdFx0XHR0aGlzLnRyaWFuZ2xlV2hpdGUuc3R5bGUubGVmdCA9IGBjYWxjKCR7ZWwubmF0aXZlRWxlbWVudC5nZXRCb3VuZGluZ0NsaWVudFJlY3QoKS54ICsgZWwubmF0aXZlRWxlbWVudC5nZXRCb3VuZGluZ0NsaWVudFJlY3QoKS53aWR0aH1weCAtIDJyZW0pYDtcblx0XHRcdHRoaXMudHJpYW5nbGVXaGl0ZS5zdHlsZS50b3AgPSBgJHtlbC5uYXRpdmVFbGVtZW50LmdldEJvdW5kaW5nQ2xpZW50UmVjdCgpLnl9cHhgO1xuXHRcdFx0dGhpcy50cmlhbmdsZVdoaXRlLnN0eWxlLnRyYW5zZm9ybSA9IGB0cmFuc2xhdGUoLTUwJSwgY2FsYygtMTAwJSArIDAuMXJlbSAtIDJweCkpYDtcblx0XHRcdHRoaXMudHJpYW5nbGVXaGl0ZS5zdHlsZS53aWR0aCA9ICcwJztcblx0XHRcdHRoaXMudHJpYW5nbGVXaGl0ZS5zdHlsZS5oZWlnaHQgPSAnMCc7XG5cdFx0XHR0aGlzLnRyaWFuZ2xlV2hpdGUuc3R5bGUuYm9yZGVyTGVmdCA9IGAke3RyaWFuZ2xlU2l6ZX0gc29saWQgdHJhbnNwYXJlbnRgO1xuXHRcdFx0dGhpcy50cmlhbmdsZVdoaXRlLnN0eWxlLmJvcmRlclJpZ2h0ID0gYCR7dHJpYW5nbGVTaXplfSBzb2xpZCB0cmFuc3BhcmVudGA7XG5cblx0XHRcdGlmIChzdHJpbmdJc1NldEFuZEZpbGxlZCh0ZXh0VG9EaXNwbGF5KSkge1xuXHRcdFx0XHR0aGlzLnRyaWFuZ2xlV2hpdGUuc3R5bGUuYm9yZGVyVG9wID0gYCR7dHJpYW5nbGVTaXplfSBzb2xpZCB3aGl0ZWA7XG5cdFx0XHR9IGVsc2UgaWYgKHRoaXMudGVtcGxhdGVJbnN0YW5jZSkge1xuXHRcdFx0XHR0aGlzLmRpdi5zdHlsZS52aXNpYmlsaXR5ID0gJ2hpZGRlbic7XG5cdFx0XHRcdHNldFRpbWVvdXQoKCkgPT4ge1xuXHRcdFx0XHRcdGNvbnN0IGNvbG9yID0gZ2V0Q29tcHV0ZWRTdHlsZSh0aGlzLnRlbXBsYXRlSW5zdGFuY2UpLmJhY2tncm91bmRDb2xvciB8fCBnZXRDb21wdXRlZFN0eWxlKHRoaXMudGVtcGxhdGVJbnN0YW5jZSkuYmFja2dyb3VuZDtcblx0XHRcdFx0XHR0aGlzLnRyaWFuZ2xlV2hpdGUuc3R5bGUuYm9yZGVyVG9wID0gYCR7dHJpYW5nbGVTaXplfSBzb2xpZCAke2NvbG9yfWA7XG5cdFx0XHRcdFx0dGhpcy5kaXYuc3R5bGUudmlzaWJpbGl0eSA9ICd2aXNpYmxlJztcblx0XHRcdFx0fSk7XG5cdFx0XHR9XG5cblx0XHRcdGVsLm5hdGl2ZUVsZW1lbnQucHJlcGVuZCh0aGlzLnRyaWFuZ2xlV2hpdGUpO1xuXHRcdH0pO1xuXG5cdFx0ZWwubmF0aXZlRWxlbWVudC5hZGRFdmVudExpc3RlbmVyKCdtb3VzZWxlYXZlJywgKCkgPT4ge1xuXHRcdFx0dHJ5IHtcblx0XHRcdFx0ZWwubmF0aXZlRWxlbWVudC5yZW1vdmVDaGlsZCh0aGlzLmRpdik7XG5cdFx0XHR9IGNhdGNoIChleCkge31cblx0XHRcdHRyeSB7XG5cdFx0XHRcdGVsLm5hdGl2ZUVsZW1lbnQucmVtb3ZlQ2hpbGQodGhpcy50cmlhbmdsZSk7XG5cdFx0XHR9IGNhdGNoIChleCkge31cblx0XHRcdHRyeSB7XG5cdFx0XHRcdGVsLm5hdGl2ZUVsZW1lbnQucmVtb3ZlQ2hpbGQodGhpcy50cmlhbmdsZVdoaXRlKTtcblx0XHRcdH0gY2F0Y2ggKGV4KSB7fVxuXHRcdH0pO1xuXHR9XG5cblx0cHVibGljIG5nT25DaGFuZ2VzKHNpbXBsZUNoYW5nZXM6IFNpbXBsZUNoYW5nZXMpOiB2b2lkIHtcblx0XHRpZiAoc2ltcGxlQ2hhbmdlcy50b29sdGlwVGVtcGxhdGU/LmN1cnJlbnRWYWx1ZSkge1xuXHRcdFx0Y29uc3Qgdmlld1JlZiA9IHRoaXMudG9vbHRpcFRlbXBsYXRlLmNyZWF0ZUVtYmVkZGVkVmlldyhudWxsKTtcblx0XHRcdHRoaXMudGVtcGxhdGVJbnN0YW5jZSA9IHZpZXdSZWYucm9vdE5vZGVzWzBdO1xuXHRcdH1cblx0fVxufVxuIl19
package/fesm2015/klippa-ngx-enhancy-forms.mjs CHANGED
@@ -177,6 +177,7 @@ class FormComponent {
177
177
  this.showErrorMessages = true;
178
178
  this.errorMessageLocation = 'belowCaption';
179
179
  this.warnings = new Map();
180
+ this.errors = new Map();
180
181
  this.onInjected = new EventEmitter();
181
182
  // we keep track of what form controls are actually rendered. Only those count when looking at form validation
182
183
  this.activeControls = [];
@@ -220,13 +221,16 @@ class FormComponent {
220
221
  }
221
222
  }
222
223
  ngOnChanges(simpleChanges) {
223
- var _a, _b;
224
+ var _a, _b, _c;
224
225
  if (((_a = simpleChanges.readOnly) === null || _a === void 0 ? void 0 : _a.currentValue) === true) {
225
226
  this.activeControls.forEach(e => e.formControl.disable());
226
227
  }
227
228
  if (isValueSet((_b = simpleChanges.warnings) === null || _b === void 0 ? void 0 : _b.currentValue)) {
228
229
  this.patchFormWarningsMap();
229
230
  }
231
+ if (isValueSet((_c = simpleChanges.errors) === null || _c === void 0 ? void 0 : _c.currentValue)) {
232
+ this.patchFormErrorsMap();
233
+ }
230
234
  }
231
235
  ngOnDestroy() {
232
236
  if (isValueSet(this.parent) && isValueSet(this.subFormPlaceholder)) {
@@ -263,6 +267,29 @@ class FormComponent {
263
267
  return result;
264
268
  };
265
269
  }
270
+ patchFormErrorsMap() {
271
+ const setFn = this.errors.set;
272
+ this.errors.set = (key, value) => {
273
+ var _a;
274
+ const prevVal = this.errors.get(key);
275
+ const result = setFn.call(this.errors, key, value);
276
+ key.setErrors(Object.assign(Object.assign({}, key.errors), { formLevel: value }));
277
+ if (prevVal !== value) {
278
+ (_a = this.getFormElementByFormControl(key)) === null || _a === void 0 ? void 0 : _a.determinePopupState();
279
+ }
280
+ return result;
281
+ };
282
+ const deleteFn = this.errors.delete;
283
+ this.errors.delete = (key) => {
284
+ var _a;
285
+ const newErrorsObject = key.errors;
286
+ delete newErrorsObject.formLevel;
287
+ key.setErrors(newErrorsObject);
288
+ const result = deleteFn.call(this.errors, key);
289
+ (_a = this.getFormElementByFormControl(key)) === null || _a === void 0 ? void 0 : _a.determinePopupState();
290
+ return result;
291
+ };
292
+ }
266
293
  addSupportForPatchValueInterceptor() {
267
294
  const fn = this.formGroup.patchValue;
268
295
  const newFn = (value, options) => {
@@ -428,7 +455,7 @@ class FormComponent {
428
455
  }
429
456
  }
430
457
  FormComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.8", ngImport: i0, type: FormComponent, deps: [{ token: FormComponent, optional: true, skipSelf: true }, { token: SubFormDirective, optional: true }], target: i0.ɵɵFactoryTarget.Component });
431
- FormComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.8", type: FormComponent, selector: "klp-form", inputs: { readOnly: "readOnly", showErrorMessages: "showErrorMessages", errorMessageLocation: "errorMessageLocation", formGroup: "formGroup", warnings: "warnings", patchValueInterceptor: "patchValueInterceptor" }, outputs: { onInjected: "onInjected" }, usesOnChanges: true, ngImport: i0, template: "<form>\n\t<ng-content></ng-content>\n</form>\n\n\n", styles: [":host{display:block}:host.row{display:flex}:host form{height:inherit}\n"], dependencies: [{ kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }] });
458
+ FormComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.8", type: FormComponent, selector: "klp-form", inputs: { readOnly: "readOnly", showErrorMessages: "showErrorMessages", errorMessageLocation: "errorMessageLocation", formGroup: "formGroup", warnings: "warnings", errors: "errors", patchValueInterceptor: "patchValueInterceptor" }, outputs: { onInjected: "onInjected" }, usesOnChanges: true, ngImport: i0, template: "<form>\n\t<ng-content></ng-content>\n</form>\n\n\n", styles: [":host{display:block}:host.row{display:flex}:host form{height:inherit}\n"], dependencies: [{ kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }] });
432
459
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.8", ngImport: i0, type: FormComponent, decorators: [{
433
460
  type: Component,
434
461
  args: [{ selector: 'klp-form', template: "<form>\n\t<ng-content></ng-content>\n</form>\n\n\n", styles: [":host{display:block}:host.row{display:flex}:host form{height:inherit}\n"] }]
@@ -450,6 +477,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.8", ngImpor
450
477
  type: Input
451
478
  }], warnings: [{
452
479
  type: Input
480
+ }], errors: [{
481
+ type: Input
453
482
  }], patchValueInterceptor: [{
454
483
  type: Input
455
484
  }], onInjected: [{
@@ -684,8 +713,11 @@ class FormElementComponent {
684
713
  return false;
685
714
  }
686
715
  getErrorMessage(key) {
687
- var _a, _b, _c;
688
- return (_c = (_b = (_a = this.customMessages) === null || _a === void 0 ? void 0 : _a[key]) === null || _b === void 0 ? void 0 : _b.call(_a)) !== null && _c !== void 0 ? _c : this.errorMessages[key];
716
+ var _a, _b, _c, _d;
717
+ if (key === 'formLevel') {
718
+ return (_a = this.attachedControl.errors) === null || _a === void 0 ? void 0 : _a.formLevel;
719
+ }
720
+ return (_d = (_c = (_b = this.customMessages) === null || _b === void 0 ? void 0 : _b[key]) === null || _c === void 0 ? void 0 : _c.call(_b)) !== null && _d !== void 0 ? _d : this.errorMessages[key];
689
721
  }
690
722
  getErrorLocation() {
691
723
  var _a, _b;
@@ -740,10 +772,10 @@ class FormElementComponent {
740
772
  }
741
773
  }
742
774
  FormElementComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.8", ngImport: i0, type: FormElementComponent, deps: [{ token: FormComponent, optional: true }, { token: FORM_ERROR_MESSAGES, optional: true }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
743
- FormElementComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.8", type: FormElementComponent, selector: "klp-form-element", inputs: { caption: "caption", direction: "direction", captionSpacing: "captionSpacing", verticalAlignment: "verticalAlignment", spaceDistribution: "spaceDistribution", swapInputAndCaption: "swapInputAndCaption", errorMessageAsTooltip: "errorMessageAsTooltip" }, queries: [{ propertyName: "fieldInput", first: true, predicate: NG_VALUE_ACCESSOR, descendants: true }], viewQueries: [{ propertyName: "internalComponentRef", first: true, predicate: ["internalComponentRef"], descendants: true }, { propertyName: "tailTpl", first: true, predicate: ["tailTpl"], descendants: true }, { propertyName: "captionDummyForSpaceCalculation", first: true, predicate: ["captionDummyForSpaceCalculation"], descendants: true }, { propertyName: "absoluteAnchor", first: true, predicate: ["absoluteAnchor"], descendants: true }, { propertyName: "fixedAnchor", first: true, predicate: ["fixedAnchor"], descendants: true }, { propertyName: "fixedWrapper", first: true, predicate: ["fixedWrapper"], descendants: true }], ngImport: i0, template: "<div\n\tclass=\"componentContainer\"\n\t[ngClass]=\"{\n\t\thasCaption: caption || captionRef,\n\t\tvertical: direction === 'vertical',\n\t\thorizontal: direction === 'horizontal',\n\t\ttopAlignment: verticalAlignment === 'top',\n\t\treverseOrder: swapInputAndCaption,\n\t\thasErrors: getErrorToShow() && attachedControl.touched,\n\t\tpercentageSpacing: captionSpacing === 'percentages' && spaceDistribution !== 'fixedInputWidth',\n\t\t'd40-60': spaceDistribution === '40-60',\n\t\t'd30-70': spaceDistribution === '30-70',\n\t\t'd34-66': spaceDistribution === '34-66',\n\t\t'fixedInputWidth': spaceDistribution === 'fixedInputWidth'\n\t}\"\n>\n\t<div class=\"errorAboveInputContainer\" *ngIf=\"direction === 'horizontal' && !errorMessageAsTooltip\">\n\t\t<div class=\"spacer\"></div>\n\t\t<ng-container [ngTemplateOutlet]=\"errorRef\"></ng-container>\n\t</div>\n\n\t<div class=\"captionInputAndError\" #internalComponentRef>\n\t\t<div class=\"captionDummyForSpaceCalculation\" #captionDummyForSpaceCalculation *ngIf=\"hasRightOfCaptionError()\">\n\t\t\t<ng-container [ngTemplateOutlet]=\"captionTpl\" [ngTemplateOutletContext]=\"{forCalculation: true}\"></ng-container>\n\t\t</div>\n\t\t<ng-container [ngTemplateOutlet]=\"captionTpl\"></ng-container>\n\t\t<ng-container *ngIf=\"direction === 'vertical' && getErrorLocation() === 'belowCaption' && !errorMessageAsTooltip\" [ngTemplateOutlet]=\"errorRef\"></ng-container>\n\t\t<div class=\"inputContainer\" (mouseenter)=\"setErrorTooltipOffset()\">\n\t\t\t<ng-container *ngIf=\"errorMessageAsTooltip && shouldShowErrorMessages() && getErrorToShow()\">\n\t\t\t\t<div class=\"errorTooltipTriangle\"></div>\n\t\t\t\t<div class=\"errorTooltipTriangleWhite\"></div>\n\t\t\t\t<div class=\"errorTooltip\">\n\t\t\t\t\t<ng-container [ngTemplateOutlet]=\"errorRef\"></ng-container>\n\t\t\t\t</div>\n\t\t\t</ng-container>\n\t\t\t<ng-content></ng-content>\n\t\t</div>\n\t</div>\n</div>\n\n<ng-template #captionTpl let-forCalculation=\"forCalculation\">\n\t<div class=\"caption\"\n\t\t*ngIf=\"caption || captionRef\"\n\t\t[ngClass]=\"{\n\t\t\twithErrorRightOfCaption: getErrorLocation() === 'rightOfCaption'\n\t\t}\"\n\t>\n\t\t<div *ngIf=\"captionRef\" class=\"captionRefContainer\">\n\t\t\t<ng-container [ngTemplateOutlet]=\"captionRef\"></ng-container>\n\t\t\t<div *ngIf=\"isRequired()\">&nbsp;*</div>\n\t\t</div>\n\t\t<div *ngIf=\"!captionRef\" class=\"captionText\">{{caption}}<span *ngIf=\"isRequired()\">&nbsp;*</span></div>\n\t\t<div class=\"rightOfCaptionError\" *ngIf=\"hasRightOfCaptionError()\" [ngClass]=\"{errorFullyVisible: errorFullyVisible}\">\n\t\t\t<ng-container [ngTemplateOutlet]=\"errorRef\" [ngTemplateOutletContext]=\"{forCalculation: forCalculation}\"></ng-container>\n\t\t</div>\n\t</div>\n</ng-template>\n\n<ng-template #errorRef let-forCalculation=\"forCalculation\">\n\t<div *ngIf=\"shouldShowErrorMessages() && getErrorToShow()\" class=\"errorContainer\" [elementIsTruncatedCb]=\"forCalculation ? setErrorMessageIsTruncated : null\" [ngClass]=\"{horizontal: direction === 'horizontal', hasCaption: caption || captionRef, 'd30-70': spaceDistribution === '30-70', 'd34-66': spaceDistribution === '34-66'}\">\n\t\t<div *ngIf=\"showDefaultError('min')\">{{substituteParameters(getErrorMessage(\"min\"), {min: attachedControl.errors.min.min})}}</div>\n\t\t<div *ngIf=\"showDefaultError('max')\">{{substituteParameters(getErrorMessage(\"max\"), {max: attachedControl.errors.max.max})}}</div>\n\t\t<div *ngIf=\"showDefaultError('required')\">{{getErrorMessage(\"required\")}}</div>\n\t\t<div *ngIf=\"showDefaultError('email')\">{{getErrorMessage(\"email\")}}</div>\n\t\t<div *ngIf=\"showDefaultError('minlength')\">{{substituteParameters(getErrorMessage(\"minLength\"), {minLength: attachedControl.errors.minlength.requiredLength})}}</div>\n\t\t<div *ngIf=\"showDefaultError('maxlength')\">{{substituteParameters(getErrorMessage(\"maxLength\"), {maxLength: attachedControl.errors.maxlength.requiredLength})}}</div>\n\t\t<div *ngIf=\"showDefaultError('pattern')\">{{getErrorMessage(\"pattern\")}}</div>\n\t\t<div *ngIf=\"showDefaultError('MatchPassword')\">{{getErrorMessage(\"matchPassword\")}}</div>\n\t\t<div *ngIf=\"showDefaultError('date')\">{{getErrorMessage(\"date\")}}</div>\n\t\t<div *ngIf=\"showDefaultError('message')\">{{attachedControl.errors.message.value}}</div>\n\t\t<div [ngTemplateOutlet]=\"getCustomErrorHandler(getErrorToShow())?.templateRef\"></div>\n\t</div>\n</ng-template>\n\n<ng-template #tailTpl>\n\t<div class=\"errorTooltipContainer\" [ngClass]=\"{alwaysOpen: shouldShowErrorTooltipOpened()}\">\n\t\t<ng-container *ngIf=\"hasHoverableErrorTooltip() || shouldShowErrorTooltipOpened()\">\n\t\t\t<div class=\"errorTooltipTriangle\"></div>\n\t\t\t<div class=\"errorTooltipTriangleWhite\"></div>\n\n\t\t\t<div class=\"absoluteAnchor\" #absoluteAnchor></div>\n\t\t\t<div class=\"fixedAnchor\" #fixedAnchor [onRenderFn]=\"setErrorTooltipOffset\"></div>\n\t\t\t<div class=\"fixedWrapper\" #fixedWrapper>\n\t\t\t\t<div class=\"errorTooltip\" [ngClass]=\"{noPointerEvents: !shouldShowErrorTooltipOpened()}\">\n\t\t\t\t\t<div class=\"errorTooltipInner\">\n\t\t\t\t\t\t<i class=\"closeBtn\" (click)=\"closePopup();\">\u00D7</i>\n\t\t\t\t\t\t<ng-container *ngIf=\"getErrorToShow()\" [ngTemplateOutlet]=\"errorRef\"></ng-container>\n\t\t\t\t\t\t<div *ngIf=\"!getErrorToShow() && shouldShowWarningPopup()\">\n\t\t\t\t\t\t\t<ng-container *ngIf=\"getWarningToShowIsTemplateRef()\" [ngTemplateOutlet]=\"getWarningToShowAsTemplateRef()\"></ng-container>\n\t\t\t\t\t\t\t<span *ngIf=\"!getWarningToShowIsTemplateRef()\">{{getWarningToShow()}}</span>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</div>\n\n\t\t</ng-container>\n\t\t<klp-form-warning-icon variant=\"fill\" *ngIf=\"getErrorToShow()\" (click)=\"togglePopup()\"></klp-form-warning-icon>\n\t\t<klp-form-warning-icon variant=\"line\" *ngIf=\"!getErrorToShow() && getWarningToShow()\" (click)=\"togglePopup()\"></klp-form-warning-icon>\n\t</div>\n</ng-template>\n", styles: [":host{display:block}.componentContainer:not(.hasCaption) .captionInputAndError{display:block}.componentContainer:not(.hasCaption) .captionInputAndError .inputContainer{margin-top:0;padding-left:0;max-width:initial}.componentContainer:not(.hasCaption) .errorContainer{padding-left:0}.componentContainer.hasCaption .errorAboveInputContainer .spacer{display:block}.componentContainer.reverseOrder .captionInputAndError{flex-direction:row-reverse;justify-content:flex-end}.componentContainer.vertical .captionInputAndError{display:block}.componentContainer.vertical .captionInputAndError .inputContainer{margin-top:.3125rem}.componentContainer.vertical .captionInputAndError .errorContainer{margin-left:0}.componentContainer.topAlignment .captionInputAndError{align-items:flex-start}.componentContainer.horizontal.hasCaption .inputContainer,.componentContainer.horizontal.hasCaption .errorAboveInputContainer .errorContainer{padding-left:1rem}.componentContainer.horizontal.hasCaption.d40-60 .errorAboveInputContainer .spacer{flex:0 1 40%}.componentContainer.horizontal.hasCaption.d40-60 .errorAboveInputContainer .errorContainer{flex:60 1 0px}.componentContainer.horizontal.hasCaption.d40-60 .caption{max-width:40%;flex:40 1 0px}.componentContainer.horizontal.hasCaption.d40-60 .inputContainer{max-width:60%;flex:60 1 0px}.componentContainer.horizontal.hasCaption.d34-66 .errorAboveInputContainer .spacer{flex:0 1 34%}.componentContainer.horizontal.hasCaption.d34-66 .errorAboveInputContainer .errorContainer{flex:66 1 0px}.componentContainer.horizontal.hasCaption.d34-66 .caption{max-width:34%;flex:34 1 0px}.componentContainer.horizontal.hasCaption.d34-66 .inputContainer{max-width:66%;flex:66 1 0px}.componentContainer.horizontal.hasCaption.d30-70 .errorAboveInputContainer .spacer{flex:0 1 30%}.componentContainer.horizontal.hasCaption.d30-70 .errorAboveInputContainer .errorContainer{flex:70 1 0px}.componentContainer.horizontal.hasCaption.d30-70 .caption{max-width:30%;flex:30 1 0px}.componentContainer.horizontal.hasCaption.d30-70 .inputContainer{max-width:70%;flex:70 1 0px}.componentContainer.fixedInputWidth .caption{flex:1 1 0px;overflow:hidden}.componentContainer.fixedInputWidth .inputContainer{flex:0 0 auto}.captionInputAndError{display:flex;align-items:center;min-height:42px}.errorAboveInputContainer{display:flex}.errorAboveInputContainer .spacer{display:none}.captionDummyForSpaceCalculation .caption.withErrorRightOfCaption{height:0px;overflow:hidden}.captionDummyForSpaceCalculation .caption.withErrorRightOfCaption .rightOfCaptionError{display:block}.captionRefContainer{display:flex}.caption{font-weight:700;flex:0 0 auto;color:#515365}.caption.percentageSpacing{max-width:40%;flex:40 1 0px}.caption.percentageSpacing.d30-70{max-width:30%;flex:30 1 0px}.caption.percentageSpacing.d34-66{max-width:34%;flex:34 1 0px}.caption.withErrorRightOfCaption{display:flex;justify-content:space-between;gap:1rem}.caption.withErrorRightOfCaption .captionText{flex:1 2 auto;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.caption.withErrorRightOfCaption .rightOfCaptionError{display:none;max-width:40%;font-weight:400;overflow:hidden;flex:1 0 auto;text-align:right}.caption.withErrorRightOfCaption .rightOfCaptionError.errorFullyVisible{display:block}.caption.withErrorRightOfCaption .rightOfCaptionError ::ng-deep *{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.inputContainer{position:relative;flex:1}.inputContainer .errorTooltipContainer{position:relative}.inputContainer .errorTooltipContainer.alwaysOpen .errorTooltipTriangle,.inputContainer .errorTooltipContainer.alwaysOpen .errorTooltipTriangleWhite,.inputContainer .errorTooltipContainer.alwaysOpen .errorTooltip{display:flex}.inputContainer .errorTooltipContainer.alwaysOpen .closeBtn{display:block}.inputContainer .errorTooltipContainer.alwaysOpen .errorTooltipInner{padding-right:1.4rem}.inputContainer .errorTooltipContainer klp-form-warning-icon{cursor:pointer}.inputContainer .errorTooltipContainer .absoluteAnchor{position:absolute}.inputContainer .errorTooltipContainer .fixedAnchor,.inputContainer .errorTooltipContainer .fixedWrapper{position:fixed}.inputContainer .errorTooltipTriangle{display:none;z-index:1;position:absolute;right:0;transform:translate(-.15rem,calc(-100% - .1rem)) scaleX(.8);width:0px;height:0px;border-left:8px solid transparent;border-right:8px solid transparent;border-top:8px solid rgba(0,0,0,.13)}.inputContainer .errorTooltipTriangleWhite{display:none;z-index:3;position:absolute;right:0;transform:translate(-.15rem,calc(-100% - .1rem - 2px)) scaleX(.8);width:0px;height:0px;border-left:8px solid transparent;border-right:8px solid transparent;border-top:8px solid white}.inputContainer .errorTooltip{display:none;justify-content:flex-end;position:absolute;top:-.6rem;right:-1.875rem;transform:translateY(-100%);width:20rem}.inputContainer .errorTooltip.noPointerEvents{pointer-events:none}.inputContainer .errorTooltip .closeBtn{display:none;position:absolute;top:.2rem;right:.2rem;padding:.2rem .4rem;cursor:pointer;color:#666;font-size:1rem}.inputContainer .errorTooltip .closeBtn:hover{color:#515365}.inputContainer .errorTooltipInner{background:white;padding:.4rem .6rem;border-radius:.4rem;border:1px solid rgba(0,0,0,.13);box-shadow:#00000021 2px 3px 10px}.inputContainer:hover .errorTooltipContainer .errorTooltip,.inputContainer:hover .errorTooltipContainer .errorTooltipTriangle,.inputContainer:hover .errorTooltipContainer .errorTooltipTriangleWhite{display:flex}.errorContainer{color:#ff8000}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: OnRenderDirective, selector: "[onRenderFn]", inputs: ["onRenderFn"] }, { kind: "component", type: WarningIconComponent, selector: "klp-form-warning-icon", inputs: ["variant"] }, { kind: "directive", type: ElementIsTruncatedCbComponent, selector: "[elementIsTruncatedCb]", inputs: ["elementIsTruncatedCb"] }] });
775
+ FormElementComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.8", type: FormElementComponent, selector: "klp-form-element", inputs: { caption: "caption", direction: "direction", captionSpacing: "captionSpacing", verticalAlignment: "verticalAlignment", spaceDistribution: "spaceDistribution", swapInputAndCaption: "swapInputAndCaption", errorMessageAsTooltip: "errorMessageAsTooltip" }, queries: [{ propertyName: "fieldInput", first: true, predicate: NG_VALUE_ACCESSOR, descendants: true }], viewQueries: [{ propertyName: "internalComponentRef", first: true, predicate: ["internalComponentRef"], descendants: true }, { propertyName: "tailTpl", first: true, predicate: ["tailTpl"], descendants: true }, { propertyName: "captionDummyForSpaceCalculation", first: true, predicate: ["captionDummyForSpaceCalculation"], descendants: true }, { propertyName: "absoluteAnchor", first: true, predicate: ["absoluteAnchor"], descendants: true }, { propertyName: "fixedAnchor", first: true, predicate: ["fixedAnchor"], descendants: true }, { propertyName: "fixedWrapper", first: true, predicate: ["fixedWrapper"], descendants: true }], ngImport: i0, template: "<div\n\tclass=\"componentContainer\"\n\t[ngClass]=\"{\n\t\thasCaption: caption || captionRef,\n\t\tvertical: direction === 'vertical',\n\t\thorizontal: direction === 'horizontal',\n\t\ttopAlignment: verticalAlignment === 'top',\n\t\treverseOrder: swapInputAndCaption,\n\t\thasErrors: getErrorToShow() && attachedControl.touched,\n\t\tpercentageSpacing: captionSpacing === 'percentages' && spaceDistribution !== 'fixedInputWidth',\n\t\t'd40-60': spaceDistribution === '40-60',\n\t\t'd30-70': spaceDistribution === '30-70',\n\t\t'd34-66': spaceDistribution === '34-66',\n\t\t'fixedInputWidth': spaceDistribution === 'fixedInputWidth'\n\t}\"\n>\n\t<div class=\"errorAboveInputContainer\" *ngIf=\"direction === 'horizontal' && !errorMessageAsTooltip\">\n\t\t<div class=\"spacer\"></div>\n\t\t<ng-container [ngTemplateOutlet]=\"errorRef\"></ng-container>\n\t</div>\n\n\t<div class=\"captionInputAndError\" #internalComponentRef>\n\t\t<div class=\"captionDummyForSpaceCalculation\" #captionDummyForSpaceCalculation *ngIf=\"hasRightOfCaptionError()\">\n\t\t\t<ng-container [ngTemplateOutlet]=\"captionTpl\" [ngTemplateOutletContext]=\"{forCalculation: true}\"></ng-container>\n\t\t</div>\n\t\t<ng-container [ngTemplateOutlet]=\"captionTpl\"></ng-container>\n\t\t<ng-container *ngIf=\"direction === 'vertical' && getErrorLocation() === 'belowCaption' && !errorMessageAsTooltip\" [ngTemplateOutlet]=\"errorRef\"></ng-container>\n\t\t<div class=\"inputContainer\" (mouseenter)=\"setErrorTooltipOffset()\">\n\t\t\t<ng-container *ngIf=\"errorMessageAsTooltip && shouldShowErrorMessages() && getErrorToShow()\">\n\t\t\t\t<div class=\"errorTooltipTriangle\"></div>\n\t\t\t\t<div class=\"errorTooltipTriangleWhite\"></div>\n\t\t\t\t<div class=\"errorTooltip\">\n\t\t\t\t\t<ng-container [ngTemplateOutlet]=\"errorRef\"></ng-container>\n\t\t\t\t</div>\n\t\t\t</ng-container>\n\t\t\t<ng-content></ng-content>\n\t\t</div>\n\t</div>\n</div>\n\n<ng-template #captionTpl let-forCalculation=\"forCalculation\">\n\t<div class=\"caption\"\n\t\t*ngIf=\"caption || captionRef\"\n\t\t[ngClass]=\"{\n\t\t\twithErrorRightOfCaption: getErrorLocation() === 'rightOfCaption'\n\t\t}\"\n\t>\n\t\t<div *ngIf=\"captionRef\" class=\"captionRefContainer\">\n\t\t\t<ng-container [ngTemplateOutlet]=\"captionRef\"></ng-container>\n\t\t\t<div *ngIf=\"isRequired()\">&nbsp;*</div>\n\t\t</div>\n\t\t<div *ngIf=\"!captionRef\" class=\"captionText\">{{caption}}<span *ngIf=\"isRequired()\">&nbsp;*</span></div>\n\t\t<div class=\"rightOfCaptionError\" *ngIf=\"hasRightOfCaptionError()\" [ngClass]=\"{errorFullyVisible: errorFullyVisible}\">\n\t\t\t<ng-container [ngTemplateOutlet]=\"errorRef\" [ngTemplateOutletContext]=\"{forCalculation: forCalculation}\"></ng-container>\n\t\t</div>\n\t</div>\n</ng-template>\n\n<ng-template #errorRef let-forCalculation=\"forCalculation\">\n\t<div *ngIf=\"shouldShowErrorMessages() && getErrorToShow()\" class=\"errorContainer\" [elementIsTruncatedCb]=\"forCalculation ? setErrorMessageIsTruncated : null\" [ngClass]=\"{horizontal: direction === 'horizontal', hasCaption: caption || captionRef, 'd30-70': spaceDistribution === '30-70', 'd34-66': spaceDistribution === '34-66'}\">\n\t\t<div *ngIf=\"showDefaultError('min')\">{{substituteParameters(getErrorMessage(\"min\"), {min: attachedControl.errors.min.min})}}</div>\n\t\t<div *ngIf=\"showDefaultError('max')\">{{substituteParameters(getErrorMessage(\"max\"), {max: attachedControl.errors.max.max})}}</div>\n\t\t<div *ngIf=\"showDefaultError('required')\">{{getErrorMessage(\"required\")}}</div>\n\t\t<div *ngIf=\"showDefaultError('email')\">{{getErrorMessage(\"email\")}}</div>\n\t\t<div *ngIf=\"showDefaultError('minlength')\">{{substituteParameters(getErrorMessage(\"minLength\"), {minLength: attachedControl.errors.minlength.requiredLength})}}</div>\n\t\t<div *ngIf=\"showDefaultError('maxlength')\">{{substituteParameters(getErrorMessage(\"maxLength\"), {maxLength: attachedControl.errors.maxlength.requiredLength})}}</div>\n\t\t<div *ngIf=\"showDefaultError('pattern')\">{{getErrorMessage(\"pattern\")}}</div>\n\t\t<div *ngIf=\"showDefaultError('MatchPassword')\">{{getErrorMessage(\"matchPassword\")}}</div>\n\t\t<div *ngIf=\"showDefaultError('date')\">{{getErrorMessage(\"date\")}}</div>\n\t\t<div *ngIf=\"showDefaultError('message')\">{{attachedControl.errors.message.value}}</div>\n\t\t<div *ngIf=\"showDefaultError('formLevel')\">{{getErrorMessage(\"formLevel\")}}</div>\n\t\t<div [ngTemplateOutlet]=\"getCustomErrorHandler(getErrorToShow())?.templateRef\"></div>\n\t</div>\n</ng-template>\n\n<ng-template #tailTpl>\n\t<div class=\"errorTooltipContainer\" [ngClass]=\"{alwaysOpen: shouldShowErrorTooltipOpened()}\">\n\t\t<ng-container *ngIf=\"hasHoverableErrorTooltip() || shouldShowErrorTooltipOpened()\">\n\t\t\t<div class=\"errorTooltipTriangle\"></div>\n\t\t\t<div class=\"errorTooltipTriangleWhite\"></div>\n\n\t\t\t<div class=\"absoluteAnchor\" #absoluteAnchor></div>\n\t\t\t<div class=\"fixedAnchor\" #fixedAnchor [onRenderFn]=\"setErrorTooltipOffset\"></div>\n\t\t\t<div class=\"fixedWrapper\" #fixedWrapper>\n\t\t\t\t<div class=\"errorTooltip\" [ngClass]=\"{noPointerEvents: !shouldShowErrorTooltipOpened()}\">\n\t\t\t\t\t<div class=\"errorTooltipInner\">\n\t\t\t\t\t\t<i class=\"closeBtn\" (click)=\"closePopup();\">\u00D7</i>\n\t\t\t\t\t\t<ng-container *ngIf=\"getErrorToShow()\" [ngTemplateOutlet]=\"errorRef\"></ng-container>\n\t\t\t\t\t\t<div *ngIf=\"!getErrorToShow() && shouldShowWarningPopup()\">\n\t\t\t\t\t\t\t<ng-container *ngIf=\"getWarningToShowIsTemplateRef()\" [ngTemplateOutlet]=\"getWarningToShowAsTemplateRef()\"></ng-container>\n\t\t\t\t\t\t\t<span *ngIf=\"!getWarningToShowIsTemplateRef()\">{{getWarningToShow()}}</span>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</div>\n\n\t\t</ng-container>\n\t\t<klp-form-warning-icon variant=\"fill\" *ngIf=\"getErrorToShow()\" (click)=\"togglePopup()\"></klp-form-warning-icon>\n\t\t<klp-form-warning-icon variant=\"line\" *ngIf=\"!getErrorToShow() && getWarningToShow()\" (click)=\"togglePopup()\"></klp-form-warning-icon>\n\t</div>\n</ng-template>\n", styles: [":host{display:block}.componentContainer:not(.hasCaption) .captionInputAndError{display:block}.componentContainer:not(.hasCaption) .captionInputAndError .inputContainer{margin-top:0;padding-left:0;max-width:initial}.componentContainer:not(.hasCaption) .errorContainer{padding-left:0}.componentContainer.hasCaption .errorAboveInputContainer .spacer{display:block}.componentContainer.reverseOrder .captionInputAndError{flex-direction:row-reverse;justify-content:flex-end}.componentContainer.vertical .captionInputAndError{display:block}.componentContainer.vertical .captionInputAndError .inputContainer{margin-top:.3125rem}.componentContainer.vertical .captionInputAndError .errorContainer{margin-left:0}.componentContainer.topAlignment .captionInputAndError{align-items:flex-start}.componentContainer.horizontal.hasCaption .inputContainer,.componentContainer.horizontal.hasCaption .errorAboveInputContainer .errorContainer{padding-left:1rem}.componentContainer.horizontal.hasCaption.d40-60 .errorAboveInputContainer .spacer{flex:0 1 40%}.componentContainer.horizontal.hasCaption.d40-60 .errorAboveInputContainer .errorContainer{flex:60 1 0px}.componentContainer.horizontal.hasCaption.d40-60 .caption{max-width:40%;flex:40 1 0px}.componentContainer.horizontal.hasCaption.d40-60 .inputContainer{max-width:60%;flex:60 1 0px}.componentContainer.horizontal.hasCaption.d34-66 .errorAboveInputContainer .spacer{flex:0 1 34%}.componentContainer.horizontal.hasCaption.d34-66 .errorAboveInputContainer .errorContainer{flex:66 1 0px}.componentContainer.horizontal.hasCaption.d34-66 .caption{max-width:34%;flex:34 1 0px}.componentContainer.horizontal.hasCaption.d34-66 .inputContainer{max-width:66%;flex:66 1 0px}.componentContainer.horizontal.hasCaption.d30-70 .errorAboveInputContainer .spacer{flex:0 1 30%}.componentContainer.horizontal.hasCaption.d30-70 .errorAboveInputContainer .errorContainer{flex:70 1 0px}.componentContainer.horizontal.hasCaption.d30-70 .caption{max-width:30%;flex:30 1 0px}.componentContainer.horizontal.hasCaption.d30-70 .inputContainer{max-width:70%;flex:70 1 0px}.componentContainer.fixedInputWidth .caption{flex:1 1 0px;overflow:hidden}.componentContainer.fixedInputWidth .inputContainer{flex:0 0 auto}.captionInputAndError{display:flex;align-items:center;min-height:42px}.errorAboveInputContainer{display:flex}.errorAboveInputContainer .spacer{display:none}.captionDummyForSpaceCalculation .caption.withErrorRightOfCaption{height:0px;overflow:hidden}.captionDummyForSpaceCalculation .caption.withErrorRightOfCaption .rightOfCaptionError{display:block}.captionRefContainer{display:flex}.caption{font-weight:700;flex:0 0 auto;color:#515365}.caption.percentageSpacing{max-width:40%;flex:40 1 0px}.caption.percentageSpacing.d30-70{max-width:30%;flex:30 1 0px}.caption.percentageSpacing.d34-66{max-width:34%;flex:34 1 0px}.caption.withErrorRightOfCaption{display:flex;justify-content:space-between;gap:1rem}.caption.withErrorRightOfCaption .captionText{flex:1 2 auto;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.caption.withErrorRightOfCaption .rightOfCaptionError{display:none;max-width:40%;font-weight:400;overflow:hidden;flex:1 0 auto;text-align:right}.caption.withErrorRightOfCaption .rightOfCaptionError.errorFullyVisible{display:block}.caption.withErrorRightOfCaption .rightOfCaptionError ::ng-deep *{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.inputContainer{position:relative;flex:1}.inputContainer .errorTooltipContainer{position:relative}.inputContainer .errorTooltipContainer.alwaysOpen .errorTooltipTriangle,.inputContainer .errorTooltipContainer.alwaysOpen .errorTooltipTriangleWhite,.inputContainer .errorTooltipContainer.alwaysOpen .errorTooltip{display:flex}.inputContainer .errorTooltipContainer.alwaysOpen .closeBtn{display:block}.inputContainer .errorTooltipContainer.alwaysOpen .errorTooltipInner{padding-right:1.4rem}.inputContainer .errorTooltipContainer klp-form-warning-icon{cursor:pointer}.inputContainer .errorTooltipContainer .absoluteAnchor{position:absolute}.inputContainer .errorTooltipContainer .fixedAnchor,.inputContainer .errorTooltipContainer .fixedWrapper{position:fixed}.inputContainer .errorTooltipTriangle{display:none;z-index:1;position:absolute;right:0;transform:translate(-.15rem,calc(-100% - .1rem)) scaleX(.8);width:0px;height:0px;border-left:8px solid transparent;border-right:8px solid transparent;border-top:8px solid rgba(0,0,0,.13)}.inputContainer .errorTooltipTriangleWhite{display:none;z-index:3;position:absolute;right:0;transform:translate(-.15rem,calc(-100% - .1rem - 2px)) scaleX(.8);width:0px;height:0px;border-left:8px solid transparent;border-right:8px solid transparent;border-top:8px solid white}.inputContainer .errorTooltip{display:none;justify-content:flex-end;position:absolute;top:-.6rem;right:-1.875rem;transform:translateY(-100%);width:20rem}.inputContainer .errorTooltip.noPointerEvents{pointer-events:none}.inputContainer .errorTooltip .closeBtn{display:none;position:absolute;top:.2rem;right:.2rem;padding:.2rem .4rem;cursor:pointer;color:#666;font-size:1rem}.inputContainer .errorTooltip .closeBtn:hover{color:#515365}.inputContainer .errorTooltipInner{background:white;padding:.4rem .6rem;border-radius:.4rem;border:1px solid rgba(0,0,0,.13);box-shadow:#00000021 2px 3px 10px}.inputContainer:hover .errorTooltipContainer .errorTooltip,.inputContainer:hover .errorTooltipContainer .errorTooltipTriangle,.inputContainer:hover .errorTooltipContainer .errorTooltipTriangleWhite{display:flex}.errorContainer{color:#ff8000}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: OnRenderDirective, selector: "[onRenderFn]", inputs: ["onRenderFn"] }, { kind: "component", type: WarningIconComponent, selector: "klp-form-warning-icon", inputs: ["variant"] }, { kind: "directive", type: ElementIsTruncatedCbComponent, selector: "[elementIsTruncatedCb]", inputs: ["elementIsTruncatedCb"] }] });
744
776
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.8", ngImport: i0, type: FormElementComponent, decorators: [{
745
777
  type: Component,
746
- args: [{ selector: 'klp-form-element', template: "<div\n\tclass=\"componentContainer\"\n\t[ngClass]=\"{\n\t\thasCaption: caption || captionRef,\n\t\tvertical: direction === 'vertical',\n\t\thorizontal: direction === 'horizontal',\n\t\ttopAlignment: verticalAlignment === 'top',\n\t\treverseOrder: swapInputAndCaption,\n\t\thasErrors: getErrorToShow() && attachedControl.touched,\n\t\tpercentageSpacing: captionSpacing === 'percentages' && spaceDistribution !== 'fixedInputWidth',\n\t\t'd40-60': spaceDistribution === '40-60',\n\t\t'd30-70': spaceDistribution === '30-70',\n\t\t'd34-66': spaceDistribution === '34-66',\n\t\t'fixedInputWidth': spaceDistribution === 'fixedInputWidth'\n\t}\"\n>\n\t<div class=\"errorAboveInputContainer\" *ngIf=\"direction === 'horizontal' && !errorMessageAsTooltip\">\n\t\t<div class=\"spacer\"></div>\n\t\t<ng-container [ngTemplateOutlet]=\"errorRef\"></ng-container>\n\t</div>\n\n\t<div class=\"captionInputAndError\" #internalComponentRef>\n\t\t<div class=\"captionDummyForSpaceCalculation\" #captionDummyForSpaceCalculation *ngIf=\"hasRightOfCaptionError()\">\n\t\t\t<ng-container [ngTemplateOutlet]=\"captionTpl\" [ngTemplateOutletContext]=\"{forCalculation: true}\"></ng-container>\n\t\t</div>\n\t\t<ng-container [ngTemplateOutlet]=\"captionTpl\"></ng-container>\n\t\t<ng-container *ngIf=\"direction === 'vertical' && getErrorLocation() === 'belowCaption' && !errorMessageAsTooltip\" [ngTemplateOutlet]=\"errorRef\"></ng-container>\n\t\t<div class=\"inputContainer\" (mouseenter)=\"setErrorTooltipOffset()\">\n\t\t\t<ng-container *ngIf=\"errorMessageAsTooltip && shouldShowErrorMessages() && getErrorToShow()\">\n\t\t\t\t<div class=\"errorTooltipTriangle\"></div>\n\t\t\t\t<div class=\"errorTooltipTriangleWhite\"></div>\n\t\t\t\t<div class=\"errorTooltip\">\n\t\t\t\t\t<ng-container [ngTemplateOutlet]=\"errorRef\"></ng-container>\n\t\t\t\t</div>\n\t\t\t</ng-container>\n\t\t\t<ng-content></ng-content>\n\t\t</div>\n\t</div>\n</div>\n\n<ng-template #captionTpl let-forCalculation=\"forCalculation\">\n\t<div class=\"caption\"\n\t\t*ngIf=\"caption || captionRef\"\n\t\t[ngClass]=\"{\n\t\t\twithErrorRightOfCaption: getErrorLocation() === 'rightOfCaption'\n\t\t}\"\n\t>\n\t\t<div *ngIf=\"captionRef\" class=\"captionRefContainer\">\n\t\t\t<ng-container [ngTemplateOutlet]=\"captionRef\"></ng-container>\n\t\t\t<div *ngIf=\"isRequired()\">&nbsp;*</div>\n\t\t</div>\n\t\t<div *ngIf=\"!captionRef\" class=\"captionText\">{{caption}}<span *ngIf=\"isRequired()\">&nbsp;*</span></div>\n\t\t<div class=\"rightOfCaptionError\" *ngIf=\"hasRightOfCaptionError()\" [ngClass]=\"{errorFullyVisible: errorFullyVisible}\">\n\t\t\t<ng-container [ngTemplateOutlet]=\"errorRef\" [ngTemplateOutletContext]=\"{forCalculation: forCalculation}\"></ng-container>\n\t\t</div>\n\t</div>\n</ng-template>\n\n<ng-template #errorRef let-forCalculation=\"forCalculation\">\n\t<div *ngIf=\"shouldShowErrorMessages() && getErrorToShow()\" class=\"errorContainer\" [elementIsTruncatedCb]=\"forCalculation ? setErrorMessageIsTruncated : null\" [ngClass]=\"{horizontal: direction === 'horizontal', hasCaption: caption || captionRef, 'd30-70': spaceDistribution === '30-70', 'd34-66': spaceDistribution === '34-66'}\">\n\t\t<div *ngIf=\"showDefaultError('min')\">{{substituteParameters(getErrorMessage(\"min\"), {min: attachedControl.errors.min.min})}}</div>\n\t\t<div *ngIf=\"showDefaultError('max')\">{{substituteParameters(getErrorMessage(\"max\"), {max: attachedControl.errors.max.max})}}</div>\n\t\t<div *ngIf=\"showDefaultError('required')\">{{getErrorMessage(\"required\")}}</div>\n\t\t<div *ngIf=\"showDefaultError('email')\">{{getErrorMessage(\"email\")}}</div>\n\t\t<div *ngIf=\"showDefaultError('minlength')\">{{substituteParameters(getErrorMessage(\"minLength\"), {minLength: attachedControl.errors.minlength.requiredLength})}}</div>\n\t\t<div *ngIf=\"showDefaultError('maxlength')\">{{substituteParameters(getErrorMessage(\"maxLength\"), {maxLength: attachedControl.errors.maxlength.requiredLength})}}</div>\n\t\t<div *ngIf=\"showDefaultError('pattern')\">{{getErrorMessage(\"pattern\")}}</div>\n\t\t<div *ngIf=\"showDefaultError('MatchPassword')\">{{getErrorMessage(\"matchPassword\")}}</div>\n\t\t<div *ngIf=\"showDefaultError('date')\">{{getErrorMessage(\"date\")}}</div>\n\t\t<div *ngIf=\"showDefaultError('message')\">{{attachedControl.errors.message.value}}</div>\n\t\t<div [ngTemplateOutlet]=\"getCustomErrorHandler(getErrorToShow())?.templateRef\"></div>\n\t</div>\n</ng-template>\n\n<ng-template #tailTpl>\n\t<div class=\"errorTooltipContainer\" [ngClass]=\"{alwaysOpen: shouldShowErrorTooltipOpened()}\">\n\t\t<ng-container *ngIf=\"hasHoverableErrorTooltip() || shouldShowErrorTooltipOpened()\">\n\t\t\t<div class=\"errorTooltipTriangle\"></div>\n\t\t\t<div class=\"errorTooltipTriangleWhite\"></div>\n\n\t\t\t<div class=\"absoluteAnchor\" #absoluteAnchor></div>\n\t\t\t<div class=\"fixedAnchor\" #fixedAnchor [onRenderFn]=\"setErrorTooltipOffset\"></div>\n\t\t\t<div class=\"fixedWrapper\" #fixedWrapper>\n\t\t\t\t<div class=\"errorTooltip\" [ngClass]=\"{noPointerEvents: !shouldShowErrorTooltipOpened()}\">\n\t\t\t\t\t<div class=\"errorTooltipInner\">\n\t\t\t\t\t\t<i class=\"closeBtn\" (click)=\"closePopup();\">\u00D7</i>\n\t\t\t\t\t\t<ng-container *ngIf=\"getErrorToShow()\" [ngTemplateOutlet]=\"errorRef\"></ng-container>\n\t\t\t\t\t\t<div *ngIf=\"!getErrorToShow() && shouldShowWarningPopup()\">\n\t\t\t\t\t\t\t<ng-container *ngIf=\"getWarningToShowIsTemplateRef()\" [ngTemplateOutlet]=\"getWarningToShowAsTemplateRef()\"></ng-container>\n\t\t\t\t\t\t\t<span *ngIf=\"!getWarningToShowIsTemplateRef()\">{{getWarningToShow()}}</span>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</div>\n\n\t\t</ng-container>\n\t\t<klp-form-warning-icon variant=\"fill\" *ngIf=\"getErrorToShow()\" (click)=\"togglePopup()\"></klp-form-warning-icon>\n\t\t<klp-form-warning-icon variant=\"line\" *ngIf=\"!getErrorToShow() && getWarningToShow()\" (click)=\"togglePopup()\"></klp-form-warning-icon>\n\t</div>\n</ng-template>\n", styles: [":host{display:block}.componentContainer:not(.hasCaption) .captionInputAndError{display:block}.componentContainer:not(.hasCaption) .captionInputAndError .inputContainer{margin-top:0;padding-left:0;max-width:initial}.componentContainer:not(.hasCaption) .errorContainer{padding-left:0}.componentContainer.hasCaption .errorAboveInputContainer .spacer{display:block}.componentContainer.reverseOrder .captionInputAndError{flex-direction:row-reverse;justify-content:flex-end}.componentContainer.vertical .captionInputAndError{display:block}.componentContainer.vertical .captionInputAndError .inputContainer{margin-top:.3125rem}.componentContainer.vertical .captionInputAndError .errorContainer{margin-left:0}.componentContainer.topAlignment .captionInputAndError{align-items:flex-start}.componentContainer.horizontal.hasCaption .inputContainer,.componentContainer.horizontal.hasCaption .errorAboveInputContainer .errorContainer{padding-left:1rem}.componentContainer.horizontal.hasCaption.d40-60 .errorAboveInputContainer .spacer{flex:0 1 40%}.componentContainer.horizontal.hasCaption.d40-60 .errorAboveInputContainer .errorContainer{flex:60 1 0px}.componentContainer.horizontal.hasCaption.d40-60 .caption{max-width:40%;flex:40 1 0px}.componentContainer.horizontal.hasCaption.d40-60 .inputContainer{max-width:60%;flex:60 1 0px}.componentContainer.horizontal.hasCaption.d34-66 .errorAboveInputContainer .spacer{flex:0 1 34%}.componentContainer.horizontal.hasCaption.d34-66 .errorAboveInputContainer .errorContainer{flex:66 1 0px}.componentContainer.horizontal.hasCaption.d34-66 .caption{max-width:34%;flex:34 1 0px}.componentContainer.horizontal.hasCaption.d34-66 .inputContainer{max-width:66%;flex:66 1 0px}.componentContainer.horizontal.hasCaption.d30-70 .errorAboveInputContainer .spacer{flex:0 1 30%}.componentContainer.horizontal.hasCaption.d30-70 .errorAboveInputContainer .errorContainer{flex:70 1 0px}.componentContainer.horizontal.hasCaption.d30-70 .caption{max-width:30%;flex:30 1 0px}.componentContainer.horizontal.hasCaption.d30-70 .inputContainer{max-width:70%;flex:70 1 0px}.componentContainer.fixedInputWidth .caption{flex:1 1 0px;overflow:hidden}.componentContainer.fixedInputWidth .inputContainer{flex:0 0 auto}.captionInputAndError{display:flex;align-items:center;min-height:42px}.errorAboveInputContainer{display:flex}.errorAboveInputContainer .spacer{display:none}.captionDummyForSpaceCalculation .caption.withErrorRightOfCaption{height:0px;overflow:hidden}.captionDummyForSpaceCalculation .caption.withErrorRightOfCaption .rightOfCaptionError{display:block}.captionRefContainer{display:flex}.caption{font-weight:700;flex:0 0 auto;color:#515365}.caption.percentageSpacing{max-width:40%;flex:40 1 0px}.caption.percentageSpacing.d30-70{max-width:30%;flex:30 1 0px}.caption.percentageSpacing.d34-66{max-width:34%;flex:34 1 0px}.caption.withErrorRightOfCaption{display:flex;justify-content:space-between;gap:1rem}.caption.withErrorRightOfCaption .captionText{flex:1 2 auto;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.caption.withErrorRightOfCaption .rightOfCaptionError{display:none;max-width:40%;font-weight:400;overflow:hidden;flex:1 0 auto;text-align:right}.caption.withErrorRightOfCaption .rightOfCaptionError.errorFullyVisible{display:block}.caption.withErrorRightOfCaption .rightOfCaptionError ::ng-deep *{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.inputContainer{position:relative;flex:1}.inputContainer .errorTooltipContainer{position:relative}.inputContainer .errorTooltipContainer.alwaysOpen .errorTooltipTriangle,.inputContainer .errorTooltipContainer.alwaysOpen .errorTooltipTriangleWhite,.inputContainer .errorTooltipContainer.alwaysOpen .errorTooltip{display:flex}.inputContainer .errorTooltipContainer.alwaysOpen .closeBtn{display:block}.inputContainer .errorTooltipContainer.alwaysOpen .errorTooltipInner{padding-right:1.4rem}.inputContainer .errorTooltipContainer klp-form-warning-icon{cursor:pointer}.inputContainer .errorTooltipContainer .absoluteAnchor{position:absolute}.inputContainer .errorTooltipContainer .fixedAnchor,.inputContainer .errorTooltipContainer .fixedWrapper{position:fixed}.inputContainer .errorTooltipTriangle{display:none;z-index:1;position:absolute;right:0;transform:translate(-.15rem,calc(-100% - .1rem)) scaleX(.8);width:0px;height:0px;border-left:8px solid transparent;border-right:8px solid transparent;border-top:8px solid rgba(0,0,0,.13)}.inputContainer .errorTooltipTriangleWhite{display:none;z-index:3;position:absolute;right:0;transform:translate(-.15rem,calc(-100% - .1rem - 2px)) scaleX(.8);width:0px;height:0px;border-left:8px solid transparent;border-right:8px solid transparent;border-top:8px solid white}.inputContainer .errorTooltip{display:none;justify-content:flex-end;position:absolute;top:-.6rem;right:-1.875rem;transform:translateY(-100%);width:20rem}.inputContainer .errorTooltip.noPointerEvents{pointer-events:none}.inputContainer .errorTooltip .closeBtn{display:none;position:absolute;top:.2rem;right:.2rem;padding:.2rem .4rem;cursor:pointer;color:#666;font-size:1rem}.inputContainer .errorTooltip .closeBtn:hover{color:#515365}.inputContainer .errorTooltipInner{background:white;padding:.4rem .6rem;border-radius:.4rem;border:1px solid rgba(0,0,0,.13);box-shadow:#00000021 2px 3px 10px}.inputContainer:hover .errorTooltipContainer .errorTooltip,.inputContainer:hover .errorTooltipContainer .errorTooltipTriangle,.inputContainer:hover .errorTooltipContainer .errorTooltipTriangleWhite{display:flex}.errorContainer{color:#ff8000}\n"] }]
778
+ args: [{ selector: 'klp-form-element', template: "<div\n\tclass=\"componentContainer\"\n\t[ngClass]=\"{\n\t\thasCaption: caption || captionRef,\n\t\tvertical: direction === 'vertical',\n\t\thorizontal: direction === 'horizontal',\n\t\ttopAlignment: verticalAlignment === 'top',\n\t\treverseOrder: swapInputAndCaption,\n\t\thasErrors: getErrorToShow() && attachedControl.touched,\n\t\tpercentageSpacing: captionSpacing === 'percentages' && spaceDistribution !== 'fixedInputWidth',\n\t\t'd40-60': spaceDistribution === '40-60',\n\t\t'd30-70': spaceDistribution === '30-70',\n\t\t'd34-66': spaceDistribution === '34-66',\n\t\t'fixedInputWidth': spaceDistribution === 'fixedInputWidth'\n\t}\"\n>\n\t<div class=\"errorAboveInputContainer\" *ngIf=\"direction === 'horizontal' && !errorMessageAsTooltip\">\n\t\t<div class=\"spacer\"></div>\n\t\t<ng-container [ngTemplateOutlet]=\"errorRef\"></ng-container>\n\t</div>\n\n\t<div class=\"captionInputAndError\" #internalComponentRef>\n\t\t<div class=\"captionDummyForSpaceCalculation\" #captionDummyForSpaceCalculation *ngIf=\"hasRightOfCaptionError()\">\n\t\t\t<ng-container [ngTemplateOutlet]=\"captionTpl\" [ngTemplateOutletContext]=\"{forCalculation: true}\"></ng-container>\n\t\t</div>\n\t\t<ng-container [ngTemplateOutlet]=\"captionTpl\"></ng-container>\n\t\t<ng-container *ngIf=\"direction === 'vertical' && getErrorLocation() === 'belowCaption' && !errorMessageAsTooltip\" [ngTemplateOutlet]=\"errorRef\"></ng-container>\n\t\t<div class=\"inputContainer\" (mouseenter)=\"setErrorTooltipOffset()\">\n\t\t\t<ng-container *ngIf=\"errorMessageAsTooltip && shouldShowErrorMessages() && getErrorToShow()\">\n\t\t\t\t<div class=\"errorTooltipTriangle\"></div>\n\t\t\t\t<div class=\"errorTooltipTriangleWhite\"></div>\n\t\t\t\t<div class=\"errorTooltip\">\n\t\t\t\t\t<ng-container [ngTemplateOutlet]=\"errorRef\"></ng-container>\n\t\t\t\t</div>\n\t\t\t</ng-container>\n\t\t\t<ng-content></ng-content>\n\t\t</div>\n\t</div>\n</div>\n\n<ng-template #captionTpl let-forCalculation=\"forCalculation\">\n\t<div class=\"caption\"\n\t\t*ngIf=\"caption || captionRef\"\n\t\t[ngClass]=\"{\n\t\t\twithErrorRightOfCaption: getErrorLocation() === 'rightOfCaption'\n\t\t}\"\n\t>\n\t\t<div *ngIf=\"captionRef\" class=\"captionRefContainer\">\n\t\t\t<ng-container [ngTemplateOutlet]=\"captionRef\"></ng-container>\n\t\t\t<div *ngIf=\"isRequired()\">&nbsp;*</div>\n\t\t</div>\n\t\t<div *ngIf=\"!captionRef\" class=\"captionText\">{{caption}}<span *ngIf=\"isRequired()\">&nbsp;*</span></div>\n\t\t<div class=\"rightOfCaptionError\" *ngIf=\"hasRightOfCaptionError()\" [ngClass]=\"{errorFullyVisible: errorFullyVisible}\">\n\t\t\t<ng-container [ngTemplateOutlet]=\"errorRef\" [ngTemplateOutletContext]=\"{forCalculation: forCalculation}\"></ng-container>\n\t\t</div>\n\t</div>\n</ng-template>\n\n<ng-template #errorRef let-forCalculation=\"forCalculation\">\n\t<div *ngIf=\"shouldShowErrorMessages() && getErrorToShow()\" class=\"errorContainer\" [elementIsTruncatedCb]=\"forCalculation ? setErrorMessageIsTruncated : null\" [ngClass]=\"{horizontal: direction === 'horizontal', hasCaption: caption || captionRef, 'd30-70': spaceDistribution === '30-70', 'd34-66': spaceDistribution === '34-66'}\">\n\t\t<div *ngIf=\"showDefaultError('min')\">{{substituteParameters(getErrorMessage(\"min\"), {min: attachedControl.errors.min.min})}}</div>\n\t\t<div *ngIf=\"showDefaultError('max')\">{{substituteParameters(getErrorMessage(\"max\"), {max: attachedControl.errors.max.max})}}</div>\n\t\t<div *ngIf=\"showDefaultError('required')\">{{getErrorMessage(\"required\")}}</div>\n\t\t<div *ngIf=\"showDefaultError('email')\">{{getErrorMessage(\"email\")}}</div>\n\t\t<div *ngIf=\"showDefaultError('minlength')\">{{substituteParameters(getErrorMessage(\"minLength\"), {minLength: attachedControl.errors.minlength.requiredLength})}}</div>\n\t\t<div *ngIf=\"showDefaultError('maxlength')\">{{substituteParameters(getErrorMessage(\"maxLength\"), {maxLength: attachedControl.errors.maxlength.requiredLength})}}</div>\n\t\t<div *ngIf=\"showDefaultError('pattern')\">{{getErrorMessage(\"pattern\")}}</div>\n\t\t<div *ngIf=\"showDefaultError('MatchPassword')\">{{getErrorMessage(\"matchPassword\")}}</div>\n\t\t<div *ngIf=\"showDefaultError('date')\">{{getErrorMessage(\"date\")}}</div>\n\t\t<div *ngIf=\"showDefaultError('message')\">{{attachedControl.errors.message.value}}</div>\n\t\t<div *ngIf=\"showDefaultError('formLevel')\">{{getErrorMessage(\"formLevel\")}}</div>\n\t\t<div [ngTemplateOutlet]=\"getCustomErrorHandler(getErrorToShow())?.templateRef\"></div>\n\t</div>\n</ng-template>\n\n<ng-template #tailTpl>\n\t<div class=\"errorTooltipContainer\" [ngClass]=\"{alwaysOpen: shouldShowErrorTooltipOpened()}\">\n\t\t<ng-container *ngIf=\"hasHoverableErrorTooltip() || shouldShowErrorTooltipOpened()\">\n\t\t\t<div class=\"errorTooltipTriangle\"></div>\n\t\t\t<div class=\"errorTooltipTriangleWhite\"></div>\n\n\t\t\t<div class=\"absoluteAnchor\" #absoluteAnchor></div>\n\t\t\t<div class=\"fixedAnchor\" #fixedAnchor [onRenderFn]=\"setErrorTooltipOffset\"></div>\n\t\t\t<div class=\"fixedWrapper\" #fixedWrapper>\n\t\t\t\t<div class=\"errorTooltip\" [ngClass]=\"{noPointerEvents: !shouldShowErrorTooltipOpened()}\">\n\t\t\t\t\t<div class=\"errorTooltipInner\">\n\t\t\t\t\t\t<i class=\"closeBtn\" (click)=\"closePopup();\">\u00D7</i>\n\t\t\t\t\t\t<ng-container *ngIf=\"getErrorToShow()\" [ngTemplateOutlet]=\"errorRef\"></ng-container>\n\t\t\t\t\t\t<div *ngIf=\"!getErrorToShow() && shouldShowWarningPopup()\">\n\t\t\t\t\t\t\t<ng-container *ngIf=\"getWarningToShowIsTemplateRef()\" [ngTemplateOutlet]=\"getWarningToShowAsTemplateRef()\"></ng-container>\n\t\t\t\t\t\t\t<span *ngIf=\"!getWarningToShowIsTemplateRef()\">{{getWarningToShow()}}</span>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</div>\n\n\t\t</ng-container>\n\t\t<klp-form-warning-icon variant=\"fill\" *ngIf=\"getErrorToShow()\" (click)=\"togglePopup()\"></klp-form-warning-icon>\n\t\t<klp-form-warning-icon variant=\"line\" *ngIf=\"!getErrorToShow() && getWarningToShow()\" (click)=\"togglePopup()\"></klp-form-warning-icon>\n\t</div>\n</ng-template>\n", styles: [":host{display:block}.componentContainer:not(.hasCaption) .captionInputAndError{display:block}.componentContainer:not(.hasCaption) .captionInputAndError .inputContainer{margin-top:0;padding-left:0;max-width:initial}.componentContainer:not(.hasCaption) .errorContainer{padding-left:0}.componentContainer.hasCaption .errorAboveInputContainer .spacer{display:block}.componentContainer.reverseOrder .captionInputAndError{flex-direction:row-reverse;justify-content:flex-end}.componentContainer.vertical .captionInputAndError{display:block}.componentContainer.vertical .captionInputAndError .inputContainer{margin-top:.3125rem}.componentContainer.vertical .captionInputAndError .errorContainer{margin-left:0}.componentContainer.topAlignment .captionInputAndError{align-items:flex-start}.componentContainer.horizontal.hasCaption .inputContainer,.componentContainer.horizontal.hasCaption .errorAboveInputContainer .errorContainer{padding-left:1rem}.componentContainer.horizontal.hasCaption.d40-60 .errorAboveInputContainer .spacer{flex:0 1 40%}.componentContainer.horizontal.hasCaption.d40-60 .errorAboveInputContainer .errorContainer{flex:60 1 0px}.componentContainer.horizontal.hasCaption.d40-60 .caption{max-width:40%;flex:40 1 0px}.componentContainer.horizontal.hasCaption.d40-60 .inputContainer{max-width:60%;flex:60 1 0px}.componentContainer.horizontal.hasCaption.d34-66 .errorAboveInputContainer .spacer{flex:0 1 34%}.componentContainer.horizontal.hasCaption.d34-66 .errorAboveInputContainer .errorContainer{flex:66 1 0px}.componentContainer.horizontal.hasCaption.d34-66 .caption{max-width:34%;flex:34 1 0px}.componentContainer.horizontal.hasCaption.d34-66 .inputContainer{max-width:66%;flex:66 1 0px}.componentContainer.horizontal.hasCaption.d30-70 .errorAboveInputContainer .spacer{flex:0 1 30%}.componentContainer.horizontal.hasCaption.d30-70 .errorAboveInputContainer .errorContainer{flex:70 1 0px}.componentContainer.horizontal.hasCaption.d30-70 .caption{max-width:30%;flex:30 1 0px}.componentContainer.horizontal.hasCaption.d30-70 .inputContainer{max-width:70%;flex:70 1 0px}.componentContainer.fixedInputWidth .caption{flex:1 1 0px;overflow:hidden}.componentContainer.fixedInputWidth .inputContainer{flex:0 0 auto}.captionInputAndError{display:flex;align-items:center;min-height:42px}.errorAboveInputContainer{display:flex}.errorAboveInputContainer .spacer{display:none}.captionDummyForSpaceCalculation .caption.withErrorRightOfCaption{height:0px;overflow:hidden}.captionDummyForSpaceCalculation .caption.withErrorRightOfCaption .rightOfCaptionError{display:block}.captionRefContainer{display:flex}.caption{font-weight:700;flex:0 0 auto;color:#515365}.caption.percentageSpacing{max-width:40%;flex:40 1 0px}.caption.percentageSpacing.d30-70{max-width:30%;flex:30 1 0px}.caption.percentageSpacing.d34-66{max-width:34%;flex:34 1 0px}.caption.withErrorRightOfCaption{display:flex;justify-content:space-between;gap:1rem}.caption.withErrorRightOfCaption .captionText{flex:1 2 auto;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.caption.withErrorRightOfCaption .rightOfCaptionError{display:none;max-width:40%;font-weight:400;overflow:hidden;flex:1 0 auto;text-align:right}.caption.withErrorRightOfCaption .rightOfCaptionError.errorFullyVisible{display:block}.caption.withErrorRightOfCaption .rightOfCaptionError ::ng-deep *{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.inputContainer{position:relative;flex:1}.inputContainer .errorTooltipContainer{position:relative}.inputContainer .errorTooltipContainer.alwaysOpen .errorTooltipTriangle,.inputContainer .errorTooltipContainer.alwaysOpen .errorTooltipTriangleWhite,.inputContainer .errorTooltipContainer.alwaysOpen .errorTooltip{display:flex}.inputContainer .errorTooltipContainer.alwaysOpen .closeBtn{display:block}.inputContainer .errorTooltipContainer.alwaysOpen .errorTooltipInner{padding-right:1.4rem}.inputContainer .errorTooltipContainer klp-form-warning-icon{cursor:pointer}.inputContainer .errorTooltipContainer .absoluteAnchor{position:absolute}.inputContainer .errorTooltipContainer .fixedAnchor,.inputContainer .errorTooltipContainer .fixedWrapper{position:fixed}.inputContainer .errorTooltipTriangle{display:none;z-index:1;position:absolute;right:0;transform:translate(-.15rem,calc(-100% - .1rem)) scaleX(.8);width:0px;height:0px;border-left:8px solid transparent;border-right:8px solid transparent;border-top:8px solid rgba(0,0,0,.13)}.inputContainer .errorTooltipTriangleWhite{display:none;z-index:3;position:absolute;right:0;transform:translate(-.15rem,calc(-100% - .1rem - 2px)) scaleX(.8);width:0px;height:0px;border-left:8px solid transparent;border-right:8px solid transparent;border-top:8px solid white}.inputContainer .errorTooltip{display:none;justify-content:flex-end;position:absolute;top:-.6rem;right:-1.875rem;transform:translateY(-100%);width:20rem}.inputContainer .errorTooltip.noPointerEvents{pointer-events:none}.inputContainer .errorTooltip .closeBtn{display:none;position:absolute;top:.2rem;right:.2rem;padding:.2rem .4rem;cursor:pointer;color:#666;font-size:1rem}.inputContainer .errorTooltip .closeBtn:hover{color:#515365}.inputContainer .errorTooltipInner{background:white;padding:.4rem .6rem;border-radius:.4rem;border:1px solid rgba(0,0,0,.13);box-shadow:#00000021 2px 3px 10px}.inputContainer:hover .errorTooltipContainer .errorTooltip,.inputContainer:hover .errorTooltipContainer .errorTooltipTriangle,.inputContainer:hover .errorTooltipContainer .errorTooltipTriangleWhite{display:flex}.errorContainer{color:#ff8000}\n"] }]
747
779
  }], ctorParameters: function () {
748
780
  return [{ type: FormComponent, decorators: [{
749
781
  type: Optional
@@ -2457,13 +2489,17 @@ const colors = {
2457
2489
  };
2458
2490
  class WithTooltipDirective {
2459
2491
  constructor(el) {
2492
+ this.el = el;
2460
2493
  this.klpWithTooltip = 'orange';
2461
2494
  el.nativeElement.addEventListener('mouseenter', () => {
2462
- const textToDisplay = this.tooltipText || el.nativeElement.innerText.trim();
2495
+ let textToDisplay;
2496
+ if (!this.templateInstance) {
2497
+ textToDisplay = this.tooltipText || el.nativeElement.innerText.trim();
2498
+ }
2463
2499
  if (!stringIsSetAndFilled(this.klpWithTooltip)) {
2464
2500
  return;
2465
2501
  }
2466
- if (textToDisplay.length < 1) {
2502
+ if (!stringIsSetAndFilled(textToDisplay) && !this.tooltipTemplate) {
2467
2503
  return;
2468
2504
  }
2469
2505
  if (stringIsSetAndFilled(this.tooltipText)) {
@@ -2471,6 +2507,9 @@ class WithTooltipDirective {
2471
2507
  return;
2472
2508
  }
2473
2509
  }
2510
+ else if (this.tooltipTemplate) {
2511
+ // no need to check here, just render the template
2512
+ }
2474
2513
  else {
2475
2514
  if (el.nativeElement.offsetWidth >= el.nativeElement.scrollWidth) {
2476
2515
  return;
@@ -2494,7 +2533,18 @@ class WithTooltipDirective {
2494
2533
  this.div.style.padding = '0.3rem 0.5rem';
2495
2534
  this.div.style.boxSizing = 'border-box';
2496
2535
  this.div.style.borderRadius = '3px';
2497
- this.div.textContent = textToDisplay;
2536
+ if (stringIsSetAndFilled(textToDisplay)) {
2537
+ this.div.textContent = textToDisplay;
2538
+ }
2539
+ else if (this.templateInstance) {
2540
+ this.div.style.visibility = 'hidden';
2541
+ this.div.appendChild(this.templateInstance);
2542
+ setTimeout(() => {
2543
+ const color = getComputedStyle(this.templateInstance).backgroundColor || getComputedStyle(this.templateInstance).background;
2544
+ this.div.style.backgroundColor = color;
2545
+ this.div.style.visibility = 'visible';
2546
+ });
2547
+ }
2498
2548
  el.nativeElement.prepend(this.div);
2499
2549
  this.triangle = document.createElement('div');
2500
2550
  this.triangle.style.zIndex = `${zIndexStart + 1}`;
@@ -2518,7 +2568,17 @@ class WithTooltipDirective {
2518
2568
  this.triangleWhite.style.height = '0';
2519
2569
  this.triangleWhite.style.borderLeft = `${triangleSize} solid transparent`;
2520
2570
  this.triangleWhite.style.borderRight = `${triangleSize} solid transparent`;
2521
- this.triangleWhite.style.borderTop = `${triangleSize} solid white`;
2571
+ if (stringIsSetAndFilled(textToDisplay)) {
2572
+ this.triangleWhite.style.borderTop = `${triangleSize} solid white`;
2573
+ }
2574
+ else if (this.templateInstance) {
2575
+ this.div.style.visibility = 'hidden';
2576
+ setTimeout(() => {
2577
+ const color = getComputedStyle(this.templateInstance).backgroundColor || getComputedStyle(this.templateInstance).background;
2578
+ this.triangleWhite.style.borderTop = `${triangleSize} solid ${color}`;
2579
+ this.div.style.visibility = 'visible';
2580
+ });
2581
+ }
2522
2582
  el.nativeElement.prepend(this.triangleWhite);
2523
2583
  });
2524
2584
  el.nativeElement.addEventListener('mouseleave', () => {
@@ -2536,9 +2596,16 @@ class WithTooltipDirective {
2536
2596
  catch (ex) { }
2537
2597
  });
2538
2598
  }
2599
+ ngOnChanges(simpleChanges) {
2600
+ var _a;
2601
+ if ((_a = simpleChanges.tooltipTemplate) === null || _a === void 0 ? void 0 : _a.currentValue) {
2602
+ const viewRef = this.tooltipTemplate.createEmbeddedView(null);
2603
+ this.templateInstance = viewRef.rootNodes[0];
2604
+ }
2605
+ }
2539
2606
  }
2540
2607
  WithTooltipDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.8", ngImport: i0, type: WithTooltipDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
2541
- WithTooltipDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.2.8", type: WithTooltipDirective, selector: "[klpWithTooltip]", inputs: { klpWithTooltip: "klpWithTooltip", tooltipText: "tooltipText" }, ngImport: i0 });
2608
+ WithTooltipDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.2.8", type: WithTooltipDirective, selector: "[klpWithTooltip]", inputs: { klpWithTooltip: "klpWithTooltip", tooltipText: "tooltipText", tooltipTemplate: "tooltipTemplate" }, usesOnChanges: true, ngImport: i0 });
2542
2609
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.8", ngImport: i0, type: WithTooltipDirective, decorators: [{
2543
2610
  type: Directive,
2544
2611
  args: [{
@@ -2548,6 +2615,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.8", ngImpor
2548
2615
  type: Input
2549
2616
  }], tooltipText: [{
2550
2617
  type: Input
2618
+ }], tooltipTemplate: [{
2619
+ type: Input
2551
2620
  }] } });
2552
2621
 
2553
2622
  class NgxEnhancyFormsModule {