ng-mat-select-infinite-scroll 3.0.1 → 4.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -60,10 +60,10 @@ Then place the msInfiniteScroll directive on the `mat-select` component
60
60
 
61
61
  ### Compatibility
62
62
 
63
- * `@angular/core`: `>=6.0.0 <14`,
64
- * `@angular/cdk`: `>=6.0.0 <14`,
65
- * `@angular/material`: `>=6.0.0 <14`,
66
- * `rxjs`: `^6.0.0`
63
+ * `@angular/core`: `>=6.0.0 <16`,
64
+ * `@angular/cdk`: `>=6.0.0 <16`,
65
+ * `@angular/material`: `>=6.0.0 <16`,
66
+ * `rxjs`: `^7.0.0`
67
67
 
68
68
  ### Contributions
69
69
  Contributions are welcomed, feel free to open a Pull-Request or open a new issue.
@@ -79,3 +79,7 @@ Run `ng build` to build the project. The build artifacts will be stored in the `
79
79
  ### Running unit tests
80
80
 
81
81
  Run `ng test` to execute the unit tests via [Karma](https://karma-runner.github.io).
82
+
83
+ # License
84
+
85
+ [MIT](LICENSE)
@@ -66,9 +66,9 @@ export class MatSelectInfiniteScrollDirective {
66
66
  return parseFloat(getComputedStyle(this.panel).fontSize) * SELECT_ITEM_HEIGHT_EM;
67
67
  }
68
68
  }
69
- MatSelectInfiniteScrollDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0, type: MatSelectInfiniteScrollDirective, deps: [{ token: i1.MatSelect }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Directive });
70
- MatSelectInfiniteScrollDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.0.5", type: MatSelectInfiniteScrollDirective, selector: "[msInfiniteScroll]", inputs: { threshold: "threshold", debounceTime: "debounceTime", complete: "complete" }, outputs: { infiniteScroll: "infiniteScroll" }, ngImport: i0 });
71
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0, type: MatSelectInfiniteScrollDirective, decorators: [{
69
+ MatSelectInfiniteScrollDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.3", ngImport: i0, type: MatSelectInfiniteScrollDirective, deps: [{ token: i1.MatSelect }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Directive });
70
+ MatSelectInfiniteScrollDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.1.3", type: MatSelectInfiniteScrollDirective, selector: "[msInfiniteScroll]", inputs: { threshold: "threshold", debounceTime: "debounceTime", complete: "complete" }, outputs: { infiniteScroll: "infiniteScroll" }, ngImport: i0 });
71
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.3", ngImport: i0, type: MatSelectInfiniteScrollDirective, decorators: [{
72
72
  type: Directive,
73
73
  args: [{
74
74
  selector: '[msInfiniteScroll]'
@@ -4,12 +4,10 @@ import { MatSelectModule } from '@angular/material/select';
4
4
  import * as i0 from "@angular/core";
5
5
  export class MatSelectInfiniteScrollModule {
6
6
  }
7
- MatSelectInfiniteScrollModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0, type: MatSelectInfiniteScrollModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
8
- MatSelectInfiniteScrollModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0, type: MatSelectInfiniteScrollModule, declarations: [MatSelectInfiniteScrollDirective], imports: [MatSelectModule], exports: [MatSelectInfiniteScrollDirective] });
9
- MatSelectInfiniteScrollModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0, type: MatSelectInfiniteScrollModule, imports: [[
10
- MatSelectModule
11
- ]] });
12
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0, type: MatSelectInfiniteScrollModule, decorators: [{
7
+ MatSelectInfiniteScrollModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.3", ngImport: i0, type: MatSelectInfiniteScrollModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
8
+ MatSelectInfiniteScrollModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.1.3", ngImport: i0, type: MatSelectInfiniteScrollModule, declarations: [MatSelectInfiniteScrollDirective], imports: [MatSelectModule], exports: [MatSelectInfiniteScrollDirective] });
9
+ MatSelectInfiniteScrollModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.1.3", ngImport: i0, type: MatSelectInfiniteScrollModule, imports: [MatSelectModule] });
10
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.3", ngImport: i0, type: MatSelectInfiniteScrollModule, decorators: [{
13
11
  type: NgModule,
14
12
  args: [{
15
13
  declarations: [MatSelectInfiniteScrollDirective],
@@ -19,4 +17,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.0.5", ngImpor
19
17
  exports: [MatSelectInfiniteScrollDirective]
20
18
  }]
21
19
  }] });
22
- //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibWF0LXNlbGVjdC1pbmZpbml0ZS1zY3JvbGwubW9kdWxlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vcHJvamVjdHMvbmctbWF0LXNlbGVjdC1pbmZpbml0ZS1zY3JvbGwvc3JjL2xpYi9tYXQtc2VsZWN0LWluZmluaXRlLXNjcm9sbC5tb2R1bGUudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFDLFFBQVEsRUFBQyxNQUFNLGVBQWUsQ0FBQztBQUN2QyxPQUFPLEVBQUMsZ0NBQWdDLEVBQUMsTUFBTSx3Q0FBd0MsQ0FBQztBQUN4RixPQUFPLEVBQUMsZUFBZSxFQUFDLE1BQU0sMEJBQTBCLENBQUM7O0FBU3pELE1BQU0sT0FBTyw2QkFBNkI7OzBIQUE3Qiw2QkFBNkI7MkhBQTdCLDZCQUE2QixpQkFOekIsZ0NBQWdDLGFBRTdDLGVBQWUsYUFFUCxnQ0FBZ0M7MkhBRS9CLDZCQUE2QixZQUwvQjtZQUNQLGVBQWU7U0FDaEI7MkZBR1UsNkJBQTZCO2tCQVB6QyxRQUFRO21CQUFDO29CQUNSLFlBQVksRUFBRSxDQUFDLGdDQUFnQyxDQUFDO29CQUNoRCxPQUFPLEVBQUU7d0JBQ1AsZUFBZTtxQkFDaEI7b0JBQ0QsT0FBTyxFQUFFLENBQUMsZ0NBQWdDLENBQUM7aUJBQzVDIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtOZ01vZHVsZX0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQge01hdFNlbGVjdEluZmluaXRlU2Nyb2xsRGlyZWN0aXZlfSBmcm9tICcuL21hdC1zZWxlY3QtaW5maW5pdGUtc2Nyb2xsLmRpcmVjdGl2ZSc7XG5pbXBvcnQge01hdFNlbGVjdE1vZHVsZX0gZnJvbSAnQGFuZ3VsYXIvbWF0ZXJpYWwvc2VsZWN0JztcblxuQE5nTW9kdWxlKHtcbiAgZGVjbGFyYXRpb25zOiBbTWF0U2VsZWN0SW5maW5pdGVTY3JvbGxEaXJlY3RpdmVdLFxuICBpbXBvcnRzOiBbXG4gICAgTWF0U2VsZWN0TW9kdWxlXG4gIF0sXG4gIGV4cG9ydHM6IFtNYXRTZWxlY3RJbmZpbml0ZVNjcm9sbERpcmVjdGl2ZV1cbn0pXG5leHBvcnQgY2xhc3MgTWF0U2VsZWN0SW5maW5pdGVTY3JvbGxNb2R1bGUge1xufVxuIl19
20
+ //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibWF0LXNlbGVjdC1pbmZpbml0ZS1zY3JvbGwubW9kdWxlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vcHJvamVjdHMvbmctbWF0LXNlbGVjdC1pbmZpbml0ZS1zY3JvbGwvc3JjL2xpYi9tYXQtc2VsZWN0LWluZmluaXRlLXNjcm9sbC5tb2R1bGUudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFDLFFBQVEsRUFBQyxNQUFNLGVBQWUsQ0FBQztBQUN2QyxPQUFPLEVBQUMsZ0NBQWdDLEVBQUMsTUFBTSx3Q0FBd0MsQ0FBQztBQUN4RixPQUFPLEVBQUMsZUFBZSxFQUFDLE1BQU0sMEJBQTBCLENBQUM7O0FBU3pELE1BQU0sT0FBTyw2QkFBNkI7OzBIQUE3Qiw2QkFBNkI7MkhBQTdCLDZCQUE2QixpQkFOekIsZ0NBQWdDLGFBRTdDLGVBQWUsYUFFUCxnQ0FBZ0M7MkhBRS9CLDZCQUE2QixZQUp0QyxlQUFlOzJGQUlOLDZCQUE2QjtrQkFQekMsUUFBUTttQkFBQztvQkFDUixZQUFZLEVBQUUsQ0FBQyxnQ0FBZ0MsQ0FBQztvQkFDaEQsT0FBTyxFQUFFO3dCQUNQLGVBQWU7cUJBQ2hCO29CQUNELE9BQU8sRUFBRSxDQUFDLGdDQUFnQyxDQUFDO2lCQUM1QyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7TmdNb2R1bGV9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHtNYXRTZWxlY3RJbmZpbml0ZVNjcm9sbERpcmVjdGl2ZX0gZnJvbSAnLi9tYXQtc2VsZWN0LWluZmluaXRlLXNjcm9sbC5kaXJlY3RpdmUnO1xuaW1wb3J0IHtNYXRTZWxlY3RNb2R1bGV9IGZyb20gJ0Bhbmd1bGFyL21hdGVyaWFsL3NlbGVjdCc7XG5cbkBOZ01vZHVsZSh7XG4gIGRlY2xhcmF0aW9uczogW01hdFNlbGVjdEluZmluaXRlU2Nyb2xsRGlyZWN0aXZlXSxcbiAgaW1wb3J0czogW1xuICAgIE1hdFNlbGVjdE1vZHVsZVxuICBdLFxuICBleHBvcnRzOiBbTWF0U2VsZWN0SW5maW5pdGVTY3JvbGxEaXJlY3RpdmVdXG59KVxuZXhwb3J0IGNsYXNzIE1hdFNlbGVjdEluZmluaXRlU2Nyb2xsTW9kdWxlIHtcbn1cbiJdfQ==
@@ -68,9 +68,9 @@ class MatSelectInfiniteScrollDirective {
68
68
  return parseFloat(getComputedStyle(this.panel).fontSize) * SELECT_ITEM_HEIGHT_EM;
69
69
  }
70
70
  }
71
- MatSelectInfiniteScrollDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0, type: MatSelectInfiniteScrollDirective, deps: [{ token: i1.MatSelect }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Directive });
72
- MatSelectInfiniteScrollDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.0.5", type: MatSelectInfiniteScrollDirective, selector: "[msInfiniteScroll]", inputs: { threshold: "threshold", debounceTime: "debounceTime", complete: "complete" }, outputs: { infiniteScroll: "infiniteScroll" }, ngImport: i0 });
73
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0, type: MatSelectInfiniteScrollDirective, decorators: [{
71
+ MatSelectInfiniteScrollDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.3", ngImport: i0, type: MatSelectInfiniteScrollDirective, deps: [{ token: i1.MatSelect }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Directive });
72
+ MatSelectInfiniteScrollDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.1.3", type: MatSelectInfiniteScrollDirective, selector: "[msInfiniteScroll]", inputs: { threshold: "threshold", debounceTime: "debounceTime", complete: "complete" }, outputs: { infiniteScroll: "infiniteScroll" }, ngImport: i0 });
73
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.3", ngImport: i0, type: MatSelectInfiniteScrollDirective, decorators: [{
74
74
  type: Directive,
75
75
  args: [{
76
76
  selector: '[msInfiniteScroll]'
@@ -87,12 +87,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.0.5", ngImpor
87
87
 
88
88
  class MatSelectInfiniteScrollModule {
89
89
  }
90
- MatSelectInfiniteScrollModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0, type: MatSelectInfiniteScrollModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
91
- MatSelectInfiniteScrollModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0, type: MatSelectInfiniteScrollModule, declarations: [MatSelectInfiniteScrollDirective], imports: [MatSelectModule], exports: [MatSelectInfiniteScrollDirective] });
92
- MatSelectInfiniteScrollModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0, type: MatSelectInfiniteScrollModule, imports: [[
93
- MatSelectModule
94
- ]] });
95
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0, type: MatSelectInfiniteScrollModule, decorators: [{
90
+ MatSelectInfiniteScrollModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.3", ngImport: i0, type: MatSelectInfiniteScrollModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
91
+ MatSelectInfiniteScrollModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.1.3", ngImport: i0, type: MatSelectInfiniteScrollModule, declarations: [MatSelectInfiniteScrollDirective], imports: [MatSelectModule], exports: [MatSelectInfiniteScrollDirective] });
92
+ MatSelectInfiniteScrollModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.1.3", ngImport: i0, type: MatSelectInfiniteScrollModule, imports: [MatSelectModule] });
93
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.3", ngImport: i0, type: MatSelectInfiniteScrollModule, decorators: [{
96
94
  type: NgModule,
97
95
  args: [{
98
96
  declarations: [MatSelectInfiniteScrollDirective],
@@ -112,4 +110,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.0.5", ngImpor
112
110
  */
113
111
 
114
112
  export { MatSelectInfiniteScrollDirective, MatSelectInfiniteScrollModule };
115
- //# sourceMappingURL=ng-mat-select-infinite-scroll.js.map
113
+ //# sourceMappingURL=ng-mat-select-infinite-scroll.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ng-mat-select-infinite-scroll.mjs","sources":["../../../projects/ng-mat-select-infinite-scroll/src/lib/mat-select-infinite-scroll.directive.ts","../../../projects/ng-mat-select-infinite-scroll/src/lib/mat-select-infinite-scroll.module.ts","../../../projects/ng-mat-select-infinite-scroll/src/public-api.ts","../../../projects/ng-mat-select-infinite-scroll/src/ng-mat-select-infinite-scroll.ts"],"sourcesContent":["import {AfterViewInit, Directive, EventEmitter, Input, NgZone, OnDestroy, OnInit, Output} from '@angular/core';\nimport {MatSelect} from '@angular/material/select';\nimport {debounceTime, takeUntil, tap} from 'rxjs/operators';\nimport {fromEvent, Subject} from 'rxjs';\n\n/** The height of the select items in `em` units. */\nconst SELECT_ITEM_HEIGHT_EM = 3;\n\n@Directive({\n selector: '[msInfiniteScroll]'\n})\nexport class MatSelectInfiniteScrollDirective implements OnInit, OnDestroy, AfterViewInit {\n\n @Input() threshold = '15%';\n @Input() debounceTime = 150;\n @Input() complete!: boolean;\n @Output() infiniteScroll = new EventEmitter<void>();\n\n private panel!: Element;\n private thrPx = 0;\n private thrPc = 0;\n private singleOptionHeight = SELECT_ITEM_HEIGHT_EM;\n\n private destroyed$ = new Subject<boolean>();\n\n constructor(private matSelect: MatSelect, private ngZone: NgZone) {\n }\n\n ngOnInit() {\n this.evaluateThreshold();\n }\n\n ngAfterViewInit() {\n this.matSelect.openedChange.pipe(\n takeUntil(this.destroyed$)\n ).subscribe((opened) => {\n if (opened) {\n this.panel = this.matSelect.panel.nativeElement;\n this.singleOptionHeight = this.getSelectItemHeightPx();\n this.registerScrollListener();\n }\n });\n }\n\n ngOnDestroy() {\n this.destroyed$.next(true);\n this.destroyed$.complete();\n }\n\n evaluateThreshold() {\n if (this.threshold.lastIndexOf('%') > -1) {\n this.thrPx = 0;\n this.thrPc = (parseFloat(this.threshold) / 100);\n\n } else {\n this.thrPx = parseFloat(this.threshold);\n this.thrPc = 0;\n }\n }\n\n registerScrollListener() {\n fromEvent(this.panel, 'scroll').pipe(\n takeUntil(this.destroyed$),\n debounceTime(this.debounceTime),\n tap((event) => {\n this.handleScrollEvent(event);\n })\n ).subscribe();\n }\n\n handleScrollEvent(event: any) {\n this.ngZone.runOutsideAngular(() => {\n if (this.complete) {\n return;\n }\n const countOfRenderedOptions = this.matSelect.options.length;\n const infiniteScrollDistance = this.singleOptionHeight * countOfRenderedOptions;\n const threshold = this.thrPc !== 0 ? (infiniteScrollDistance * this.thrPc) : this.thrPx;\n\n const scrolledDistance = this.panel.clientHeight + event.target.scrollTop;\n\n if ((scrolledDistance + threshold) >= infiniteScrollDistance) {\n this.ngZone.run(() => this.infiniteScroll.emit());\n }\n });\n }\n\n getSelectItemHeightPx(): number {\n return parseFloat(getComputedStyle(this.panel).fontSize) * SELECT_ITEM_HEIGHT_EM;\n }\n\n}\n","import {NgModule} from '@angular/core';\nimport {MatSelectInfiniteScrollDirective} from './mat-select-infinite-scroll.directive';\nimport {MatSelectModule} from '@angular/material/select';\n\n@NgModule({\n declarations: [MatSelectInfiniteScrollDirective],\n imports: [\n MatSelectModule\n ],\n exports: [MatSelectInfiniteScrollDirective]\n})\nexport class MatSelectInfiniteScrollModule {\n}\n","/*\n * Public API Surface of ng-mat-select-infinite-scroll\n */\n\nexport * from './lib/mat-select-infinite-scroll.directive';\nexport * from './lib/mat-select-infinite-scroll.module';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
@@ -0,0 +1,113 @@
1
+ import * as i0 from '@angular/core';
2
+ import { EventEmitter, Directive, Input, Output, NgModule } from '@angular/core';
3
+ import { takeUntil, debounceTime, tap } from 'rxjs/operators';
4
+ import { Subject, fromEvent } from 'rxjs';
5
+ import * as i1 from '@angular/material/select';
6
+ import { MatSelectModule } from '@angular/material/select';
7
+
8
+ /** The height of the select items in `em` units. */
9
+ const SELECT_ITEM_HEIGHT_EM = 3;
10
+ class MatSelectInfiniteScrollDirective {
11
+ constructor(matSelect, ngZone) {
12
+ this.matSelect = matSelect;
13
+ this.ngZone = ngZone;
14
+ this.threshold = '15%';
15
+ this.debounceTime = 150;
16
+ this.infiniteScroll = new EventEmitter();
17
+ this.thrPx = 0;
18
+ this.thrPc = 0;
19
+ this.singleOptionHeight = SELECT_ITEM_HEIGHT_EM;
20
+ this.destroyed$ = new Subject();
21
+ }
22
+ ngOnInit() {
23
+ this.evaluateThreshold();
24
+ }
25
+ ngAfterViewInit() {
26
+ this.matSelect.openedChange.pipe(takeUntil(this.destroyed$)).subscribe((opened) => {
27
+ if (opened) {
28
+ this.panel = this.matSelect.panel.nativeElement;
29
+ this.singleOptionHeight = this.getSelectItemHeightPx();
30
+ this.registerScrollListener();
31
+ }
32
+ });
33
+ }
34
+ ngOnDestroy() {
35
+ this.destroyed$.next(true);
36
+ this.destroyed$.complete();
37
+ }
38
+ evaluateThreshold() {
39
+ if (this.threshold.lastIndexOf('%') > -1) {
40
+ this.thrPx = 0;
41
+ this.thrPc = (parseFloat(this.threshold) / 100);
42
+ }
43
+ else {
44
+ this.thrPx = parseFloat(this.threshold);
45
+ this.thrPc = 0;
46
+ }
47
+ }
48
+ registerScrollListener() {
49
+ fromEvent(this.panel, 'scroll').pipe(takeUntil(this.destroyed$), debounceTime(this.debounceTime), tap((event) => {
50
+ this.handleScrollEvent(event);
51
+ })).subscribe();
52
+ }
53
+ handleScrollEvent(event) {
54
+ this.ngZone.runOutsideAngular(() => {
55
+ if (this.complete) {
56
+ return;
57
+ }
58
+ const countOfRenderedOptions = this.matSelect.options.length;
59
+ const infiniteScrollDistance = this.singleOptionHeight * countOfRenderedOptions;
60
+ const threshold = this.thrPc !== 0 ? (infiniteScrollDistance * this.thrPc) : this.thrPx;
61
+ const scrolledDistance = this.panel.clientHeight + event.target.scrollTop;
62
+ if ((scrolledDistance + threshold) >= infiniteScrollDistance) {
63
+ this.ngZone.run(() => this.infiniteScroll.emit());
64
+ }
65
+ });
66
+ }
67
+ getSelectItemHeightPx() {
68
+ return parseFloat(getComputedStyle(this.panel).fontSize) * SELECT_ITEM_HEIGHT_EM;
69
+ }
70
+ }
71
+ MatSelectInfiniteScrollDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.3", ngImport: i0, type: MatSelectInfiniteScrollDirective, deps: [{ token: i1.MatSelect }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Directive });
72
+ MatSelectInfiniteScrollDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.1.3", type: MatSelectInfiniteScrollDirective, selector: "[msInfiniteScroll]", inputs: { threshold: "threshold", debounceTime: "debounceTime", complete: "complete" }, outputs: { infiniteScroll: "infiniteScroll" }, ngImport: i0 });
73
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.3", ngImport: i0, type: MatSelectInfiniteScrollDirective, decorators: [{
74
+ type: Directive,
75
+ args: [{
76
+ selector: '[msInfiniteScroll]'
77
+ }]
78
+ }], ctorParameters: function () { return [{ type: i1.MatSelect }, { type: i0.NgZone }]; }, propDecorators: { threshold: [{
79
+ type: Input
80
+ }], debounceTime: [{
81
+ type: Input
82
+ }], complete: [{
83
+ type: Input
84
+ }], infiniteScroll: [{
85
+ type: Output
86
+ }] } });
87
+
88
+ class MatSelectInfiniteScrollModule {
89
+ }
90
+ MatSelectInfiniteScrollModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.3", ngImport: i0, type: MatSelectInfiniteScrollModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
91
+ MatSelectInfiniteScrollModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.1.3", ngImport: i0, type: MatSelectInfiniteScrollModule, declarations: [MatSelectInfiniteScrollDirective], imports: [MatSelectModule], exports: [MatSelectInfiniteScrollDirective] });
92
+ MatSelectInfiniteScrollModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.1.3", ngImport: i0, type: MatSelectInfiniteScrollModule, imports: [MatSelectModule] });
93
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.3", ngImport: i0, type: MatSelectInfiniteScrollModule, decorators: [{
94
+ type: NgModule,
95
+ args: [{
96
+ declarations: [MatSelectInfiniteScrollDirective],
97
+ imports: [
98
+ MatSelectModule
99
+ ],
100
+ exports: [MatSelectInfiniteScrollDirective]
101
+ }]
102
+ }] });
103
+
104
+ /*
105
+ * Public API Surface of ng-mat-select-infinite-scroll
106
+ */
107
+
108
+ /**
109
+ * Generated bundle index. Do not edit.
110
+ */
111
+
112
+ export { MatSelectInfiniteScrollDirective, MatSelectInfiniteScrollModule };
113
+ //# sourceMappingURL=ng-mat-select-infinite-scroll.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ng-mat-select-infinite-scroll.mjs","sources":["../../../projects/ng-mat-select-infinite-scroll/src/lib/mat-select-infinite-scroll.directive.ts","../../../projects/ng-mat-select-infinite-scroll/src/lib/mat-select-infinite-scroll.module.ts","../../../projects/ng-mat-select-infinite-scroll/src/public-api.ts","../../../projects/ng-mat-select-infinite-scroll/src/ng-mat-select-infinite-scroll.ts"],"sourcesContent":["import {AfterViewInit, Directive, EventEmitter, Input, NgZone, OnDestroy, OnInit, Output} from '@angular/core';\nimport {MatSelect} from '@angular/material/select';\nimport {debounceTime, takeUntil, tap} from 'rxjs/operators';\nimport {fromEvent, Subject} from 'rxjs';\n\n/** The height of the select items in `em` units. */\nconst SELECT_ITEM_HEIGHT_EM = 3;\n\n@Directive({\n selector: '[msInfiniteScroll]'\n})\nexport class MatSelectInfiniteScrollDirective implements OnInit, OnDestroy, AfterViewInit {\n\n @Input() threshold = '15%';\n @Input() debounceTime = 150;\n @Input() complete!: boolean;\n @Output() infiniteScroll = new EventEmitter<void>();\n\n private panel!: Element;\n private thrPx = 0;\n private thrPc = 0;\n private singleOptionHeight = SELECT_ITEM_HEIGHT_EM;\n\n private destroyed$ = new Subject<boolean>();\n\n constructor(private matSelect: MatSelect, private ngZone: NgZone) {\n }\n\n ngOnInit() {\n this.evaluateThreshold();\n }\n\n ngAfterViewInit() {\n this.matSelect.openedChange.pipe(\n takeUntil(this.destroyed$)\n ).subscribe((opened) => {\n if (opened) {\n this.panel = this.matSelect.panel.nativeElement;\n this.singleOptionHeight = this.getSelectItemHeightPx();\n this.registerScrollListener();\n }\n });\n }\n\n ngOnDestroy() {\n this.destroyed$.next(true);\n this.destroyed$.complete();\n }\n\n evaluateThreshold() {\n if (this.threshold.lastIndexOf('%') > -1) {\n this.thrPx = 0;\n this.thrPc = (parseFloat(this.threshold) / 100);\n\n } else {\n this.thrPx = parseFloat(this.threshold);\n this.thrPc = 0;\n }\n }\n\n registerScrollListener() {\n fromEvent(this.panel, 'scroll').pipe(\n takeUntil(this.destroyed$),\n debounceTime(this.debounceTime),\n tap((event) => {\n this.handleScrollEvent(event);\n })\n ).subscribe();\n }\n\n handleScrollEvent(event: any) {\n this.ngZone.runOutsideAngular(() => {\n if (this.complete) {\n return;\n }\n const countOfRenderedOptions = this.matSelect.options.length;\n const infiniteScrollDistance = this.singleOptionHeight * countOfRenderedOptions;\n const threshold = this.thrPc !== 0 ? (infiniteScrollDistance * this.thrPc) : this.thrPx;\n\n const scrolledDistance = this.panel.clientHeight + event.target.scrollTop;\n\n if ((scrolledDistance + threshold) >= infiniteScrollDistance) {\n this.ngZone.run(() => this.infiniteScroll.emit());\n }\n });\n }\n\n getSelectItemHeightPx(): number {\n return parseFloat(getComputedStyle(this.panel).fontSize) * SELECT_ITEM_HEIGHT_EM;\n }\n\n}\n","import {NgModule} from '@angular/core';\nimport {MatSelectInfiniteScrollDirective} from './mat-select-infinite-scroll.directive';\nimport {MatSelectModule} from '@angular/material/select';\n\n@NgModule({\n declarations: [MatSelectInfiniteScrollDirective],\n imports: [\n MatSelectModule\n ],\n exports: [MatSelectInfiniteScrollDirective]\n})\nexport class MatSelectInfiniteScrollModule {\n}\n","/*\n * Public API Surface of ng-mat-select-infinite-scroll\n */\n\nexport * from './lib/mat-select-infinite-scroll.directive';\nexport * from './lib/mat-select-infinite-scroll.module';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
@@ -22,5 +22,5 @@ export declare class MatSelectInfiniteScrollDirective implements OnInit, OnDestr
22
22
  handleScrollEvent(event: any): void;
23
23
  getSelectItemHeightPx(): number;
24
24
  static ɵfac: i0.ɵɵFactoryDeclaration<MatSelectInfiniteScrollDirective, never>;
25
- static ɵdir: i0.ɵɵDirectiveDeclaration<MatSelectInfiniteScrollDirective, "[msInfiniteScroll]", never, { "threshold": "threshold"; "debounceTime": "debounceTime"; "complete": "complete"; }, { "infiniteScroll": "infiniteScroll"; }, never>;
25
+ static ɵdir: i0.ɵɵDirectiveDeclaration<MatSelectInfiniteScrollDirective, "[msInfiniteScroll]", never, { "threshold": "threshold"; "debounceTime": "debounceTime"; "complete": "complete"; }, { "infiniteScroll": "infiniteScroll"; }, never, never, false>;
26
26
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "ng-mat-select-infinite-scroll",
3
- "version": "3.0.1",
3
+ "version": "4.0.0",
4
4
  "description": "Adds missing infinite scroll functionality for the angular material select component",
5
5
  "author": "Haidar Zeineddine",
6
6
  "repository": {
@@ -23,17 +23,30 @@
23
23
  ],
24
24
  "license": "MIT",
25
25
  "peerDependencies": {
26
- "@angular/core": ">=6.0.0 <14.0.0",
27
- "@angular/material": ">=6.0.0 <14.0.0"
26
+ "@angular/core": ">=6.0.0 <15.0.0",
27
+ "@angular/material": ">=6.0.0 <15.0.0"
28
+ },
29
+ "module": "fesm2015/ng-mat-select-infinite-scroll.mjs",
30
+ "es2020": "fesm2020/ng-mat-select-infinite-scroll.mjs",
31
+ "esm2020": "esm2020/ng-mat-select-infinite-scroll.mjs",
32
+ "fesm2020": "fesm2020/ng-mat-select-infinite-scroll.mjs",
33
+ "fesm2015": "fesm2015/ng-mat-select-infinite-scroll.mjs",
34
+ "typings": "index.d.ts",
35
+ "exports": {
36
+ "./package.json": {
37
+ "default": "./package.json"
38
+ },
39
+ ".": {
40
+ "types": "./index.d.ts",
41
+ "esm2020": "./esm2020/ng-mat-select-infinite-scroll.mjs",
42
+ "es2020": "./fesm2020/ng-mat-select-infinite-scroll.mjs",
43
+ "es2015": "./fesm2015/ng-mat-select-infinite-scroll.mjs",
44
+ "node": "./fesm2015/ng-mat-select-infinite-scroll.mjs",
45
+ "default": "./fesm2020/ng-mat-select-infinite-scroll.mjs"
46
+ }
28
47
  },
29
- "main": "bundles/ng-mat-select-infinite-scroll.umd.js",
30
- "module": "fesm2015/ng-mat-select-infinite-scroll.js",
31
- "es2015": "fesm2015/ng-mat-select-infinite-scroll.js",
32
- "esm2015": "esm2015/ng-mat-select-infinite-scroll.js",
33
- "fesm2015": "fesm2015/ng-mat-select-infinite-scroll.js",
34
- "typings": "ng-mat-select-infinite-scroll.d.ts",
35
48
  "sideEffects": false,
36
49
  "dependencies": {
37
- "tslib": "^2.1.0"
50
+ "tslib": "^2.3.0"
38
51
  }
39
52
  }
@@ -1,147 +0,0 @@
1
- (function (global, factory) {
2
- typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('rxjs/operators'), require('rxjs'), require('@angular/material/select')) :
3
- typeof define === 'function' && define.amd ? define('ng-mat-select-infinite-scroll', ['exports', '@angular/core', 'rxjs/operators', 'rxjs', '@angular/material/select'], factory) :
4
- (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global["ng-mat-select-infinite-scroll"] = {}, global.ng.core, global.rxjs.operators, global.rxjs, global.ng.material.select));
5
- })(this, (function (exports, i0, operators, rxjs, i1) { 'use strict';
6
-
7
- function _interopNamespace(e) {
8
- if (e && e.__esModule) return e;
9
- var n = Object.create(null);
10
- if (e) {
11
- Object.keys(e).forEach(function (k) {
12
- if (k !== 'default') {
13
- var d = Object.getOwnPropertyDescriptor(e, k);
14
- Object.defineProperty(n, k, d.get ? d : {
15
- enumerable: true,
16
- get: function () { return e[k]; }
17
- });
18
- }
19
- });
20
- }
21
- n["default"] = e;
22
- return Object.freeze(n);
23
- }
24
-
25
- var i0__namespace = /*#__PURE__*/_interopNamespace(i0);
26
- var i1__namespace = /*#__PURE__*/_interopNamespace(i1);
27
-
28
- /** The height of the select items in `em` units. */
29
- var SELECT_ITEM_HEIGHT_EM = 3;
30
- var MatSelectInfiniteScrollDirective = /** @class */ (function () {
31
- function MatSelectInfiniteScrollDirective(matSelect, ngZone) {
32
- this.matSelect = matSelect;
33
- this.ngZone = ngZone;
34
- this.threshold = '15%';
35
- this.debounceTime = 150;
36
- this.infiniteScroll = new i0.EventEmitter();
37
- this.thrPx = 0;
38
- this.thrPc = 0;
39
- this.singleOptionHeight = SELECT_ITEM_HEIGHT_EM;
40
- this.destroyed$ = new rxjs.Subject();
41
- }
42
- MatSelectInfiniteScrollDirective.prototype.ngOnInit = function () {
43
- this.evaluateThreshold();
44
- };
45
- MatSelectInfiniteScrollDirective.prototype.ngAfterViewInit = function () {
46
- var _this = this;
47
- this.matSelect.openedChange.pipe(operators.takeUntil(this.destroyed$)).subscribe(function (opened) {
48
- if (opened) {
49
- _this.panel = _this.matSelect.panel.nativeElement;
50
- _this.singleOptionHeight = _this.getSelectItemHeightPx();
51
- _this.registerScrollListener();
52
- }
53
- });
54
- };
55
- MatSelectInfiniteScrollDirective.prototype.ngOnDestroy = function () {
56
- this.destroyed$.next(true);
57
- this.destroyed$.complete();
58
- };
59
- MatSelectInfiniteScrollDirective.prototype.evaluateThreshold = function () {
60
- if (this.threshold.lastIndexOf('%') > -1) {
61
- this.thrPx = 0;
62
- this.thrPc = (parseFloat(this.threshold) / 100);
63
- }
64
- else {
65
- this.thrPx = parseFloat(this.threshold);
66
- this.thrPc = 0;
67
- }
68
- };
69
- MatSelectInfiniteScrollDirective.prototype.registerScrollListener = function () {
70
- var _this = this;
71
- rxjs.fromEvent(this.panel, 'scroll').pipe(operators.takeUntil(this.destroyed$), operators.debounceTime(this.debounceTime), operators.tap(function (event) {
72
- _this.handleScrollEvent(event);
73
- })).subscribe();
74
- };
75
- MatSelectInfiniteScrollDirective.prototype.handleScrollEvent = function (event) {
76
- var _this = this;
77
- this.ngZone.runOutsideAngular(function () {
78
- if (_this.complete) {
79
- return;
80
- }
81
- var countOfRenderedOptions = _this.matSelect.options.length;
82
- var infiniteScrollDistance = _this.singleOptionHeight * countOfRenderedOptions;
83
- var threshold = _this.thrPc !== 0 ? (infiniteScrollDistance * _this.thrPc) : _this.thrPx;
84
- var scrolledDistance = _this.panel.clientHeight + event.target.scrollTop;
85
- if ((scrolledDistance + threshold) >= infiniteScrollDistance) {
86
- _this.ngZone.run(function () { return _this.infiniteScroll.emit(); });
87
- }
88
- });
89
- };
90
- MatSelectInfiniteScrollDirective.prototype.getSelectItemHeightPx = function () {
91
- return parseFloat(getComputedStyle(this.panel).fontSize) * SELECT_ITEM_HEIGHT_EM;
92
- };
93
- return MatSelectInfiniteScrollDirective;
94
- }());
95
- MatSelectInfiniteScrollDirective.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0__namespace, type: MatSelectInfiniteScrollDirective, deps: [{ token: i1__namespace.MatSelect }, { token: i0__namespace.NgZone }], target: i0__namespace.ɵɵFactoryTarget.Directive });
96
- MatSelectInfiniteScrollDirective.ɵdir = i0__namespace.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.0.5", type: MatSelectInfiniteScrollDirective, selector: "[msInfiniteScroll]", inputs: { threshold: "threshold", debounceTime: "debounceTime", complete: "complete" }, outputs: { infiniteScroll: "infiniteScroll" }, ngImport: i0__namespace });
97
- i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0__namespace, type: MatSelectInfiniteScrollDirective, decorators: [{
98
- type: i0.Directive,
99
- args: [{
100
- selector: '[msInfiniteScroll]'
101
- }]
102
- }], ctorParameters: function () { return [{ type: i1__namespace.MatSelect }, { type: i0__namespace.NgZone }]; }, propDecorators: { threshold: [{
103
- type: i0.Input
104
- }], debounceTime: [{
105
- type: i0.Input
106
- }], complete: [{
107
- type: i0.Input
108
- }], infiniteScroll: [{
109
- type: i0.Output
110
- }] } });
111
-
112
- var MatSelectInfiniteScrollModule = /** @class */ (function () {
113
- function MatSelectInfiniteScrollModule() {
114
- }
115
- return MatSelectInfiniteScrollModule;
116
- }());
117
- MatSelectInfiniteScrollModule.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0__namespace, type: MatSelectInfiniteScrollModule, deps: [], target: i0__namespace.ɵɵFactoryTarget.NgModule });
118
- MatSelectInfiniteScrollModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0__namespace, type: MatSelectInfiniteScrollModule, declarations: [MatSelectInfiniteScrollDirective], imports: [i1.MatSelectModule], exports: [MatSelectInfiniteScrollDirective] });
119
- MatSelectInfiniteScrollModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0__namespace, type: MatSelectInfiniteScrollModule, imports: [[
120
- i1.MatSelectModule
121
- ]] });
122
- i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0__namespace, type: MatSelectInfiniteScrollModule, decorators: [{
123
- type: i0.NgModule,
124
- args: [{
125
- declarations: [MatSelectInfiniteScrollDirective],
126
- imports: [
127
- i1.MatSelectModule
128
- ],
129
- exports: [MatSelectInfiniteScrollDirective]
130
- }]
131
- }] });
132
-
133
- /*
134
- * Public API Surface of ng-mat-select-infinite-scroll
135
- */
136
-
137
- /**
138
- * Generated bundle index. Do not edit.
139
- */
140
-
141
- exports.MatSelectInfiniteScrollDirective = MatSelectInfiniteScrollDirective;
142
- exports.MatSelectInfiniteScrollModule = MatSelectInfiniteScrollModule;
143
-
144
- Object.defineProperty(exports, '__esModule', { value: true });
145
-
146
- }));
147
- //# sourceMappingURL=ng-mat-select-infinite-scroll.umd.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"ng-mat-select-infinite-scroll.umd.js","sources":["../../../projects/ng-mat-select-infinite-scroll/src/lib/mat-select-infinite-scroll.directive.ts","../../../projects/ng-mat-select-infinite-scroll/src/lib/mat-select-infinite-scroll.module.ts","../../../projects/ng-mat-select-infinite-scroll/src/public-api.ts","../../../projects/ng-mat-select-infinite-scroll/src/ng-mat-select-infinite-scroll.ts"],"sourcesContent":["import {AfterViewInit, Directive, EventEmitter, Input, NgZone, OnDestroy, OnInit, Output} from '@angular/core';\nimport {MatSelect} from '@angular/material/select';\nimport {debounceTime, takeUntil, tap} from 'rxjs/operators';\nimport {fromEvent, Subject} from 'rxjs';\n\n/** The height of the select items in `em` units. */\nconst SELECT_ITEM_HEIGHT_EM = 3;\n\n@Directive({\n selector: '[msInfiniteScroll]'\n})\nexport class MatSelectInfiniteScrollDirective implements OnInit, OnDestroy, AfterViewInit {\n\n @Input() threshold = '15%';\n @Input() debounceTime = 150;\n @Input() complete!: boolean;\n @Output() infiniteScroll = new EventEmitter<void>();\n\n private panel!: Element;\n private thrPx = 0;\n private thrPc = 0;\n private singleOptionHeight = SELECT_ITEM_HEIGHT_EM;\n\n private destroyed$ = new Subject<boolean>();\n\n constructor(private matSelect: MatSelect, private ngZone: NgZone) {\n }\n\n ngOnInit() {\n this.evaluateThreshold();\n }\n\n ngAfterViewInit() {\n this.matSelect.openedChange.pipe(\n takeUntil(this.destroyed$)\n ).subscribe((opened) => {\n if (opened) {\n this.panel = this.matSelect.panel.nativeElement;\n this.singleOptionHeight = this.getSelectItemHeightPx();\n this.registerScrollListener();\n }\n });\n }\n\n ngOnDestroy() {\n this.destroyed$.next(true);\n this.destroyed$.complete();\n }\n\n evaluateThreshold() {\n if (this.threshold.lastIndexOf('%') > -1) {\n this.thrPx = 0;\n this.thrPc = (parseFloat(this.threshold) / 100);\n\n } else {\n this.thrPx = parseFloat(this.threshold);\n this.thrPc = 0;\n }\n }\n\n registerScrollListener() {\n fromEvent(this.panel, 'scroll').pipe(\n takeUntil(this.destroyed$),\n debounceTime(this.debounceTime),\n tap((event) => {\n this.handleScrollEvent(event);\n })\n ).subscribe();\n }\n\n handleScrollEvent(event: any) {\n this.ngZone.runOutsideAngular(() => {\n if (this.complete) {\n return;\n }\n const countOfRenderedOptions = this.matSelect.options.length;\n const infiniteScrollDistance = this.singleOptionHeight * countOfRenderedOptions;\n const threshold = this.thrPc !== 0 ? (infiniteScrollDistance * this.thrPc) : this.thrPx;\n\n const scrolledDistance = this.panel.clientHeight + event.target.scrollTop;\n\n if ((scrolledDistance + threshold) >= infiniteScrollDistance) {\n this.ngZone.run(() => this.infiniteScroll.emit());\n }\n });\n }\n\n getSelectItemHeightPx(): number {\n return parseFloat(getComputedStyle(this.panel).fontSize) * SELECT_ITEM_HEIGHT_EM;\n }\n\n}\n","import {NgModule} from '@angular/core';\nimport {MatSelectInfiniteScrollDirective} from './mat-select-infinite-scroll.directive';\nimport {MatSelectModule} from '@angular/material/select';\n\n@NgModule({\n declarations: [MatSelectInfiniteScrollDirective],\n imports: [\n MatSelectModule\n ],\n exports: [MatSelectInfiniteScrollDirective]\n})\nexport class MatSelectInfiniteScrollModule {\n}\n","/*\n * Public API Surface of ng-mat-select-infinite-scroll\n */\n\nexport * from './lib/mat-select-infinite-scroll.directive';\nexport * from './lib/mat-select-infinite-scroll.module';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":["EventEmitter","Subject","takeUntil","fromEvent","debounceTime","tap","Directive","Input","Output","MatSelectModule","NgModule"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;IAKA;IACA,IAAM,qBAAqB,GAAG,CAAC,CAAC;;QAmB9B,0CAAoB,SAAoB,EAAU,MAAc;YAA5C,cAAS,GAAT,SAAS,CAAW;YAAU,WAAM,GAAN,MAAM,CAAQ;YAZvD,cAAS,GAAG,KAAK,CAAC;YAClB,iBAAY,GAAG,GAAG,CAAC;YAElB,mBAAc,GAAG,IAAIA,eAAY,EAAQ,CAAC;YAG5C,UAAK,GAAG,CAAC,CAAC;YACV,UAAK,GAAG,CAAC,CAAC;YACV,uBAAkB,GAAG,qBAAqB,CAAC;YAE3C,eAAU,GAAG,IAAIC,YAAO,EAAW,CAAC;SAG3C;QAED,mDAAQ,GAAR;YACE,IAAI,CAAC,iBAAiB,EAAE,CAAC;SAC1B;QAED,0DAAe,GAAf;YAAA,iBAUC;YATC,IAAI,CAAC,SAAS,CAAC,YAAY,CAAC,IAAI,CAC9BC,mBAAS,CAAC,IAAI,CAAC,UAAU,CAAC,CAC3B,CAAC,SAAS,CAAC,UAAC,MAAM;gBACjB,IAAI,MAAM,EAAE;oBACV,KAAI,CAAC,KAAK,GAAG,KAAI,CAAC,SAAS,CAAC,KAAK,CAAC,aAAa,CAAC;oBAChD,KAAI,CAAC,kBAAkB,GAAG,KAAI,CAAC,qBAAqB,EAAE,CAAC;oBACvD,KAAI,CAAC,sBAAsB,EAAE,CAAC;iBAC/B;aACF,CAAC,CAAC;SACJ;QAED,sDAAW,GAAX;YACE,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;YAC3B,IAAI,CAAC,UAAU,CAAC,QAAQ,EAAE,CAAC;SAC5B;QAED,4DAAiB,GAAjB;YACE,IAAI,IAAI,CAAC,SAAS,CAAC,WAAW,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC,EAAE;gBACxC,IAAI,CAAC,KAAK,GAAG,CAAC,CAAC;gBACf,IAAI,CAAC,KAAK,IAAI,UAAU,CAAC,IAAI,CAAC,SAAS,CAAC,GAAG,GAAG,CAAC,CAAC;aAEjD;iBAAM;gBACL,IAAI,CAAC,KAAK,GAAG,UAAU,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;gBACxC,IAAI,CAAC,KAAK,GAAG,CAAC,CAAC;aAChB;SACF;QAED,iEAAsB,GAAtB;YAAA,iBAQC;YAPCC,cAAS,CAAC,IAAI,CAAC,KAAK,EAAE,QAAQ,CAAC,CAAC,IAAI,CAClCD,mBAAS,CAAC,IAAI,CAAC,UAAU,CAAC,EAC1BE,sBAAY,CAAC,IAAI,CAAC,YAAY,CAAC,EAC/BC,aAAG,CAAC,UAAC,KAAK;gBACR,KAAI,CAAC,iBAAiB,CAAC,KAAK,CAAC,CAAC;aAC/B,CAAC,CACH,CAAC,SAAS,EAAE,CAAC;SACf;QAED,4DAAiB,GAAjB,UAAkB,KAAU;YAA5B,iBAeC;YAdC,IAAI,CAAC,MAAM,CAAC,iBAAiB,CAAC;gBAC5B,IAAI,KAAI,CAAC,QAAQ,EAAE;oBACjB,OAAO;iBACR;gBACD,IAAM,sBAAsB,GAAG,KAAI,CAAC,SAAS,CAAC,OAAO,CAAC,MAAM,CAAC;gBAC7D,IAAM,sBAAsB,GAAG,KAAI,CAAC,kBAAkB,GAAG,sBAAsB,CAAC;gBAChF,IAAM,SAAS,GAAG,KAAI,CAAC,KAAK,KAAK,CAAC,IAAI,sBAAsB,GAAG,KAAI,CAAC,KAAK,IAAI,KAAI,CAAC,KAAK,CAAC;gBAExF,IAAM,gBAAgB,GAAG,KAAI,CAAC,KAAK,CAAC,YAAY,GAAG,KAAK,CAAC,MAAM,CAAC,SAAS,CAAC;gBAE1E,IAAI,CAAC,gBAAgB,GAAG,SAAS,KAAK,sBAAsB,EAAE;oBAC5D,KAAI,CAAC,MAAM,CAAC,GAAG,CAAC,cAAM,OAAA,KAAI,CAAC,cAAc,CAAC,IAAI,EAAE,GAAA,CAAC,CAAC;iBACnD;aACF,CAAC,CAAC;SACJ;QAED,gEAAqB,GAArB;YACE,OAAO,UAAU,CAAC,gBAAgB,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,QAAQ,CAAC,GAAG,qBAAqB,CAAC;SAClF;;;uJA9EU,gCAAgC;gIAAhC,gCAAgC;qHAAhC,gCAAgC;sBAH5CC,YAAS;uBAAC;wBACT,QAAQ,EAAE,oBAAoB;qBAC/B;+IAGU,SAAS;0BAAjBC,QAAK;oBACG,YAAY;0BAApBA,QAAK;oBACG,QAAQ;0BAAhBA,QAAK;oBACI,cAAc;0BAAvBC,SAAM;;;;QCLT;;;;oJAAa,6BAA6B;qJAA7B,6BAA6B,iBANzB,gCAAgC,aAE7CC,kBAAe,aAEP,gCAAgC;qJAE/B,6BAA6B,YAL/B;gBACPA,kBAAe;aAChB;qHAGU,6BAA6B;sBAPzCC,WAAQ;uBAAC;wBACR,YAAY,EAAE,CAAC,gCAAgC,CAAC;wBAChD,OAAO,EAAE;4BACPD,kBAAe;yBAChB;wBACD,OAAO,EAAE,CAAC,gCAAgC,CAAC;qBAC5C;;;ICVD;;;;ICAA;;;;;;;;;;;;;"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"ng-mat-select-infinite-scroll.js","sources":["../../../projects/ng-mat-select-infinite-scroll/src/lib/mat-select-infinite-scroll.directive.ts","../../../projects/ng-mat-select-infinite-scroll/src/lib/mat-select-infinite-scroll.module.ts","../../../projects/ng-mat-select-infinite-scroll/src/public-api.ts","../../../projects/ng-mat-select-infinite-scroll/src/ng-mat-select-infinite-scroll.ts"],"sourcesContent":["import {AfterViewInit, Directive, EventEmitter, Input, NgZone, OnDestroy, OnInit, Output} from '@angular/core';\nimport {MatSelect} from '@angular/material/select';\nimport {debounceTime, takeUntil, tap} from 'rxjs/operators';\nimport {fromEvent, Subject} from 'rxjs';\n\n/** The height of the select items in `em` units. */\nconst SELECT_ITEM_HEIGHT_EM = 3;\n\n@Directive({\n selector: '[msInfiniteScroll]'\n})\nexport class MatSelectInfiniteScrollDirective implements OnInit, OnDestroy, AfterViewInit {\n\n @Input() threshold = '15%';\n @Input() debounceTime = 150;\n @Input() complete!: boolean;\n @Output() infiniteScroll = new EventEmitter<void>();\n\n private panel!: Element;\n private thrPx = 0;\n private thrPc = 0;\n private singleOptionHeight = SELECT_ITEM_HEIGHT_EM;\n\n private destroyed$ = new Subject<boolean>();\n\n constructor(private matSelect: MatSelect, private ngZone: NgZone) {\n }\n\n ngOnInit() {\n this.evaluateThreshold();\n }\n\n ngAfterViewInit() {\n this.matSelect.openedChange.pipe(\n takeUntil(this.destroyed$)\n ).subscribe((opened) => {\n if (opened) {\n this.panel = this.matSelect.panel.nativeElement;\n this.singleOptionHeight = this.getSelectItemHeightPx();\n this.registerScrollListener();\n }\n });\n }\n\n ngOnDestroy() {\n this.destroyed$.next(true);\n this.destroyed$.complete();\n }\n\n evaluateThreshold() {\n if (this.threshold.lastIndexOf('%') > -1) {\n this.thrPx = 0;\n this.thrPc = (parseFloat(this.threshold) / 100);\n\n } else {\n this.thrPx = parseFloat(this.threshold);\n this.thrPc = 0;\n }\n }\n\n registerScrollListener() {\n fromEvent(this.panel, 'scroll').pipe(\n takeUntil(this.destroyed$),\n debounceTime(this.debounceTime),\n tap((event) => {\n this.handleScrollEvent(event);\n })\n ).subscribe();\n }\n\n handleScrollEvent(event: any) {\n this.ngZone.runOutsideAngular(() => {\n if (this.complete) {\n return;\n }\n const countOfRenderedOptions = this.matSelect.options.length;\n const infiniteScrollDistance = this.singleOptionHeight * countOfRenderedOptions;\n const threshold = this.thrPc !== 0 ? (infiniteScrollDistance * this.thrPc) : this.thrPx;\n\n const scrolledDistance = this.panel.clientHeight + event.target.scrollTop;\n\n if ((scrolledDistance + threshold) >= infiniteScrollDistance) {\n this.ngZone.run(() => this.infiniteScroll.emit());\n }\n });\n }\n\n getSelectItemHeightPx(): number {\n return parseFloat(getComputedStyle(this.panel).fontSize) * SELECT_ITEM_HEIGHT_EM;\n }\n\n}\n","import {NgModule} from '@angular/core';\nimport {MatSelectInfiniteScrollDirective} from './mat-select-infinite-scroll.directive';\nimport {MatSelectModule} from '@angular/material/select';\n\n@NgModule({\n declarations: [MatSelectInfiniteScrollDirective],\n imports: [\n MatSelectModule\n ],\n exports: [MatSelectInfiniteScrollDirective]\n})\nexport class MatSelectInfiniteScrollModule {\n}\n","/*\n * Public API Surface of ng-mat-select-infinite-scroll\n */\n\nexport * from './lib/mat-select-infinite-scroll.directive';\nexport * from './lib/mat-select-infinite-scroll.module';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}