ng-mat-select-infinite-scroll/esm2020/lib/mat-select-infinite-scroll.directive.mjs

Adds missing infinite scroll functionality for the angular material select component

import { Directive, EventEmitter, Input, Output } from '@angular/core';
import { delay, takeUntil } from 'rxjs/operators';
import { InfiniteScrollService } from "./infinite-scroll.service";
import { Subject } from "rxjs";
import * as i0 from "@angular/core";
import * as i1 from "@angular/material/select";
import * as i2 from "./infinite-scroll.service";
/** The height of the select items in `em` units. */
const SELECT_ITEM_HEIGHT_EM = 3;
export class MatSelectInfiniteScrollDirective {
    constructor(matSelect, infiniteScrollService) {
        this.matSelect = matSelect;
        this.infiniteScrollService = infiniteScrollService;
        this.threshold = '15%';
        this.debounceTime = 150;
        this.infiniteScroll = new EventEmitter();
        this.destroyed$ = new Subject();
    }
    ngAfterViewInit() {
        this.matSelect.openedChange.pipe(
        //Wait for the panel to be rendered (https://github.com/angular/components/issues/30596)
        delay(0), takeUntil(this.destroyed$)).subscribe((opened) => {
            if (opened) {
                const panel = this.matSelect.panel.nativeElement;
                const selectItemHeightPx = this.getSelectItemHeightPx(panel);
                this.infiniteScrollService.initialize(panel, selectItemHeightPx, {
                    threshold: this.threshold,
                    debounceTime: this.debounceTime,
                    complete: this.complete
                });
                this.infiniteScrollService.registerScrollListener(() => this.infiniteScroll.emit());
            }
        });
    }
    getSelectItemHeightPx(panel) {
        return parseFloat(getComputedStyle(panel).fontSize) * SELECT_ITEM_HEIGHT_EM;
    }
    ngOnDestroy() {
        this.destroyed$.next(true);
        this.destroyed$.complete();
        this.infiniteScrollService.destroy();
    }
}
MatSelectInfiniteScrollDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MatSelectInfiniteScrollDirective, deps: [{ token: i1.MatSelect }, { token: i2.InfiniteScrollService }], target: i0.ɵɵFactoryTarget.Directive });
MatSelectInfiniteScrollDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: MatSelectInfiniteScrollDirective, selector: "[msInfiniteScroll]", inputs: { threshold: "threshold", debounceTime: "debounceTime", complete: "complete" }, outputs: { infiniteScroll: "infiniteScroll" }, providers: [InfiniteScrollService], ngImport: i0 });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MatSelectInfiniteScrollDirective, decorators: [{
            type: Directive,
            args: [{
                    selector: '[msInfiniteScroll]',
                    providers: [InfiniteScrollService]
                }]
        }], ctorParameters: function () { return [{ type: i1.MatSelect }, { type: i2.InfiniteScrollService }]; }, propDecorators: { threshold: [{
                type: Input
            }], debounceTime: [{
                type: Input
            }], complete: [{
                type: Input
            }], infiniteScroll: [{
                type: Output
            }] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibWF0LXNlbGVjdC1pbmZpbml0ZS1zY3JvbGwuZGlyZWN0aXZlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vcHJvamVjdHMvbmctbWF0LXNlbGVjdC1pbmZpbml0ZS1zY3JvbGwvc3JjL2xpYi9tYXQtc2VsZWN0LWluZmluaXRlLXNjcm9sbC5kaXJlY3RpdmUudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFnQixTQUFTLEVBQUUsWUFBWSxFQUFFLEtBQUssRUFBNkIsTUFBTSxFQUFDLE1BQU0sZUFBZSxDQUFDO0FBRS9HLE9BQU8sRUFBQyxLQUFLLEVBQUUsU0FBUyxFQUFDLE1BQU0sZ0JBQWdCLENBQUM7QUFDaEQsT0FBTyxFQUFDLHFCQUFxQixFQUFDLE1BQU0sMkJBQTJCLENBQUM7QUFDaEUsT0FBTyxFQUFDLE9BQU8sRUFBQyxNQUFNLE1BQU0sQ0FBQzs7OztBQUU3QixvREFBb0Q7QUFDcEQsTUFBTSxxQkFBcUIsR0FBRyxDQUFDLENBQUM7QUFNaEMsTUFBTSxPQUFPLGdDQUFnQztJQVN6QyxZQUFzQixTQUFvQixFQUFVLHFCQUE0QztRQUExRSxjQUFTLEdBQVQsU0FBUyxDQUFXO1FBQVUsMEJBQXFCLEdBQXJCLHFCQUFxQixDQUF1QjtRQVB2RixjQUFTLEdBQUcsS0FBSyxDQUFDO1FBQ2xCLGlCQUFZLEdBQUcsR0FBRyxDQUFDO1FBRWxCLG1CQUFjLEdBQUcsSUFBSSxZQUFZLEVBQVEsQ0FBQztRQUU1QyxlQUFVLEdBQUcsSUFBSSxPQUFPLEVBQVcsQ0FBQztJQUc1QyxDQUFDO0lBR0QsZUFBZTtRQUNYLElBQUksQ0FBQyxTQUFTLENBQUMsWUFBWSxDQUFDLElBQUk7UUFDNUIsd0ZBQXdGO1FBQ3hGLEtBQUssQ0FBQyxDQUFDLENBQUMsRUFDUixTQUFTLENBQUMsSUFBSSxDQUFDLFVBQVUsQ0FBQyxDQUM3QixDQUFDLFNBQVMsQ0FBQyxDQUFDLE1BQU0sRUFBRSxFQUFFO1lBQ25CLElBQUksTUFBTSxFQUFFO2dCQUNSLE1BQU0sS0FBSyxHQUFHLElBQUksQ0FBQyxTQUFTLENBQUMsS0FBSyxDQUFDLGFBQWEsQ0FBQztnQkFDakQsTUFBTSxrQkFBa0IsR0FBRyxJQUFJLENBQUMscUJBQXFCLENBQUMsS0FBSyxDQUFDLENBQUM7Z0JBQzdELElBQUksQ0FBQyxxQkFBcUIsQ0FBQyxVQUFVLENBQUMsS0FBSyxFQUFFLGtCQUFrQixFQUFFO29CQUM3RCxTQUFTLEVBQUUsSUFBSSxDQUFDLFNBQVM7b0JBQ3pCLFlBQVksRUFBRSxJQUFJLENBQUMsWUFBWTtvQkFDL0IsUUFBUSxFQUFFLElBQUksQ0FBQyxRQUFRO2lCQUMxQixDQUFDLENBQUM7Z0JBRUgsSUFBSSxDQUFDLHFCQUFxQixDQUFDLHNCQUFzQixDQUFDLEdBQUcsRUFBRSxDQUFDLElBQUksQ0FBQyxjQUFjLENBQUMsSUFBSSxFQUFFLENBQUMsQ0FBQzthQUN2RjtRQUNMLENBQUMsQ0FBQyxDQUFDO0lBQ1AsQ0FBQztJQUVELHFCQUFxQixDQUFDLEtBQWM7UUFDaEMsT0FBTyxVQUFVLENBQUMsZ0JBQWdCLENBQUMsS0FBSyxDQUFDLENBQUMsUUFBUSxDQUFDLEdBQUcscUJBQXFCLENBQUM7SUFDaEYsQ0FBQztJQUVELFdBQVc7UUFDUCxJQUFJLENBQUMsVUFBVSxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsQ0FBQztRQUMzQixJQUFJLENBQUMsVUFBVSxDQUFDLFFBQVEsRUFBRSxDQUFDO1FBRTNCLElBQUksQ0FBQyxxQkFBcUIsQ0FBQyxPQUFPLEVBQUUsQ0FBQztJQUN6QyxDQUFDOzs4SEExQ1EsZ0NBQWdDO2tIQUFoQyxnQ0FBZ0Msb0xBRjlCLENBQUMscUJBQXFCLENBQUM7NEZBRXpCLGdDQUFnQztrQkFKNUMsU0FBUzttQkFBQztvQkFDUCxRQUFRLEVBQUUsb0JBQW9CO29CQUM5QixTQUFTLEVBQUUsQ0FBQyxxQkFBcUIsQ0FBQztpQkFDckM7b0lBR1ksU0FBUztzQkFBakIsS0FBSztnQkFDRyxZQUFZO3NCQUFwQixLQUFLO2dCQUNHLFFBQVE7c0JBQWhCLEtBQUs7Z0JBQ0ksY0FBYztzQkFBdkIsTUFBTSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7QWZ0ZXJWaWV3SW5pdCwgRGlyZWN0aXZlLCBFdmVudEVtaXR0ZXIsIElucHV0LCBOZ1pvbmUsIE9uRGVzdHJveSwgT25Jbml0LCBPdXRwdXR9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHtNYXRTZWxlY3R9IGZyb20gJ0Bhbmd1bGFyL21hdGVyaWFsL3NlbGVjdCc7XG5pbXBvcnQge2RlbGF5LCB0YWtlVW50aWx9IGZyb20gJ3J4anMvb3BlcmF0b3JzJztcbmltcG9ydCB7SW5maW5pdGVTY3JvbGxTZXJ2aWNlfSBmcm9tIFwiLi9pbmZpbml0ZS1zY3JvbGwuc2VydmljZVwiO1xuaW1wb3J0IHtTdWJqZWN0fSBmcm9tIFwicnhqc1wiO1xuXG4vKiogVGhlIGhlaWdodCBvZiB0aGUgc2VsZWN0IGl0ZW1zIGluIGBlbWAgdW5pdHMuICovXG5jb25zdCBTRUxFQ1RfSVRFTV9IRUlHSFRfRU0gPSAzO1xuXG5ARGlyZWN0aXZlKHtcbiAgICBzZWxlY3RvcjogJ1ttc0luZmluaXRlU2Nyb2xsXScsXG4gICAgcHJvdmlkZXJzOiBbSW5maW5pdGVTY3JvbGxTZXJ2aWNlXVxufSlcbmV4cG9ydCBjbGFzcyBNYXRTZWxlY3RJbmZpbml0ZVNjcm9sbERpcmVjdGl2ZSBpbXBsZW1lbnRzIE9uRGVzdHJveSwgQWZ0ZXJWaWV3SW5pdCB7XG5cbiAgICBASW5wdXQoKSB0aHJlc2hvbGQgPSAnMTUlJztcbiAgICBASW5wdXQoKSBkZWJvdW5jZVRpbWUgPSAxNTA7XG4gICAgQElucHV0KCkgY29tcGxldGUhOiBib29sZWFuO1xuICAgIEBPdXRwdXQoKSBpbmZpbml0ZVNjcm9sbCA9IG5ldyBFdmVudEVtaXR0ZXI8dm9pZD4oKTtcblxuICAgIHByaXZhdGUgZGVzdHJveWVkJCA9IG5ldyBTdWJqZWN0PGJvb2xlYW4+KCk7XG5cbiAgICBjb25zdHJ1Y3Rvcihwcm90ZWN0ZWQgbWF0U2VsZWN0OiBNYXRTZWxlY3QsIHByaXZhdGUgaW5maW5pdGVTY3JvbGxTZXJ2aWNlOiBJbmZpbml0ZVNjcm9sbFNlcnZpY2UpIHtcbiAgICB9XG5cblxuICAgIG5nQWZ0ZXJWaWV3SW5pdCgpIHtcbiAgICAgICAgdGhpcy5tYXRTZWxlY3Qub3BlbmVkQ2hhbmdlLnBpcGUoXG4gICAgICAgICAgICAvL1dhaXQgZm9yIHRoZSBwYW5lbCB0byBiZSByZW5kZXJlZCAoaHR0cHM6Ly9naXRodWIuY29tL2FuZ3VsYXIvY29tcG9uZW50cy9pc3N1ZXMvMzA1OTYpXG4gICAgICAgICAgICBkZWxheSgwKSxcbiAgICAgICAgICAgIHRha2VVbnRpbCh0aGlzLmRlc3Ryb3llZCQpXG4gICAgICAgICkuc3Vic2NyaWJlKChvcGVuZWQpID0+IHtcbiAgICAgICAgICAgIGlmIChvcGVuZWQpIHtcbiAgICAgICAgICAgICAgICBjb25zdCBwYW5lbCA9IHRoaXMubWF0U2VsZWN0LnBhbmVsLm5hdGl2ZUVsZW1lbnQ7XG4gICAgICAgICAgICAgICAgY29uc3Qgc2VsZWN0SXRlbUhlaWdodFB4ID0gdGhpcy5nZXRTZWxlY3RJdGVtSGVpZ2h0UHgocGFuZWwpO1xuICAgICAgICAgICAgICAgIHRoaXMuaW5maW5pdGVTY3JvbGxTZXJ2aWNlLmluaXRpYWxpemUocGFuZWwsIHNlbGVjdEl0ZW1IZWlnaHRQeCwge1xuICAgICAgICAgICAgICAgICAgICB0aHJlc2hvbGQ6IHRoaXMudGhyZXNob2xkLFxuICAgICAgICAgICAgICAgICAgICBkZWJvdW5jZVRpbWU6IHRoaXMuZGVib3VuY2VUaW1lLFxuICAgICAgICAgICAgICAgICAgICBjb21wbGV0ZTogdGhpcy5jb21wbGV0ZVxuICAgICAgICAgICAgICAgIH0pO1xuXG4gICAgICAgICAgICAgICAgdGhpcy5pbmZpbml0ZVNjcm9sbFNlcnZpY2UucmVnaXN0ZXJTY3JvbGxMaXN0ZW5lcigoKSA9PiB0aGlzLmluZmluaXRlU2Nyb2xsLmVtaXQoKSk7XG4gICAgICAgICAgICB9XG4gICAgICAgIH0pO1xuICAgIH1cblxuICAgIGdldFNlbGVjdEl0ZW1IZWlnaHRQeChwYW5lbDogRWxlbWVudCk6IG51bWJlciB7XG4gICAgICAgIHJldHVybiBwYXJzZUZsb2F0KGdldENvbXB1dGVkU3R5bGUocGFuZWwpLmZvbnRTaXplKSAqIFNFTEVDVF9JVEVNX0hFSUdIVF9FTTtcbiAgICB9XG5cbiAgICBuZ09uRGVzdHJveSgpIHtcbiAgICAgICAgdGhpcy5kZXN0cm95ZWQkLm5leHQodHJ1ZSk7XG4gICAgICAgIHRoaXMuZGVzdHJveWVkJC5jb21wbGV0ZSgpO1xuXG4gICAgICAgIHRoaXMuaW5maW5pdGVTY3JvbGxTZXJ2aWNlLmRlc3Ryb3koKTtcbiAgICB9XG5cbn1cbiJdfQ==