@vallift/ngl 22.0.1 → 22.0.2
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/fesm2022/vallift-ngl.mjs +464 -6
- package/fesm2022/vallift-ngl.mjs.map +1 -1
- package/package.json +1 -1
- package/types/vallift-ngl.d.ts +59 -3
package/fesm2022/vallift-ngl.mjs
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { InjectionToken, inject, Injectable, signal, input, output, Component, Input, ElementRef, DOCUMENT, Renderer2, EventEmitter, Output, RendererFactory2, HostListener, Directive, computed, ChangeDetectorRef, model, ViewChild, ViewContainerRef, ComponentFactoryResolver, ApplicationRef, Injector, Inject, Pipe, ContentChildren, ChangeDetectionStrategy, effect, viewChild, DestroyRef, ViewChildren, makeEnvironmentProviders, PLATFORM_ID } from '@angular/core';
|
|
2
|
+
import { InjectionToken, inject, Injectable, signal, input, output, Component, Input, ElementRef, DOCUMENT, Renderer2, EventEmitter, Output, RendererFactory2, HostListener, Directive, computed, ChangeDetectorRef, model, ViewChild, ViewContainerRef, ComponentFactoryResolver, ApplicationRef, Injector, Inject, Pipe, ContentChildren, ChangeDetectionStrategy, effect, viewChild, DestroyRef, ViewChildren, makeEnvironmentProviders, PLATFORM_ID, NgModule } from '@angular/core';
|
|
3
3
|
import * as i1$1 from '@angular/common/http';
|
|
4
4
|
import { HttpClient, HttpHeaders, HttpRequest } from '@angular/common/http';
|
|
5
5
|
import { retry, throwError, Subject, debounceTime, fromEvent, filter as filter$1, take, combineLatest, of } from 'rxjs';
|
|
6
|
-
import { map, catchError, filter, delay } from 'rxjs/operators';
|
|
6
|
+
import { map, catchError, filter, delay, mergeMap, tap, throttleTime } from 'rxjs/operators';
|
|
7
7
|
import * as i1 from '@angular/forms';
|
|
8
8
|
import { FormControl, NgControl, FormGroupDirective, FormsModule, ReactiveFormsModule, FormGroup } from '@angular/forms';
|
|
9
9
|
import { Router, NavigationStart, NavigationEnd } from '@angular/router';
|
|
@@ -14,7 +14,7 @@ import { NgClass, NgStyle, CommonModule, DatePipe, DOCUMENT as DOCUMENT$1, isPla
|
|
|
14
14
|
import { SvgIconComponent } from 'angular-svg-icon';
|
|
15
15
|
import { CdkPortal, ComponentPortal } from '@angular/cdk/portal';
|
|
16
16
|
import { NgxMaskDirective, provideEnvironmentNgxMask } from 'ngx-mask';
|
|
17
|
-
import { InfiniteScrollDirective } from 'ngx-infinite-scroll';
|
|
17
|
+
import { InfiniteScrollDirective as InfiniteScrollDirective$1 } from 'ngx-infinite-scroll';
|
|
18
18
|
import * as i2 from '@angular/platform-browser';
|
|
19
19
|
import { isValidDate } from 'rxjs/internal/util/isDate';
|
|
20
20
|
import { toObservable, takeUntilDestroyed } from '@angular/core/rxjs-interop';
|
|
@@ -3266,12 +3266,12 @@ class ListviewComponent {
|
|
|
3266
3266
|
this.onActionPerformed.emit($event);
|
|
3267
3267
|
}
|
|
3268
3268
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: ListviewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3269
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: ListviewComponent, isStandalone: true, selector: "app-listview", inputs: { state: { classPropertyName: "state", publicName: "state", isSignal: true, isRequired: true, transformFunction: null }, data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null }, pageSize: { classPropertyName: "pageSize", publicName: "pageSize", isSignal: true, isRequired: false, transformFunction: null }, component: { classPropertyName: "component", publicName: "component", isSignal: true, isRequired: true, transformFunction: null }, enableSearch: { classPropertyName: "enableSearch", publicName: "enableSearch", isSignal: true, isRequired: false, transformFunction: null }, enableSearchFullWidth: { classPropertyName: "enableSearchFullWidth", publicName: "enableSearchFullWidth", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onStateChanged: "onStateChanged", onActionPerformed: "onActionPerformed" }, ngImport: i0, template: "<div class=\"h-full flex flex-col gap-4\">\n\n @if (enableSearch()) {\n <app-text-input\n title=\"Search...\"\n [iconSrc]=\"'assets/icons/search.svg'\"\n placeholder=\"Search...\"\n type=\"search\"\n [fullWidth]=\"enableSearchFullWidth()\"\n (changeValue)=\"onSearchTextChanged($event)\">\n </app-text-input>\n }\n\n @if (state().success() && state().items().length <= 0) {\n <div class=\"flex flex-col justify-center items-center gap-8 px-6 py-8\">\n <app-no-data-table></app-no-data-table>\n </div>\n }\n\n @if (state().items().length > 0) {\n <div class=\"flex flex-col overflow-auto\"\n infiniteScroll\n [infiniteScrollDistance]=\"2\"\n [infiniteScrollThrottle]=\"50\"\n (scrolled)=\"onScroll()\">\n @for (item of state().items(); track $index) {\n <app-dynamic-renderer\n [component]=\"component()\"\n [rowData]=\"item\"\n [data]=\"data()\"\n [rowPosition]=\"$index\"\n [isLastRow]=\"$last\"\n (actionPerformed)=\"onRowAction($event)\">\n </app-dynamic-renderer>\n }\n </div>\n }\n\n <!-- Shimmer-->\n @if (state().loading()) {\n <div class=\"flex flex-col gap-6 py-4\">\n <app-shimmer type=\"multiline\"></app-shimmer>\n <app-shimmer type=\"multiline\"></app-shimmer>\n <app-shimmer type=\"multiline\"></app-shimmer>\n <app-shimmer type=\"multiline\"></app-shimmer>\n <app-shimmer type=\"multiline\"></app-shimmer>\n <app-shimmer type=\"multiline\"></app-shimmer>\n <app-shimmer type=\"multiline\"></app-shimmer>\n <app-shimmer type=\"multiline\"></app-shimmer>\n <app-shimmer type=\"multiline\"></app-shimmer>\n <app-shimmer type=\"multiline\"></app-shimmer>\n <app-shimmer type=\"multiline\"></app-shimmer>\n </div>\n }\n\n\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: InfiniteScrollDirective, selector: "[infiniteScroll], [infinite-scroll], [data-infinite-scroll]", inputs: ["infiniteScrollDistance", "infiniteScrollUpDistance", "infiniteScrollThrottle", "infiniteScrollDisabled", "infiniteScrollContainer", "scrollWindow", "immediateCheck", "horizontal", "alwaysCallback", "fromRoot"], outputs: ["scrolled", "scrolledUp"] }, { kind: "component", type: TextInputComponent, selector: "app-text-input", inputs: ["appearance", "type", "viewType", "size", "iconSrc", "actionIcon", "label", "fullWidth", "placeholder", "errorMessages", "showErrorSpace", "mask", "debounceSearchEnabled", "autoFocus"], outputs: ["changeValue", "actionIconClicked"] }, { kind: "component", type: DynamicRendererComponent, selector: "app-dynamic-renderer", inputs: ["component", "rowData", "data", "rowPosition", "isLastRow"], outputs: ["actionPerformed"] }, { kind: "component", type: ShimmerComponent, selector: "app-shimmer", inputs: ["type", "count"] }, { kind: "component", type: NoDataTableComponent, selector: "app-no-data-table", inputs: ["message"] }] });
|
|
3269
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: ListviewComponent, isStandalone: true, selector: "app-listview", inputs: { state: { classPropertyName: "state", publicName: "state", isSignal: true, isRequired: true, transformFunction: null }, data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null }, pageSize: { classPropertyName: "pageSize", publicName: "pageSize", isSignal: true, isRequired: false, transformFunction: null }, component: { classPropertyName: "component", publicName: "component", isSignal: true, isRequired: true, transformFunction: null }, enableSearch: { classPropertyName: "enableSearch", publicName: "enableSearch", isSignal: true, isRequired: false, transformFunction: null }, enableSearchFullWidth: { classPropertyName: "enableSearchFullWidth", publicName: "enableSearchFullWidth", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onStateChanged: "onStateChanged", onActionPerformed: "onActionPerformed" }, ngImport: i0, template: "<div class=\"h-full flex flex-col gap-4\">\n\n @if (enableSearch()) {\n <app-text-input\n title=\"Search...\"\n [iconSrc]=\"'assets/icons/search.svg'\"\n placeholder=\"Search...\"\n type=\"search\"\n [fullWidth]=\"enableSearchFullWidth()\"\n (changeValue)=\"onSearchTextChanged($event)\">\n </app-text-input>\n }\n\n @if (state().success() && state().items().length <= 0) {\n <div class=\"flex flex-col justify-center items-center gap-8 px-6 py-8\">\n <app-no-data-table></app-no-data-table>\n </div>\n }\n\n @if (state().items().length > 0) {\n <div class=\"flex flex-col overflow-auto\"\n infiniteScroll\n [infiniteScrollDistance]=\"2\"\n [infiniteScrollThrottle]=\"50\"\n (scrolled)=\"onScroll()\">\n @for (item of state().items(); track $index) {\n <app-dynamic-renderer\n [component]=\"component()\"\n [rowData]=\"item\"\n [data]=\"data()\"\n [rowPosition]=\"$index\"\n [isLastRow]=\"$last\"\n (actionPerformed)=\"onRowAction($event)\">\n </app-dynamic-renderer>\n }\n </div>\n }\n\n <!-- Shimmer-->\n @if (state().loading()) {\n <div class=\"flex flex-col gap-6 py-4\">\n <app-shimmer type=\"multiline\"></app-shimmer>\n <app-shimmer type=\"multiline\"></app-shimmer>\n <app-shimmer type=\"multiline\"></app-shimmer>\n <app-shimmer type=\"multiline\"></app-shimmer>\n <app-shimmer type=\"multiline\"></app-shimmer>\n <app-shimmer type=\"multiline\"></app-shimmer>\n <app-shimmer type=\"multiline\"></app-shimmer>\n <app-shimmer type=\"multiline\"></app-shimmer>\n <app-shimmer type=\"multiline\"></app-shimmer>\n <app-shimmer type=\"multiline\"></app-shimmer>\n <app-shimmer type=\"multiline\"></app-shimmer>\n </div>\n }\n\n\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: InfiniteScrollDirective$1, selector: "[infiniteScroll], [infinite-scroll], [data-infinite-scroll]", inputs: ["infiniteScrollDistance", "infiniteScrollUpDistance", "infiniteScrollThrottle", "infiniteScrollDisabled", "infiniteScrollContainer", "scrollWindow", "immediateCheck", "horizontal", "alwaysCallback", "fromRoot"], outputs: ["scrolled", "scrolledUp"] }, { kind: "component", type: TextInputComponent, selector: "app-text-input", inputs: ["appearance", "type", "viewType", "size", "iconSrc", "actionIcon", "label", "fullWidth", "placeholder", "errorMessages", "showErrorSpace", "mask", "debounceSearchEnabled", "autoFocus"], outputs: ["changeValue", "actionIconClicked"] }, { kind: "component", type: DynamicRendererComponent, selector: "app-dynamic-renderer", inputs: ["component", "rowData", "data", "rowPosition", "isLastRow"], outputs: ["actionPerformed"] }, { kind: "component", type: ShimmerComponent, selector: "app-shimmer", inputs: ["type", "count"] }, { kind: "component", type: NoDataTableComponent, selector: "app-no-data-table", inputs: ["message"] }] });
|
|
3270
3270
|
}
|
|
3271
3271
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: ListviewComponent, decorators: [{
|
|
3272
3272
|
type: Component,
|
|
3273
3273
|
args: [{ selector: 'app-listview', imports: [
|
|
3274
|
-
InfiniteScrollDirective,
|
|
3274
|
+
InfiniteScrollDirective$1,
|
|
3275
3275
|
TextInputComponent,
|
|
3276
3276
|
DynamicRendererComponent,
|
|
3277
3277
|
ShimmerComponent,
|
|
@@ -13002,9 +13002,467 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
|
|
|
13002
13002
|
}]
|
|
13003
13003
|
}] });
|
|
13004
13004
|
|
|
13005
|
+
function resolveContainerElement(selector, scrollWindow, defaultElement, fromRoot) {
|
|
13006
|
+
const hasWindow = window && !!window.document && window.document.documentElement;
|
|
13007
|
+
let container = hasWindow && scrollWindow ? window : defaultElement;
|
|
13008
|
+
if (selector) {
|
|
13009
|
+
const containerIsString = selector && hasWindow && typeof selector === 'string';
|
|
13010
|
+
container = containerIsString
|
|
13011
|
+
? findElement(selector, defaultElement.nativeElement, fromRoot)
|
|
13012
|
+
: selector;
|
|
13013
|
+
if (!container) {
|
|
13014
|
+
throw new Error('ngx-infinite-scroll {resolveContainerElement()}: selector for');
|
|
13015
|
+
}
|
|
13016
|
+
}
|
|
13017
|
+
return container;
|
|
13018
|
+
}
|
|
13019
|
+
function findElement(selector, customRoot, fromRoot) {
|
|
13020
|
+
const rootEl = fromRoot ? window.document : customRoot;
|
|
13021
|
+
return rootEl.querySelector(selector);
|
|
13022
|
+
}
|
|
13023
|
+
function inputPropChanged(prop) {
|
|
13024
|
+
return prop && !prop.firstChange;
|
|
13025
|
+
}
|
|
13026
|
+
function hasWindowDefined() {
|
|
13027
|
+
return typeof window !== 'undefined';
|
|
13028
|
+
}
|
|
13029
|
+
|
|
13030
|
+
const VerticalProps = {
|
|
13031
|
+
clientHeight: "clientHeight",
|
|
13032
|
+
offsetHeight: "offsetHeight",
|
|
13033
|
+
scrollHeight: "scrollHeight",
|
|
13034
|
+
pageYOffset: "pageYOffset",
|
|
13035
|
+
offsetTop: "offsetTop",
|
|
13036
|
+
scrollTop: "scrollTop",
|
|
13037
|
+
top: "top"
|
|
13038
|
+
};
|
|
13039
|
+
const HorizontalProps = {
|
|
13040
|
+
clientHeight: "clientWidth",
|
|
13041
|
+
offsetHeight: "offsetWidth",
|
|
13042
|
+
scrollHeight: "scrollWidth",
|
|
13043
|
+
pageYOffset: "pageXOffset",
|
|
13044
|
+
offsetTop: "offsetLeft",
|
|
13045
|
+
scrollTop: "scrollLeft",
|
|
13046
|
+
top: "left"
|
|
13047
|
+
};
|
|
13048
|
+
class AxisResolver {
|
|
13049
|
+
vertical;
|
|
13050
|
+
propsMap;
|
|
13051
|
+
constructor(vertical = true) {
|
|
13052
|
+
this.vertical = vertical;
|
|
13053
|
+
this.propsMap = vertical ? VerticalProps : HorizontalProps;
|
|
13054
|
+
}
|
|
13055
|
+
clientHeightKey() {
|
|
13056
|
+
return this.propsMap.clientHeight;
|
|
13057
|
+
}
|
|
13058
|
+
offsetHeightKey() {
|
|
13059
|
+
return this.propsMap.offsetHeight;
|
|
13060
|
+
}
|
|
13061
|
+
scrollHeightKey() {
|
|
13062
|
+
return this.propsMap.scrollHeight;
|
|
13063
|
+
}
|
|
13064
|
+
pageYOffsetKey() {
|
|
13065
|
+
return this.propsMap.pageYOffset;
|
|
13066
|
+
}
|
|
13067
|
+
offsetTopKey() {
|
|
13068
|
+
return this.propsMap.offsetTop;
|
|
13069
|
+
}
|
|
13070
|
+
scrollTopKey() {
|
|
13071
|
+
return this.propsMap.scrollTop;
|
|
13072
|
+
}
|
|
13073
|
+
topKey() {
|
|
13074
|
+
return this.propsMap.top;
|
|
13075
|
+
}
|
|
13076
|
+
}
|
|
13077
|
+
|
|
13078
|
+
function shouldTriggerEvents(alwaysCallback, shouldFireScrollEvent, isTriggeredCurrentTotal) {
|
|
13079
|
+
if (alwaysCallback && shouldFireScrollEvent) {
|
|
13080
|
+
return true;
|
|
13081
|
+
}
|
|
13082
|
+
if (!isTriggeredCurrentTotal && shouldFireScrollEvent) {
|
|
13083
|
+
return true;
|
|
13084
|
+
}
|
|
13085
|
+
return false;
|
|
13086
|
+
}
|
|
13087
|
+
|
|
13088
|
+
function createResolver({ windowElement, axis, }) {
|
|
13089
|
+
return createResolverWithContainer({ axis, isWindow: isElementWindow(windowElement) }, windowElement);
|
|
13090
|
+
}
|
|
13091
|
+
function createResolverWithContainer(resolver, windowElement) {
|
|
13092
|
+
const container = resolver.isWindow || (windowElement && !windowElement.nativeElement)
|
|
13093
|
+
? windowElement
|
|
13094
|
+
: windowElement.nativeElement;
|
|
13095
|
+
return { ...resolver, container };
|
|
13096
|
+
}
|
|
13097
|
+
function isElementWindow(windowElement) {
|
|
13098
|
+
const isWindow = ['Window', 'global'].some((obj) => Object.prototype.toString.call(windowElement).includes(obj));
|
|
13099
|
+
return isWindow;
|
|
13100
|
+
}
|
|
13101
|
+
function getDocumentElement(isContainerWindow, windowElement) {
|
|
13102
|
+
return isContainerWindow ? windowElement.document.documentElement : null;
|
|
13103
|
+
}
|
|
13104
|
+
function calculatePoints(element, resolver) {
|
|
13105
|
+
const height = extractHeightForElement(resolver);
|
|
13106
|
+
return resolver.isWindow
|
|
13107
|
+
? calculatePointsForWindow(height, element, resolver)
|
|
13108
|
+
: calculatePointsForElement(height, element, resolver);
|
|
13109
|
+
}
|
|
13110
|
+
function calculatePointsForWindow(height, element, resolver) {
|
|
13111
|
+
const { axis, container, isWindow } = resolver;
|
|
13112
|
+
const { offsetHeightKey, clientHeightKey } = extractHeightPropKeys(axis);
|
|
13113
|
+
// scrolled until now / current y point
|
|
13114
|
+
const scrolled = height +
|
|
13115
|
+
getElementPageYOffset(getDocumentElement(isWindow, container), axis, isWindow);
|
|
13116
|
+
// total height / most bottom y point
|
|
13117
|
+
const nativeElementHeight = getElementHeight(element.nativeElement, isWindow, offsetHeightKey, clientHeightKey);
|
|
13118
|
+
const totalToScroll = getElementOffsetTop(element.nativeElement, axis, isWindow) +
|
|
13119
|
+
nativeElementHeight;
|
|
13120
|
+
return { height, scrolled, totalToScroll, isWindow };
|
|
13121
|
+
}
|
|
13122
|
+
function calculatePointsForElement(height, element, resolver) {
|
|
13123
|
+
const { axis, container } = resolver;
|
|
13124
|
+
// perhaps use container.offsetTop instead of 'scrollTop'
|
|
13125
|
+
const scrolled = container[axis.scrollTopKey()];
|
|
13126
|
+
const totalToScroll = container[axis.scrollHeightKey()];
|
|
13127
|
+
return { height, scrolled, totalToScroll, isWindow: false };
|
|
13128
|
+
}
|
|
13129
|
+
function extractHeightPropKeys(axis) {
|
|
13130
|
+
return {
|
|
13131
|
+
offsetHeightKey: axis.offsetHeightKey(),
|
|
13132
|
+
clientHeightKey: axis.clientHeightKey(),
|
|
13133
|
+
};
|
|
13134
|
+
}
|
|
13135
|
+
function extractHeightForElement({ container, isWindow, axis, }) {
|
|
13136
|
+
const { offsetHeightKey, clientHeightKey } = extractHeightPropKeys(axis);
|
|
13137
|
+
return getElementHeight(container, isWindow, offsetHeightKey, clientHeightKey);
|
|
13138
|
+
}
|
|
13139
|
+
function getElementHeight(elem, isWindow, offsetHeightKey, clientHeightKey) {
|
|
13140
|
+
if (isNaN(elem[offsetHeightKey])) {
|
|
13141
|
+
const docElem = getDocumentElement(isWindow, elem);
|
|
13142
|
+
return docElem ? docElem[clientHeightKey] : 0;
|
|
13143
|
+
}
|
|
13144
|
+
else {
|
|
13145
|
+
return elem[offsetHeightKey];
|
|
13146
|
+
}
|
|
13147
|
+
}
|
|
13148
|
+
function getElementOffsetTop(elem, axis, isWindow) {
|
|
13149
|
+
const topKey = axis.topKey();
|
|
13150
|
+
// elem = elem.nativeElement;
|
|
13151
|
+
if (!elem.getBoundingClientRect) {
|
|
13152
|
+
// || elem.css('none')) {
|
|
13153
|
+
return;
|
|
13154
|
+
}
|
|
13155
|
+
return (elem.getBoundingClientRect()[topKey] +
|
|
13156
|
+
getElementPageYOffset(elem, axis, isWindow));
|
|
13157
|
+
}
|
|
13158
|
+
function getElementPageYOffset(elem, axis, isWindow) {
|
|
13159
|
+
const pageYOffset = axis.pageYOffsetKey();
|
|
13160
|
+
const scrollTop = axis.scrollTopKey();
|
|
13161
|
+
const offsetTop = axis.offsetTopKey();
|
|
13162
|
+
if (isNaN(window.pageYOffset)) {
|
|
13163
|
+
return getDocumentElement(isWindow, elem)[scrollTop];
|
|
13164
|
+
}
|
|
13165
|
+
else if (elem.ownerDocument) {
|
|
13166
|
+
return elem.ownerDocument.defaultView[pageYOffset];
|
|
13167
|
+
}
|
|
13168
|
+
else {
|
|
13169
|
+
return elem[offsetTop];
|
|
13170
|
+
}
|
|
13171
|
+
}
|
|
13172
|
+
|
|
13173
|
+
function shouldFireScrollEvent(container, distance = { down: 0, up: 0 }, scrollingDown) {
|
|
13174
|
+
let remaining;
|
|
13175
|
+
let containerBreakpoint;
|
|
13176
|
+
if (container.totalToScroll <= 0) {
|
|
13177
|
+
return false;
|
|
13178
|
+
}
|
|
13179
|
+
const scrolledUntilNow = container.isWindow
|
|
13180
|
+
? container.scrolled
|
|
13181
|
+
: container.height + container.scrolled;
|
|
13182
|
+
if (scrollingDown) {
|
|
13183
|
+
remaining =
|
|
13184
|
+
(container.totalToScroll - scrolledUntilNow) / container.totalToScroll;
|
|
13185
|
+
const distanceDown = distance?.down ? distance.down : 0;
|
|
13186
|
+
containerBreakpoint = distanceDown / 10;
|
|
13187
|
+
}
|
|
13188
|
+
else {
|
|
13189
|
+
const totalHiddenContentHeight = container.scrolled + (container.totalToScroll - scrolledUntilNow);
|
|
13190
|
+
remaining = container.scrolled / totalHiddenContentHeight;
|
|
13191
|
+
const distanceUp = distance?.up ? distance.up : 0;
|
|
13192
|
+
containerBreakpoint = distanceUp / 10;
|
|
13193
|
+
}
|
|
13194
|
+
const shouldFireEvent = remaining <= containerBreakpoint;
|
|
13195
|
+
return shouldFireEvent;
|
|
13196
|
+
}
|
|
13197
|
+
function isScrollingDownwards(lastScrollPosition, container) {
|
|
13198
|
+
return lastScrollPosition < container.scrolled;
|
|
13199
|
+
}
|
|
13200
|
+
function getScrollStats(lastScrollPosition, container, distance) {
|
|
13201
|
+
const scrollDown = isScrollingDownwards(lastScrollPosition, container);
|
|
13202
|
+
return {
|
|
13203
|
+
fire: shouldFireScrollEvent(container, distance, scrollDown),
|
|
13204
|
+
scrollDown,
|
|
13205
|
+
};
|
|
13206
|
+
}
|
|
13207
|
+
function updateScrollPosition(position, scrollState) {
|
|
13208
|
+
return (scrollState.lastScrollPosition = position);
|
|
13209
|
+
}
|
|
13210
|
+
function updateTotalToScroll(totalToScroll, scrollState) {
|
|
13211
|
+
if (scrollState.lastTotalToScroll !== totalToScroll) {
|
|
13212
|
+
scrollState.lastTotalToScroll = scrollState.totalToScroll;
|
|
13213
|
+
scrollState.totalToScroll = totalToScroll;
|
|
13214
|
+
}
|
|
13215
|
+
}
|
|
13216
|
+
function isSameTotalToScroll(scrollState) {
|
|
13217
|
+
return scrollState.totalToScroll === scrollState.lastTotalToScroll;
|
|
13218
|
+
}
|
|
13219
|
+
function updateTriggeredFlag(scroll, scrollState, triggered, isScrollingDown) {
|
|
13220
|
+
if (isScrollingDown) {
|
|
13221
|
+
scrollState.triggered.down = scroll;
|
|
13222
|
+
}
|
|
13223
|
+
else {
|
|
13224
|
+
scrollState.triggered.up = scroll;
|
|
13225
|
+
}
|
|
13226
|
+
}
|
|
13227
|
+
function isTriggeredScroll(totalToScroll, scrollState, isScrollingDown) {
|
|
13228
|
+
return isScrollingDown
|
|
13229
|
+
? scrollState.triggered.down === totalToScroll
|
|
13230
|
+
: scrollState.triggered.up === totalToScroll;
|
|
13231
|
+
}
|
|
13232
|
+
function updateScrollState(scrollState, scrolledUntilNow, totalToScroll) {
|
|
13233
|
+
updateScrollPosition(scrolledUntilNow, scrollState);
|
|
13234
|
+
updateTotalToScroll(totalToScroll, scrollState);
|
|
13235
|
+
// const isSameTotal = isSameTotalToScroll(scrollState);
|
|
13236
|
+
// if (!isSameTotal) {
|
|
13237
|
+
// updateTriggeredFlag(scrollState, false, isScrollingDown);
|
|
13238
|
+
// }
|
|
13239
|
+
}
|
|
13240
|
+
|
|
13241
|
+
class ScrollState {
|
|
13242
|
+
lastScrollPosition = 0;
|
|
13243
|
+
lastTotalToScroll = 0;
|
|
13244
|
+
totalToScroll = 0;
|
|
13245
|
+
triggered = {
|
|
13246
|
+
down: 0,
|
|
13247
|
+
up: 0,
|
|
13248
|
+
};
|
|
13249
|
+
constructor(attrs) {
|
|
13250
|
+
Object.assign(this, attrs);
|
|
13251
|
+
}
|
|
13252
|
+
updateScrollPosition(position) {
|
|
13253
|
+
return (this.lastScrollPosition = position);
|
|
13254
|
+
}
|
|
13255
|
+
updateTotalToScroll(totalToScroll) {
|
|
13256
|
+
if (this.lastTotalToScroll !== totalToScroll) {
|
|
13257
|
+
this.lastTotalToScroll = this.totalToScroll;
|
|
13258
|
+
this.totalToScroll = totalToScroll;
|
|
13259
|
+
}
|
|
13260
|
+
}
|
|
13261
|
+
updateScroll(scrolledUntilNow, totalToScroll) {
|
|
13262
|
+
this.updateScrollPosition(scrolledUntilNow);
|
|
13263
|
+
this.updateTotalToScroll(totalToScroll);
|
|
13264
|
+
}
|
|
13265
|
+
updateTriggeredFlag(scroll, isScrollingDown) {
|
|
13266
|
+
if (isScrollingDown) {
|
|
13267
|
+
this.triggered.down = scroll;
|
|
13268
|
+
}
|
|
13269
|
+
else {
|
|
13270
|
+
this.triggered.up = scroll;
|
|
13271
|
+
}
|
|
13272
|
+
}
|
|
13273
|
+
isTriggeredScroll(totalToScroll, isScrollingDown) {
|
|
13274
|
+
return isScrollingDown
|
|
13275
|
+
? this.triggered.down === totalToScroll
|
|
13276
|
+
: this.triggered.up === totalToScroll;
|
|
13277
|
+
}
|
|
13278
|
+
}
|
|
13279
|
+
|
|
13280
|
+
function createScroller(config) {
|
|
13281
|
+
const { scrollContainer, scrollWindow, element, fromRoot } = config;
|
|
13282
|
+
const resolver = createResolver({
|
|
13283
|
+
axis: new AxisResolver(!config.horizontal),
|
|
13284
|
+
windowElement: resolveContainerElement(scrollContainer, scrollWindow, element, fromRoot),
|
|
13285
|
+
});
|
|
13286
|
+
const scrollState = new ScrollState({
|
|
13287
|
+
totalToScroll: calculatePoints(element, resolver).totalToScroll,
|
|
13288
|
+
});
|
|
13289
|
+
const options = {
|
|
13290
|
+
container: resolver.container,
|
|
13291
|
+
throttle: config.throttle,
|
|
13292
|
+
};
|
|
13293
|
+
const distance = {
|
|
13294
|
+
up: config.upDistance,
|
|
13295
|
+
down: config.downDistance,
|
|
13296
|
+
};
|
|
13297
|
+
return attachScrollEvent(options).pipe(mergeMap(() => of(calculatePoints(element, resolver))), map((positionStats) => toInfiniteScrollParams(scrollState.lastScrollPosition, positionStats, distance)), tap(({ stats }) => scrollState.updateScroll(stats.scrolled, stats.totalToScroll)), filter(({ fire, scrollDown, stats: { totalToScroll } }) => shouldTriggerEvents(config.alwaysCallback, fire, scrollState.isTriggeredScroll(totalToScroll, scrollDown))), tap(({ scrollDown, stats: { totalToScroll } }) => {
|
|
13298
|
+
scrollState.updateTriggeredFlag(totalToScroll, scrollDown);
|
|
13299
|
+
}), map(toInfiniteScrollAction));
|
|
13300
|
+
}
|
|
13301
|
+
function attachScrollEvent(options) {
|
|
13302
|
+
let obs = fromEvent(options.container, 'scroll');
|
|
13303
|
+
// For an unknown reason calling `sampleTime()` causes trouble for many users, even with `options.throttle = 0`.
|
|
13304
|
+
// Let's avoid calling the function unless needed.
|
|
13305
|
+
// Replacing with throttleTime seems to solve the problem
|
|
13306
|
+
// See https://github.com/orizens/ngx-infinite-scroll/issues/198
|
|
13307
|
+
if (options.throttle) {
|
|
13308
|
+
obs = obs.pipe(throttleTime(options.throttle, undefined, {
|
|
13309
|
+
leading: true,
|
|
13310
|
+
trailing: true,
|
|
13311
|
+
}));
|
|
13312
|
+
}
|
|
13313
|
+
return obs;
|
|
13314
|
+
}
|
|
13315
|
+
function toInfiniteScrollParams(lastScrollPosition, stats, distance) {
|
|
13316
|
+
const { scrollDown, fire } = getScrollStats(lastScrollPosition, stats, distance);
|
|
13317
|
+
return {
|
|
13318
|
+
scrollDown,
|
|
13319
|
+
fire,
|
|
13320
|
+
stats,
|
|
13321
|
+
};
|
|
13322
|
+
}
|
|
13323
|
+
const InfiniteScrollActions = {
|
|
13324
|
+
DOWN: '[NGX_ISE] DOWN',
|
|
13325
|
+
UP: '[NGX_ISE] UP',
|
|
13326
|
+
};
|
|
13327
|
+
function toInfiniteScrollAction(response) {
|
|
13328
|
+
const { scrollDown, stats: { scrolled: currentScrollPosition }, } = response;
|
|
13329
|
+
return {
|
|
13330
|
+
type: scrollDown ? InfiniteScrollActions.DOWN : InfiniteScrollActions.UP,
|
|
13331
|
+
payload: {
|
|
13332
|
+
currentScrollPosition,
|
|
13333
|
+
},
|
|
13334
|
+
};
|
|
13335
|
+
}
|
|
13336
|
+
|
|
13337
|
+
class InfiniteScrollDirective {
|
|
13338
|
+
element;
|
|
13339
|
+
zone;
|
|
13340
|
+
scrolled = new EventEmitter();
|
|
13341
|
+
scrolledUp = new EventEmitter();
|
|
13342
|
+
infiniteScrollDistance = 2;
|
|
13343
|
+
infiniteScrollUpDistance = 1.5;
|
|
13344
|
+
infiniteScrollThrottle = 150;
|
|
13345
|
+
infiniteScrollDisabled = false;
|
|
13346
|
+
infiniteScrollContainer = null;
|
|
13347
|
+
scrollWindow = true;
|
|
13348
|
+
immediateCheck = false;
|
|
13349
|
+
horizontal = false;
|
|
13350
|
+
alwaysCallback = false;
|
|
13351
|
+
fromRoot = false;
|
|
13352
|
+
disposeScroller;
|
|
13353
|
+
constructor(element, zone) {
|
|
13354
|
+
this.element = element;
|
|
13355
|
+
this.zone = zone;
|
|
13356
|
+
}
|
|
13357
|
+
ngAfterViewInit() {
|
|
13358
|
+
if (!this.infiniteScrollDisabled) {
|
|
13359
|
+
this.setup();
|
|
13360
|
+
}
|
|
13361
|
+
}
|
|
13362
|
+
ngOnChanges({ infiniteScrollContainer, infiniteScrollDisabled, infiniteScrollDistance, }) {
|
|
13363
|
+
const containerChanged = inputPropChanged(infiniteScrollContainer);
|
|
13364
|
+
const disabledChanged = inputPropChanged(infiniteScrollDisabled);
|
|
13365
|
+
const distanceChanged = inputPropChanged(infiniteScrollDistance);
|
|
13366
|
+
const shouldSetup = (!disabledChanged && !this.infiniteScrollDisabled) ||
|
|
13367
|
+
(disabledChanged && !infiniteScrollDisabled.currentValue) ||
|
|
13368
|
+
distanceChanged;
|
|
13369
|
+
if (containerChanged || disabledChanged || distanceChanged) {
|
|
13370
|
+
this.destroyScroller();
|
|
13371
|
+
if (shouldSetup) {
|
|
13372
|
+
this.setup();
|
|
13373
|
+
}
|
|
13374
|
+
}
|
|
13375
|
+
}
|
|
13376
|
+
ngOnDestroy() {
|
|
13377
|
+
this.destroyScroller();
|
|
13378
|
+
}
|
|
13379
|
+
setup() {
|
|
13380
|
+
if (!hasWindowDefined()) {
|
|
13381
|
+
return;
|
|
13382
|
+
}
|
|
13383
|
+
this.zone.runOutsideAngular(() => {
|
|
13384
|
+
this.disposeScroller = createScroller({
|
|
13385
|
+
fromRoot: this.fromRoot,
|
|
13386
|
+
alwaysCallback: this.alwaysCallback,
|
|
13387
|
+
disable: this.infiniteScrollDisabled,
|
|
13388
|
+
downDistance: this.infiniteScrollDistance,
|
|
13389
|
+
element: this.element,
|
|
13390
|
+
horizontal: this.horizontal,
|
|
13391
|
+
scrollContainer: this.infiniteScrollContainer,
|
|
13392
|
+
scrollWindow: this.scrollWindow,
|
|
13393
|
+
throttle: this.infiniteScrollThrottle,
|
|
13394
|
+
upDistance: this.infiniteScrollUpDistance,
|
|
13395
|
+
}).subscribe((payload) => this.handleOnScroll(payload));
|
|
13396
|
+
});
|
|
13397
|
+
}
|
|
13398
|
+
handleOnScroll({ type, payload }) {
|
|
13399
|
+
const emitter = type === InfiniteScrollActions.DOWN ? this.scrolled : this.scrolledUp;
|
|
13400
|
+
if (hasObservers(emitter)) {
|
|
13401
|
+
this.zone.run(() => emitter.emit(payload));
|
|
13402
|
+
}
|
|
13403
|
+
}
|
|
13404
|
+
destroyScroller() {
|
|
13405
|
+
if (this.disposeScroller) {
|
|
13406
|
+
this.disposeScroller.unsubscribe();
|
|
13407
|
+
}
|
|
13408
|
+
}
|
|
13409
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: InfiniteScrollDirective, deps: [{ token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Directive });
|
|
13410
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.9", type: InfiniteScrollDirective, isStandalone: true, selector: "[infiniteScroll], [infinite-scroll], [data-infinite-scroll]", inputs: { infiniteScrollDistance: "infiniteScrollDistance", infiniteScrollUpDistance: "infiniteScrollUpDistance", infiniteScrollThrottle: "infiniteScrollThrottle", infiniteScrollDisabled: "infiniteScrollDisabled", infiniteScrollContainer: "infiniteScrollContainer", scrollWindow: "scrollWindow", immediateCheck: "immediateCheck", horizontal: "horizontal", alwaysCallback: "alwaysCallback", fromRoot: "fromRoot" }, outputs: { scrolled: "scrolled", scrolledUp: "scrolledUp" }, usesOnChanges: true, ngImport: i0 });
|
|
13411
|
+
}
|
|
13412
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: InfiniteScrollDirective, decorators: [{
|
|
13413
|
+
type: Directive,
|
|
13414
|
+
args: [{
|
|
13415
|
+
selector: '[infiniteScroll], [infinite-scroll], [data-infinite-scroll]',
|
|
13416
|
+
}]
|
|
13417
|
+
}], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.NgZone }], propDecorators: { scrolled: [{
|
|
13418
|
+
type: Output
|
|
13419
|
+
}], scrolledUp: [{
|
|
13420
|
+
type: Output
|
|
13421
|
+
}], infiniteScrollDistance: [{
|
|
13422
|
+
type: Input
|
|
13423
|
+
}], infiniteScrollUpDistance: [{
|
|
13424
|
+
type: Input
|
|
13425
|
+
}], infiniteScrollThrottle: [{
|
|
13426
|
+
type: Input
|
|
13427
|
+
}], infiniteScrollDisabled: [{
|
|
13428
|
+
type: Input
|
|
13429
|
+
}], infiniteScrollContainer: [{
|
|
13430
|
+
type: Input
|
|
13431
|
+
}], scrollWindow: [{
|
|
13432
|
+
type: Input
|
|
13433
|
+
}], immediateCheck: [{
|
|
13434
|
+
type: Input
|
|
13435
|
+
}], horizontal: [{
|
|
13436
|
+
type: Input
|
|
13437
|
+
}], alwaysCallback: [{
|
|
13438
|
+
type: Input
|
|
13439
|
+
}], fromRoot: [{
|
|
13440
|
+
type: Input
|
|
13441
|
+
}] } });
|
|
13442
|
+
function hasObservers(emitter) {
|
|
13443
|
+
// The `observed` property is available in RxJS@7.2.0+
|
|
13444
|
+
return emitter.observed;
|
|
13445
|
+
}
|
|
13446
|
+
|
|
13447
|
+
/**
|
|
13448
|
+
* @deprecated Import InfiniteScrollDirective instead
|
|
13449
|
+
*/
|
|
13450
|
+
class InfiniteScrollModule {
|
|
13451
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: InfiniteScrollModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
13452
|
+
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.9", ngImport: i0, type: InfiniteScrollModule, imports: [InfiniteScrollDirective], exports: [InfiniteScrollDirective] });
|
|
13453
|
+
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: InfiniteScrollModule });
|
|
13454
|
+
}
|
|
13455
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: InfiniteScrollModule, decorators: [{
|
|
13456
|
+
type: NgModule,
|
|
13457
|
+
args: [{
|
|
13458
|
+
exports: [InfiniteScrollDirective],
|
|
13459
|
+
imports: [InfiniteScrollDirective],
|
|
13460
|
+
}]
|
|
13461
|
+
}] });
|
|
13462
|
+
|
|
13005
13463
|
/**
|
|
13006
13464
|
* Generated bundle index. Do not edit.
|
|
13007
13465
|
*/
|
|
13008
13466
|
|
|
13009
|
-
export { AlertDialogComponent, AppErrorComponent, AppSvgIconComponent, BaseApiService, BaseControlValueAccessor, BaseControlValueAccessorV2, BaseControlValueAccessorV3, BaseInputComponent, BaseOverlayComponent, BaseTableComponent, BreadcrumbComponent, ButtonComponent, CheckboxComponent, ClickOutsideDirective, CloseButtonComponent, ColorConverterService, ColorFormats, ColorPickerComponent, ColorPickerDirective, ContextMenuButtonComponent, ContextMenuIconComponent, DEFAULT_PHONE_COUNTRIES, DataTableComponent, DateInputComponent, DatePickerComponent, DatePickerOverlayComponent, DateRangePickerComponent, DateUtils, DropdownComponent, DynamicRendererComponent, EnvBannerComponent, FORM_ERRORS, FileUploaderComponent, FormValidationUtils, HumanizeFormMessagesPipe, InputDateFormat, InvalidControlScrollContainerDirective, InvalidControlScrollDirective, InvalidTokenError, ListviewComponent, LoaderComponent, LoaderService, MultiSelectDropdownAppearance, MultiSelectDropdownComponent, MultiSelectionFieldComponent, NGL_CONFIG, NetworkImageComponent, NglService, NoDataComponent, NoDataTableComponent, NumberInputComponent, OpenFloatingMenuDirective, OverlayContextMenuComponent, OverlayService, OverlayWizardUtils, PaginationComponent, PaginationState, PhoneNumberInputComponent, RadioButtonComponent, RequestState, ResizableColumnDirective, ResponsiveHelperComponent, SharedConstants, ShimmerComponent, SignalCheckbox, SignalDateField, SignalDatePicker, SignalDateRangeField, SignalDateRangePicker, SignalDropdown, SignalMultiSelectDropdown, SignalNumberField, SignalOtpField, SignalPhoneNumberField, SignalRadio, SignalRadioGroup, SignalRangeSlider, SignalRating, SignalSlider, SignalSwitch, SignalTextField, SignalTextarea, SignalTimeField, SignalTimePicker, SingleItemPickerInputComponent, SingleSelectionFieldComponent, SortableTableDirective, SpinnerComponent, State, StatusBadgeComponent, SvgUrlIconComponent, SwitchComponent, TableCustomComponent, TableResizableColumnsDirective, TemplateResolverArrayUtil, TemplateResolverFormat, TextAreaInputComponent, TextInputComponent, ThemeService, TimePickerComponent, ToastComponent, ToastService, ToasterComponent, TooltipDirective, UnsavedAwareDirective, arrayToCSV, arrayToSeparator, arrayToSpaceSeparator, deepEqual, defaultErrors, getDynamicTypeStructure, isDynamicType, isValid, jsonEqual, jwtDecode, mmddyyyyDateValidatorAsync, onlyFutureDateValidator, onlyPastDateValidator, openLink, phoneNumbers, phoneNumbersAll, printInvalidFields, provideNglConfig, resolveTemplateWithObject, toSentenceCase };
|
|
13467
|
+
export { AlertDialogComponent, AppErrorComponent, AppSvgIconComponent, BaseApiService, BaseControlValueAccessor, BaseControlValueAccessorV2, BaseControlValueAccessorV3, BaseInputComponent, BaseOverlayComponent, BaseTableComponent, BreadcrumbComponent, ButtonComponent, CheckboxComponent, ClickOutsideDirective, CloseButtonComponent, ColorConverterService, ColorFormats, ColorPickerComponent, ColorPickerDirective, ContextMenuButtonComponent, ContextMenuIconComponent, DEFAULT_PHONE_COUNTRIES, DataTableComponent, DateInputComponent, DatePickerComponent, DatePickerOverlayComponent, DateRangePickerComponent, DateUtils, DropdownComponent, DynamicRendererComponent, EnvBannerComponent, FORM_ERRORS, FileUploaderComponent, FormValidationUtils, HumanizeFormMessagesPipe, InfiniteScrollDirective, InfiniteScrollModule, InputDateFormat, InvalidControlScrollContainerDirective, InvalidControlScrollDirective, InvalidTokenError, ListviewComponent, LoaderComponent, LoaderService, MultiSelectDropdownAppearance, MultiSelectDropdownComponent, MultiSelectionFieldComponent, NGL_CONFIG, NetworkImageComponent, NglService, NoDataComponent, NoDataTableComponent, NumberInputComponent, OpenFloatingMenuDirective, OverlayContextMenuComponent, OverlayService, OverlayWizardUtils, PaginationComponent, PaginationState, PhoneNumberInputComponent, RadioButtonComponent, RequestState, ResizableColumnDirective, ResponsiveHelperComponent, SharedConstants, ShimmerComponent, SignalCheckbox, SignalDateField, SignalDatePicker, SignalDateRangeField, SignalDateRangePicker, SignalDropdown, SignalMultiSelectDropdown, SignalNumberField, SignalOtpField, SignalPhoneNumberField, SignalRadio, SignalRadioGroup, SignalRangeSlider, SignalRating, SignalSlider, SignalSwitch, SignalTextField, SignalTextarea, SignalTimeField, SignalTimePicker, SingleItemPickerInputComponent, SingleSelectionFieldComponent, SortableTableDirective, SpinnerComponent, State, StatusBadgeComponent, SvgUrlIconComponent, SwitchComponent, TableCustomComponent, TableResizableColumnsDirective, TemplateResolverArrayUtil, TemplateResolverFormat, TextAreaInputComponent, TextInputComponent, ThemeService, TimePickerComponent, ToastComponent, ToastService, ToasterComponent, TooltipDirective, UnsavedAwareDirective, arrayToCSV, arrayToSeparator, arrayToSpaceSeparator, deepEqual, defaultErrors, getDynamicTypeStructure, isDynamicType, isValid, jsonEqual, jwtDecode, mmddyyyyDateValidatorAsync, onlyFutureDateValidator, onlyPastDateValidator, openLink, phoneNumbers, phoneNumbersAll, printInvalidFields, provideNglConfig, resolveTemplateWithObject, toSentenceCase };
|
|
13010
13468
|
//# sourceMappingURL=vallift-ngl.mjs.map
|