@klippa/ngx-enhancy-forms 14.22.0 → 14.22.2

package/fesm2020/klippa-ngx-enhancy-forms.mjs

@@ -2425,8 +2425,9 @@ const colors = {
     black: { noAlpha: 'rgb(40, 40, 40)', withAlpha: 'rgba(40, 40, 40, 0.1254901961)' },
 };
 class WithTooltipDirective {
-    constructor(el) {
+    constructor(el, appRef) {
         this.el = el;
+        this.appRef = appRef;
         this.klpWithTooltip = 'orange';
         el.nativeElement.addEventListener('mouseenter', () => {
             let textToDisplay;
@@ -2474,6 +2475,7 @@ class WithTooltipDirective {
                 this.div.textContent = textToDisplay;
             }
             else if (this.templateInstance) {
+                this.div.style.maxWidth = 'none';
                 this.div.style.visibility = 'hidden';
                 this.div.appendChild(this.templateInstance);
                 setTimeout(() => {
@@ -2536,18 +2538,19 @@ class WithTooltipDirective {
     ngOnChanges(simpleChanges) {
         if (simpleChanges.tooltipTemplate?.currentValue) {
             const viewRef = this.tooltipTemplate.createEmbeddedView(null);
+            this.appRef.attachView(viewRef);
             this.templateInstance = viewRef.rootNodes[0];
         }
     }
 }
-WithTooltipDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.8", ngImport: i0, type: WithTooltipDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
+WithTooltipDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.8", ngImport: i0, type: WithTooltipDirective, deps: [{ token: i0.ElementRef }, { token: i0.ApplicationRef }], target: i0.ɵɵFactoryTarget.Directive });
 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 });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.8", ngImport: i0, type: WithTooltipDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[klpWithTooltip]'
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { klpWithTooltip: [{
+        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ApplicationRef }]; }, propDecorators: { klpWithTooltip: [{
                 type: Input
             }], tooltipText: [{
                 type: Input