@colijnit/corecomponents_v12 256.1.7 → 256.1.8

package/bundles/colijnit-corecomponents_v12.umd.js

@@ -13402,9 +13402,11 @@
     }
 
     var TooltipComponent = /** @class */ (function () {
-        function TooltipComponent(_elementRef, _changeDetector) {
+        function TooltipComponent(_elementRef, _changeDetector, _renderer) {
             this._elementRef = _elementRef;
             this._changeDetector = _changeDetector;
+            this._renderer = _renderer;
+            this.tooltipClosed = new i0.EventEmitter();
             this.top = -100;
             this.left = -100;
             this.bottom = false;
@@ -13429,6 +13431,17 @@
             setTimeout(function () {
                 _this._positionTooltip();
             });
+            this._documentClickListener = this._renderer.listen('document', 'click', function (event) {
+                if (!_this._elementRef.nativeElement.contains(event.target)) {
+                    _this.closeTooltip();
+                }
+            });
+        };
+        TooltipComponent.prototype.ngOnDestroy = function () {
+            // Remove the click listener to prevent memory leaks
+            if (this._documentClickListener) {
+                this._documentClickListener();
+            }
         };
         TooltipComponent.prototype._positionTooltip = function () {
             if (this.hostElement && this._elementRef && this._elementRef.nativeElement) {
@@ -13449,6 +13462,9 @@
                 this._changeDetector.detectChanges();
             }
         };
+        TooltipComponent.prototype.closeTooltip = function () {
+            this.tooltipClosed.emit();
+        };
         return TooltipComponent;
     }());
     TooltipComponent.decorators = [
@@ -13468,11 +13484,13 @@
     ];
     TooltipComponent.ctorParameters = function () { return [
         { type: i0.ElementRef },
-        { type: i0.ChangeDetectorRef }
+        { type: i0.ChangeDetectorRef },
+        { type: i0.Renderer2 }
     ]; };
     TooltipComponent.propDecorators = {
         hostElement: [{ type: i0.Input }],
         toolTip: [{ type: i0.Input }],
+        tooltipClosed: [{ type: i0.Output }],
         showClass: [{ type: i0.HostBinding, args: ['class.co-tooltip',] }],
         top: [{ type: i0.HostBinding, args: ["style.top.px",] }],
         left: [{ type: i0.HostBinding, args: ["style.left.px",] }],
@@ -14544,6 +14562,10 @@
         HourSchedulingExpandableComponent.prototype.allowDrop = function (event, hour) {
             event.preventDefault();
             event.stopPropagation();
+            var target = event.target;
+            if (!target.classList.contains('drag-over')) {
+                target.classList.add('drag-over');
+            }
             if (this.currentDraggingObject) {
                 var newStartDate_1 = this.convertDateToEuropean(this.currentDraggingObject.start);
                 var hourSplit = hour.split(":");
@@ -14557,6 +14579,12 @@
                 }
             }
         };
+        HourSchedulingExpandableComponent.prototype.handleDragLeave = function (event) {
+            var target = event.target;
+            if (target.classList.contains('drag-over')) {
+                target.classList.remove('drag-over');
+            }
+        };
         // Triggered when resizing starts
         HourSchedulingExpandableComponent.prototype.onResizeStart = function (event, obj, direction) {
             this.resizing = true;
@@ -14671,7 +14699,7 @@
     HourSchedulingExpandableComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: 'co-hour-scheduling-expandable',
-                    template: "\n    <div class=\"wrapper\">\n      <div class=\"time-block\" *ngFor=\"let hour of hourLabels\">\n        <div class=\"hour-label\"><span [textContent]=\"hour\"></span></div>\n\n        <div class=\"object-display\">\n          <div class=\"first-half-hour object-half\" (dragover)=\"allowDrop($event, hour)\"\n               (drop)=\"handleDrop($event, hour)\">\n          </div>\n\n          <div class=\"second-half-hour object-half\" (dragover)=\"allowDrop($event, addHalfHour(hour))\"\n               (drop)=\"handleDrop($event, addHalfHour(hour))\">\n          </div>\n        </div>\n      </div>\n\n      <div class=\"scheduled-objects\" >\n        <ng-container>\n          <ng-template\n            [ngTemplateOutlet]=\"customTemplate\"\n            [ngTemplateOutletContext]=\"{\n              objects: scheduledObjects,\n              onSelectBlock: this.onSelectBlock.bind(this),\n              onResizeStart: this.onResizeStart.bind(this),\n              onDragStartCustom: this.onDragStartCustom.bind(this)\n\n            }\"\n          >\n            <ng-content></ng-content>\n          </ng-template>\n        </ng-container>\n      </div>\n\n    </div>\n\n  ",
+                    template: "\n    <div class=\"wrapper\">\n      <div class=\"time-block\" *ngFor=\"let hour of hourLabels\">\n        <div class=\"hour-label\"><span [textContent]=\"hour\"></span></div>\n\n        <div class=\"object-display\">\n          <div class=\"first-half-hour object-half\"\n               (dragover)=\"allowDrop($event, hour)\"\n               (dragleave)=\"handleDragLeave($event)\"\n               (drop)=\"handleDrop($event, hour)\">\n          </div>\n\n          <div class=\"second-half-hour object-half\"\n               (dragover)=\"allowDrop($event, addHalfHour(hour))\"\n               (dragleave)=\"handleDragLeave($event)\"\n               (drop)=\"handleDrop($event, addHalfHour(hour))\">\n          </div>\n        </div>\n      </div>\n\n      <div class=\"scheduled-objects\" >\n        <ng-container>\n          <ng-template\n            [ngTemplateOutlet]=\"customTemplate\"\n            [ngTemplateOutletContext]=\"{\n              objects: scheduledObjects,\n              onSelectBlock: this.onSelectBlock.bind(this),\n              onResizeStart: this.onResizeStart.bind(this),\n              onDragStartCustom: this.onDragStartCustom.bind(this)\n\n            }\"\n          >\n            <ng-content></ng-content>\n          </ng-template>\n        </ng-container>\n      </div>\n\n    </div>\n\n  ",
                     changeDetection: i0.ChangeDetectionStrategy.OnPush,
                     encapsulation: i0.ViewEncapsulation.None
                 },] }