@colijnit/corecomponents_v12 12.2.11 → 12.2.12

package/bundles/colijnit-corecomponents_v12.umd.js

@@ -4959,7 +4959,7 @@
     CoDialogComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: 'co-dialog',
-                    template: "\n        <div class=\"co-dialog-overlay\" (click)=\"handleOverlayClick($event)\"></div>\n        <div class=\"co-dialog-placeholder\">\n            <div class=\"co-dialog-wrapper\" [ngClass]=\"customCssClass ? customCssClass : undefined\" @showHideDialog cdkDrag>\n                <div class=\"dialog-header\" *ngIf=\"!borderless\" cdkDragHandle>\n                    <div class=\"dialog-header-caption\" *ngIf=\"headerTemplate\">\n                        <ng-container [ngTemplateOutlet]=\"headerTemplate\"></ng-container>\n                    </div>\n                    <div class=\"dialog-close-button\" *ngIf=\"showCloseIcon\" (click)=\"handleCloseDialog($event)\">\n                        <co-icon [icon]=\"icons.CrossSkinny\"></co-icon>\n                    </div>\n                </div>\n                <div class=\"dialog-content co-small-scrollbar\" [ngClass]=\"customCssClass ? customCssClass : undefined\">\n                    <ng-content></ng-content>\n                </div>\n                <div class=\"dialog-footer\" *ngIf=\"footerTemplate\">\n                    <ng-container [ngTemplateOutlet]=\"footerTemplate\"></ng-container>\n                </div>\n            </div>\n        </div>\n    ",
+                    template: "\n        <div class=\"co-dialog-overlay\" (click)=\"handleOverlayClick($event)\"></div>\n        <div class=\"co-dialog-placeholder\">\n            <div class=\"co-dialog-wrapper\" [ngClass]=\"customCssClass ? customCssClass : undefined\" @showHideDialog cdkDrag>\n                <div *ngIf=\"!borderless\" class=\"dialog-drag-handle\" cdkDragHandle></div>\n                <div class=\"dialog-header\" *ngIf=\"!borderless\">\n                    <div class=\"dialog-header-caption\" *ngIf=\"headerTemplate\">\n                        <ng-container [ngTemplateOutlet]=\"headerTemplate\"></ng-container>\n                    </div>\n                    <div class=\"dialog-close-button\" *ngIf=\"showCloseIcon\" (click)=\"handleCloseDialog($event)\">\n                        <co-icon [icon]=\"icons.CrossSkinny\"></co-icon>\n                    </div>\n                </div>\n                <div class=\"dialog-content co-small-scrollbar\" [ngClass]=\"customCssClass ? customCssClass : undefined\">\n                    <ng-content></ng-content>\n                </div>\n                <div class=\"dialog-footer\" *ngIf=\"footerTemplate\">\n                    <ng-container [ngTemplateOutlet]=\"footerTemplate\"></ng-container>\n                </div>\n            </div>\n        </div>\n    ",
                     animations: [
                         animations.trigger('showHideCoDialog', [
                             animations.transition('void => *', [
@@ -5980,6 +5980,25 @@
         showClass: [{ type: i0.HostBinding, args: ['class.co-input-date',] }]
     };
 
+    var OverlayParentDirective = /** @class */ (function () {
+        function OverlayParentDirective(elementRef) {
+            this.elementRef = elementRef;
+        }
+        OverlayParentDirective.prototype.ngOnDestroy = function () {
+            this.elementRef = undefined;
+        };
+        return OverlayParentDirective;
+    }());
+    OverlayParentDirective.decorators = [
+        { type: i0.Directive, args: [{
+                    selector: '[overlayParent]',
+                    exportAs: 'overlayParent'
+                },] }
+    ];
+    OverlayParentDirective.ctorParameters = function () { return [
+        { type: i0.ElementRef }
+    ]; };
+
     var OverlayDirective = /** @class */ (function () {
         function OverlayDirective(elementRef) {
             var _this = this;
@@ -6000,7 +6019,15 @@
         Object.defineProperty(OverlayDirective.prototype, "parent", {
             set: function (value) {
                 if (value) {
-                    this._parent = value instanceof i0.ElementRef ? value : value.elementRef;
+                    if (value instanceof i0.ElementRef) {
+                        this._parent = value.nativeElement;
+                    }
+                    else if (value instanceof OverlayParentDirective) {
+                        this._parent = value.elementRef.nativeElement;
+                    }
+                    else {
+                        this._parent = value;
+                    }
                 }
                 else {
                     if (this._parent && this._resizeObserver) {
@@ -6045,14 +6072,14 @@
                 root: null
             });
             if (this._parent) {
-                this._intersectionObserver.observe(this._parent.nativeElement); // observe parent for visibility
+                this._intersectionObserver.observe(this._parent); // observe parent for visibility
             }
             this._resizeObserver.observe(document.body);
         };
         OverlayDirective.prototype._checkAndPlaceElement = function () {
-            if (this._elementRef && this._elementRef.nativeElement && this._parent && this._parent.nativeElement) {
+            if (this._elementRef && this._elementRef.nativeElement && this._parent) {
                 var elementRect = this._elementRef.nativeElement.getBoundingClientRect();
-                var parentBoundingRect = this._parent.nativeElement.getBoundingClientRect();
+                var parentBoundingRect = this._parent.getBoundingClientRect();
                 var parentRect = {};
                 if (!this.inline) {
                     parentRect = {
@@ -6065,10 +6092,10 @@
                 }
                 else {
                     parentRect = {
-                        bottom: this._parent.nativeElement.offsetTop + parentBoundingRect.height,
-                        right: this._parent.nativeElement.offsetLeft + parentBoundingRect.width,
-                        left: this._parent.nativeElement.offsetLeft,
-                        top: this._parent.nativeElement.offsetTop,
+                        bottom: this._parent.offsetTop + parentBoundingRect.height,
+                        right: this._parent.offsetLeft + parentBoundingRect.width,
+                        left: this._parent.offsetLeft,
+                        top: this._parent.offsetTop,
                         width: parentBoundingRect.width
                     };
                 }
@@ -6132,25 +6159,6 @@
         fullSize: [{ type: i0.Input }]
     };
 
-    var OverlayParentDirective = /** @class */ (function () {
-        function OverlayParentDirective(elementRef) {
-            this.elementRef = elementRef;
-        }
-        OverlayParentDirective.prototype.ngOnDestroy = function () {
-            this.elementRef = undefined;
-        };
-        return OverlayParentDirective;
-    }());
-    OverlayParentDirective.decorators = [
-        { type: i0.Directive, args: [{
-                    selector: '[overlayParent]',
-                    exportAs: 'overlayParent'
-                },] }
-    ];
-    OverlayParentDirective.ctorParameters = function () { return [
-        { type: i0.ElementRef }
-    ]; };
-
     var OverlayModule = /** @class */ (function () {
         function OverlayModule() {
         }
@@ -7238,6 +7246,12 @@
         InputDateRangePickerComponent.prototype.showClass = function () {
             return true;
         };
+        InputDateRangePickerComponent.prototype.handleFirstInputClick = function (event) {
+            event.stopPropagation();
+        };
+        InputDateRangePickerComponent.prototype.handleSecondInputClick = function (event) {
+            event.stopPropagation();
+        };
         InputDateRangePickerComponent.prototype.handleDatesSelected = function (dates) {
             this.setModel(dates);
         };
@@ -7313,7 +7327,7 @@
     InputDateRangePickerComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: 'co-input-date-range',
-                    template: "\n      <div class=\"inputs-wrapper\" overlayParent #parentForOverlay=\"overlayParent\">\n        <co-input-text class=\"no-focus-line custom-height\"\n                       [(model)]=\"firstDateAsString\"\n                       [noClickFocus]=\"true\"\n                       [pattern]=\"'yyyy-MM-dd'\"\n                       [type]=\"'date'\"\n                       [leftIcon]=\"leftIcon\"\n                       [leftIconData]=\"leftIconData\"\n                       [placeholder]=\"placeholder\"\n                       (blur)=\"handleFirstDateChanged(firstDateAsString)\"\n                       (clearIconClick)=\"clearDate(0)\"\n        ></co-input-text>\n        <co-input-text class=\"no-focus-line custom-height\"\n                       [(model)]= \"secondDateAsString\"\n                       [noClickFocus]=\"true\"\n                       [pattern]=\"'yyyy-MM-dd'\"\n                       [type]=\"'date'\"\n                       [rightIcon]=\"rightIcon\"\n                       (rightIconClick)=\"toggleCalendar()\"\n                       (blur)=\"handleSecondDateChanged(secondDateAsString)\"\n                       (clearIconClick)=\"clearDate(1)\"\n        ></co-input-text>\n      </div>\n    ",
+                    template: "\n      <div class=\"inputs-wrapper\" overlayParent #parentForOverlay=\"overlayParent\">\n        <co-input-text #firstInput class=\"no-focus-line custom-height\"\n                       [(model)]=\"firstDateAsString\"\n                       [noClickFocus]=\"true\"\n                       [pattern]=\"'yyyy-MM-dd'\"\n                       [type]=\"'date'\"\n                       [leftIcon]=\"leftIcon\"\n                       [leftIconData]=\"leftIconData\"\n                       [placeholder]=\"placeholder\"\n                       (blur)=\"handleFirstDateChanged(firstDateAsString)\"\n                       (clearIconClick)=\"clearDate(0)\"\n                       (click)=\"handleFirstInputClick($event)\"\n        ></co-input-text>\n        <co-input-text #secondInput class=\"no-focus-line custom-height\"\n                       [(model)]= \"secondDateAsString\"\n                       [noClickFocus]=\"true\"\n                       [pattern]=\"'yyyy-MM-dd'\"\n                       [type]=\"'date'\"\n                       [rightIcon]=\"rightIcon\"\n                       (rightIconClick)=\"toggleCalendar()\"\n                       (blur)=\"handleSecondDateChanged(secondDateAsString)\"\n                       (clearIconClick)=\"clearDate(1)\"\n                       (click)=\"handleSecondInputClick($event)\"\n        ></co-input-text>\n      </div>\n    ",
                     providers: [
                         OverlayService,
                         {
@@ -7328,6 +7342,8 @@
                 },] }
     ];
     InputDateRangePickerComponent.propDecorators = {
+        firstInput: [{ type: i0.ViewChild, args: ['firstInput',] }],
+        secondInput: [{ type: i0.ViewChild, args: ['secondInput',] }],
         showClass: [{ type: i0.HostBinding, args: ['class.co-input-date-range',] }]
     };