@colijnit/corecomponents_v12 12.0.98 → 12.0.99

package/bundles/colijnit-corecomponents_v12.umd.js

@@ -10784,10 +10784,9 @@
     var ObserveVisibilityDirective = /** @class */ (function () {
         function ObserveVisibilityDirective(_element) {
             this._element = _element;
-            this.debounceTime = 0;
             this.threshold = 0;
-            this.visible = new i0.EventEmitter();
-            this._subject = new rxjs.Subject();
+            this.visibilityChange = new i0.EventEmitter();
+            this.visible = false;
         }
         ObserveVisibilityDirective.prototype.ngOnInit = function () {
             this._createObserver();
@@ -10800,19 +10799,6 @@
                 this._observer.disconnect();
                 this._observer = undefined;
             }
-            this._subject.next();
-            this._subject.complete();
-        };
-        ObserveVisibilityDirective.prototype._isVisible = function (element) {
-            var _this = this;
-            return new Promise(function (resolve) {
-                var observer = new IntersectionObserver(function (_a) {
-                    var _b = __read(_a, 1), entry = _b[0];
-                    resolve(entry.isIntersecting && entry.intersectionRatio >= _this.threshold);
-                    observer.disconnect();
-                });
-                observer.observe(element);
-            });
         };
         ObserveVisibilityDirective.prototype._createObserver = function () {
             var _this = this;
@@ -10820,58 +10806,33 @@
                 rootMargin: '0px',
                 threshold: this.threshold,
             };
-            var isIntersecting = function (entry) { return entry.isIntersecting || entry.intersectionRatio > 0; };
             this._observer = new IntersectionObserver(function (entries, observer) {
                 entries.forEach(function (entry) {
-                    if (isIntersecting(entry)) {
-                        _this._subject.next({ entry: entry, observer: observer });
-                    }
+                    _this.visible = entry.isIntersecting || entry.intersectionRatio > 0;
+                    _this.visibilityChange.emit(_this.visible);
                 });
             }, options);
         };
         ObserveVisibilityDirective.prototype._startObservingElements = function () {
-            var _this = this;
             if (!this._observer) {
                 return;
             }
             this._observer.observe(this._element.nativeElement);
-            this._subject
-                .pipe(operators.delay(this.debounceTime), operators.filter(Boolean))
-                .subscribe(function (_a) {
-                var entry = _a.entry, observer = _a.observer;
-                return __awaiter(_this, void 0, void 0, function () {
-                    var target, isStillVisible;
-                    return __generator(this, function (_a) {
-                        switch (_a.label) {
-                            case 0:
-                                target = entry.target;
-                                return [4 /*yield*/, this._isVisible(target)];
-                            case 1:
-                                isStillVisible = _a.sent();
-                                if (isStillVisible) {
-                                    this.visible.emit(target);
-                                    observer.unobserve(target);
-                                }
-                                return [2 /*return*/];
-                        }
-                    });
-                });
-            });
         };
         return ObserveVisibilityDirective;
     }());
     ObserveVisibilityDirective.decorators = [
         { type: i0.Directive, args: [{
                     selector: '[observeVisibility]',
+                    exportAs: 'visibilityObserve'
                 },] }
     ];
     ObserveVisibilityDirective.ctorParameters = function () { return [
         { type: i0.ElementRef }
     ]; };
     ObserveVisibilityDirective.propDecorators = {
-        debounceTime: [{ type: i0.Input }],
         threshold: [{ type: i0.Input }],
-        visible: [{ type: i0.Output }]
+        visibilityChange: [{ type: i0.Output }]
     };
 
     var ObserveVisibilityModule = /** @class */ (function () {
@@ -11162,7 +11123,8 @@
         { type: i0.Component, args: [{
                     selector: "co-filter-item",
                     template: "\n    <div class=\"co-filter-item-header\">\n      <co-collapsible\n        [headerTitle]=\"placeholder\"\n        [expandButtonLast]=\"true\"\n        [iconData]=\"iconService.getIcon(icons.ArrowPointDown)\"\n        [expanded]=\"expanded\"\n        [showButton]=\"showButton\"\n        [buttonText]=\"filterButtonLabel\"\n        (buttonClicked)=\"onButtonClicked()\"\n      >\n        <div class=\"co-filter-item-collapsable-content\">\n          <div class=\"co-filter-item-custom-content\" *ngIf=\"customContent; else collectionContent\"\n               (keydown)=\"showButton=true\" (mousedown)=\"showButton=true\">\n            <ng-content></ng-content>\n          </div>\n          <ng-template #collectionContent>\n            <div class=\"co-filter-item-collection-content\">\n              <co-input-text\n                *ngIf=\"collection?.length > 10 || minSearchCharsToLoadCollection\"\n                [placeholder]=\"searchPlaceholder\"\n                [model]=\"filterText\"\n                (modelChange)=\"applyFilter($event)\"\n              >\n              </co-input-text>\n              <div class=\"no-results\" *ngIf=\"filteredCollection?.length === 0\">\n                <span [textContent]=\"noResultsLabel\"></span>\n              </div>\n              <div class=\"co-filter-item-collection-results\">\n                <ng-container\n                  *ngFor=\"let option of filteredCollection; let index = index\">\n                  <div class=\"co-filter-item-collection-result-item\" *ngIf=\"index < limitTo || showAllResults\">\n                    <co-input-checkbox *ngIf=\"!singleSelect\"\n                                       [label]=\"option.description\"\n                                       [model]=\"option.checked\"\n                                       [clickableLabel]=\"false\"\n                                       (modelChange)=\"handleModelChange(option)\"\n                    ></co-input-checkbox>\n                    <co-input-radio-button *ngIf=\"singleSelect\"\n                                           [label]=\"option.description\"\n                                           [model]=\"option.checked\"\n                                           (modelChange)=\"handleModelChange(option)\"\n                    ></co-input-radio-button>\n                    <div class=\"co-filter-item-amount\" *ngIf=\"option.count\"\n                         [textContent]=\"option.count.toString() | append: ')' | prepend: '      ('\"\n                    ></div>\n                  </div>\n\n                </ng-container>\n              </div>\n              <div class=\"co-filter-show-more-or-less\" *ngIf=\"!showAllResults\">\n                <div class=\"co-filter-show-more clickable\"\n                     *ngIf=\"moreToShow()\">\n                  <a (click)=\"increaseLimit()\">\n                    <co-icon [iconData]=\"iconService.getIcon(icons.ArrowPointDown)\"></co-icon>\n                    <span [textContent]=\"showMoreLabel\"></span>\n                  </a>\n                </div>\n                <div class=\"co-filter-show-less clickable\"\n                     *ngIf=\"lessToShow()\">\n                  <a (click)=\"setToInitialLimit()\">\n                    <co-icon [iconData]=\"iconService.getIcon(icons.ArrowPointUp)\"></co-icon>\n                    <span [textContent]=\"showLessLabel\"></span>\n                  </a>\n                </div>\n              </div>\n            </div>\n          </ng-template>\n        </div>\n      </co-collapsible>\n    </div>\n\n  ",
-                    encapsulation: i0.ViewEncapsulation.None
+                    encapsulation: i0.ViewEncapsulation.None,
+                    changeDetection: i0.ChangeDetectionStrategy.OnPush
                 },] }
     ];
     FilterItemComponent.ctorParameters = function () { return [