UNPKG

primeng

Version:

[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT) [![npm version](https://badge.fury.io/js/primeng.svg)](https://badge.fury.io/js/primeng) [![npm downloads](https://img.shields.io/npm/dm/primeng.sv

896 lines 140 kB
import { CommonModule } from '@angular/common'; import { ChangeDetectionStrategy, Component, ContentChildren, EventEmitter, Input, NgModule, Output, ViewChild, ViewEncapsulation } from '@angular/core'; import { PrimeTemplate } from 'primeng/api'; import { DomHandler } from 'primeng/dom'; import * as i0 from "@angular/core"; import * as i1 from "@angular/common"; export class Scroller { constructor(cd, zone) { this.cd = cd; this.zone = zone; this.onLazyLoad = new EventEmitter(); this.onScroll = new EventEmitter(); this.onScrollIndexChange = new EventEmitter(); this._tabindex = 0; this._itemSize = 0; this._orientation = 'vertical'; this._step = 0; this._delay = 0; this._resizeDelay = 10; this._appendOnly = false; this._inline = false; this._lazy = false; this._disabled = false; this._loaderDisabled = false; this._showSpacer = true; this._showLoader = false; this._autoSize = false; this.d_loading = false; this.first = 0; this.last = 0; this.page = 0; this.numItemsInViewport = 0; this.lastScrollPos = 0; this.lazyLoadState = {}; this.loaderArr = []; this.spacerStyle = {}; this.contentStyle = {}; this.initialized = false; } get id() { return this._id; } set id(val) { this._id = val; } get style() { return this._style; } set style(val) { this._style = val; } get styleClass() { return this._styleClass; } set styleClass(val) { this._styleClass = val; } get tabindex() { return this._tabindex; } set tabindex(val) { this._tabindex = val; } get items() { return this._items; } set items(val) { this._items = val; } get itemSize() { return this._itemSize; } set itemSize(val) { this._itemSize = val; } get scrollHeight() { return this._scrollHeight; } set scrollHeight(val) { this._scrollHeight = val; } get scrollWidth() { return this._scrollWidth; } set scrollWidth(val) { this._scrollWidth = val; } get orientation() { return this._orientation; } set orientation(val) { this._orientation = val; } get step() { return this._step; } set step(val) { this._step = val; } get delay() { return this._delay; } set delay(val) { this._delay = val; } get resizeDelay() { return this._resizeDelay; } set resizeDelay(val) { this._resizeDelay = val; } get appendOnly() { return this._appendOnly; } set appendOnly(val) { this._appendOnly = val; } get inline() { return this._inline; } set inline(val) { this._inline = val; } get lazy() { return this._lazy; } set lazy(val) { this._lazy = val; } get disabled() { return this._disabled; } set disabled(val) { this._disabled = val; } get loaderDisabled() { return this._loaderDisabled; } set loaderDisabled(val) { this._loaderDisabled = val; } get columns() { return this._columns; } set columns(val) { this._columns = val; } get showSpacer() { return this._showSpacer; } set showSpacer(val) { this._showSpacer = val; } get showLoader() { return this._showLoader; } set showLoader(val) { this._showLoader = val; } get numToleratedItems() { return this._numToleratedItems; } set numToleratedItems(val) { this._numToleratedItems = val; } get loading() { return this._loading; } set loading(val) { this._loading = val; } get autoSize() { return this._autoSize; } set autoSize(val) { this._autoSize = val; } get trackBy() { return this._trackBy; } set trackBy(val) { this._trackBy = val; } get options() { return this._options; } set options(val) { this._options = val; if (val && typeof val === 'object') { Object.entries(val).forEach(([k, v]) => this[`_${k}`] !== v && (this[`_${k}`] = v)); } } get vertical() { return this._orientation === 'vertical'; } get horizontal() { return this._orientation === 'horizontal'; } get both() { return this._orientation === 'both'; } get loadedItems() { if (this._items && !this.d_loading) { if (this.both) return this._items.slice(this._appendOnly ? 0 : this.first.rows, this.last.rows).map((item) => (this._columns ? item : item.slice(this._appendOnly ? 0 : this.first.cols, this.last.cols))); else if (this.horizontal && this._columns) return this._items; else return this._items.slice(this._appendOnly ? 0 : this.first, this.last); } return []; } get loadedRows() { return this.d_loading ? (this._loaderDisabled ? this.loaderArr : []) : this.loadedItems; } get loadedColumns() { if (this._columns && (this.both || this.horizontal)) { return this.d_loading && this._loaderDisabled ? (this.both ? this.loaderArr[0] : this.loaderArr) : this._columns.slice(this.both ? this.first.cols : this.first, this.both ? this.last.cols : this.last); } return this._columns; } get isPageChanged() { return this._step ? this.page !== this.getPageByFirst() : true; } ngOnInit() { this.setInitialState(); } ngOnChanges(simpleChanges) { let isLoadingChanged = false; if (simpleChanges.loading) { const { previousValue, currentValue } = simpleChanges.loading; if (this.lazy && previousValue !== currentValue && currentValue !== this.d_loading) { this.d_loading = currentValue; isLoadingChanged = true; } } if (simpleChanges.orientation) { this.lastScrollPos = this.both ? { top: 0, left: 0 } : 0; } if (simpleChanges.numToleratedItems) { const { previousValue, currentValue } = simpleChanges.numToleratedItems; if (previousValue !== currentValue && currentValue !== this.d_numToleratedItems) { this.d_numToleratedItems = currentValue; } } if (simpleChanges.options) { const { previousValue, currentValue } = simpleChanges.options; if (this.lazy && previousValue?.loading !== currentValue?.loading && currentValue?.loading !== this.d_loading) { this.d_loading = currentValue.loading; isLoadingChanged = true; } if (previousValue?.numToleratedItems !== currentValue?.numToleratedItems && currentValue?.numToleratedItems !== this.d_numToleratedItems) { this.d_numToleratedItems = currentValue.numToleratedItems; } } if (this.initialized) { const isChanged = !isLoadingChanged && (simpleChanges.items?.previousValue?.length !== simpleChanges.items?.currentValue?.length || simpleChanges.itemSize || simpleChanges.scrollHeight || simpleChanges.scrollWidth); isChanged && this.init(); } } ngAfterContentInit() { this.templates.forEach((item) => { switch (item.getType()) { case 'content': this.contentTemplate = item.template; break; case 'item': this.itemTemplate = item.template; break; case 'loader': this.loaderTemplate = item.template; break; case 'loadericon': this.loaderIconTemplate = item.template; break; default: this.itemTemplate = item.template; break; } }); } ngAfterViewInit() { this.viewInit(); } ngAfterViewChecked() { if (!this.initialized) { this.viewInit(); } this.calculateAutoSize(); } ngOnDestroy() { this.unbindResizeListener(); this.contentEl = null; this.initialized = false; } viewInit() { if (DomHandler.isVisible(this.elementViewChild?.nativeElement)) { this.setInitialState(); this.setContentEl(this.contentEl); this.init(); this.defaultWidth = DomHandler.getWidth(this.elementViewChild.nativeElement); this.defaultHeight = DomHandler.getHeight(this.elementViewChild.nativeElement); this.initialized = true; } } init() { if (!this._disabled) { this.setSize(); this.calculateOptions(); this.setSpacerSize(); this.bindResizeListener(); this.cd.detectChanges(); } } setContentEl(el) { this.contentEl = el || this.contentViewChild?.nativeElement || DomHandler.findSingle(this.elementViewChild?.nativeElement, '.p-scroller-content'); } setInitialState() { this.first = this.both ? { rows: 0, cols: 0 } : 0; this.last = this.both ? { rows: 0, cols: 0 } : 0; this.numItemsInViewport = this.both ? { rows: 0, cols: 0 } : 0; this.lastScrollPos = this.both ? { top: 0, left: 0 } : 0; this.d_loading = this._loading || false; this.d_numToleratedItems = this._numToleratedItems; this.loaderArr = []; this.spacerStyle = {}; this.contentStyle = {}; } getElementRef() { return this.elementViewChild; } getPageByFirst() { return Math.floor((this.first + this.d_numToleratedItems * 4) / (this._step || 1)); } scrollTo(options) { this.lastScrollPos = this.both ? { top: 0, left: 0 } : 0; this.elementViewChild?.nativeElement?.scrollTo(options); } scrollToIndex(index, behavior = 'auto') { const { numToleratedItems } = this.calculateNumItems(); const contentPos = this.getContentPosition(); const calculateFirst = (_index = 0, _numT) => (_index <= _numT ? 0 : _index); const calculateCoord = (_first, _size, _cpos) => _first * _size + _cpos; const scrollTo = (left = 0, top = 0) => this.scrollTo({ left, top, behavior }); if (this.both) { this.first = { rows: calculateFirst(index[0], numToleratedItems[0]), cols: calculateFirst(index[1], numToleratedItems[1]) }; scrollTo(calculateCoord(this.first.cols, this._itemSize[1], contentPos.left), calculateCoord(this.first.rows, this._itemSize[0], contentPos.top)); } else { this.first = calculateFirst(index, numToleratedItems); this.horizontal ? scrollTo(calculateCoord(this.first, this._itemSize, contentPos.left), 0) : scrollTo(0, calculateCoord(this.first, this._itemSize, contentPos.top)); } } scrollInView(index, to, behavior = 'auto') { if (to) { const { first, viewport } = this.getRenderedRange(); const scrollTo = (left = 0, top = 0) => this.scrollTo({ left, top, behavior }); const isToStart = to === 'to-start'; const isToEnd = to === 'to-end'; if (isToStart) { if (this.both) { if (viewport.first.rows - first.rows > index[0]) { scrollTo(viewport.first.cols * this._itemSize[1], (viewport.first.rows - 1) * this._itemSize[0]); } else if (viewport.first.cols - first.cols > index[1]) { scrollTo((viewport.first.cols - 1) * this._itemSize[1], viewport.first.rows * this._itemSize[0]); } } else { if (viewport.first - first > index) { const pos = (viewport.first - 1) * this._itemSize; this.horizontal ? scrollTo(pos, 0) : scrollTo(0, pos); } } } else if (isToEnd) { if (this.both) { if (viewport.last.rows - first.rows <= index[0] + 1) { scrollTo(viewport.first.cols * this._itemSize[1], (viewport.first.rows + 1) * this._itemSize[0]); } else if (viewport.last.cols - first.cols <= index[1] + 1) { scrollTo((viewport.first.cols + 1) * this._itemSize[1], viewport.first.rows * this._itemSize[0]); } } else { if (viewport.last - first <= index + 1) { const pos = (viewport.first + 1) * this._itemSize; this.horizontal ? scrollTo(pos, 0) : scrollTo(0, pos); } } } } else { this.scrollToIndex(index, behavior); } } getRenderedRange() { const calculateFirstInViewport = (_pos, _size) => Math.floor(_pos / (_size || _pos)); let firstInViewport = this.first; let lastInViewport = 0; if (this.elementViewChild?.nativeElement) { const { scrollTop, scrollLeft } = this.elementViewChild.nativeElement; if (this.both) { firstInViewport = { rows: calculateFirstInViewport(scrollTop, this._itemSize[0]), cols: calculateFirstInViewport(scrollLeft, this._itemSize[1]) }; lastInViewport = { rows: firstInViewport.rows + this.numItemsInViewport.rows, cols: firstInViewport.cols + this.numItemsInViewport.cols }; } else { const scrollPos = this.horizontal ? scrollLeft : scrollTop; firstInViewport = calculateFirstInViewport(scrollPos, this._itemSize); lastInViewport = firstInViewport + this.numItemsInViewport; } } return { first: this.first, last: this.last, viewport: { first: firstInViewport, last: lastInViewport } }; } calculateNumItems() { const contentPos = this.getContentPosition(); const contentWidth = this.elementViewChild?.nativeElement ? this.elementViewChild.nativeElement.offsetWidth - contentPos.left : 0; const contentHeight = this.elementViewChild?.nativeElement ? this.elementViewChild.nativeElement.offsetHeight - contentPos.top : 0; const calculateNumItemsInViewport = (_contentSize, _itemSize) => Math.ceil(_contentSize / (_itemSize || _contentSize)); const calculateNumToleratedItems = (_numItems) => Math.ceil(_numItems / 2); const numItemsInViewport = this.both ? { rows: calculateNumItemsInViewport(contentHeight, this._itemSize[0]), cols: calculateNumItemsInViewport(contentWidth, this._itemSize[1]) } : calculateNumItemsInViewport(this.horizontal ? contentWidth : contentHeight, this._itemSize); const numToleratedItems = this.d_numToleratedItems || (this.both ? [calculateNumToleratedItems(numItemsInViewport.rows), calculateNumToleratedItems(numItemsInViewport.cols)] : calculateNumToleratedItems(numItemsInViewport)); return { numItemsInViewport, numToleratedItems }; } calculateOptions() { const { numItemsInViewport, numToleratedItems } = this.calculateNumItems(); const calculateLast = (_first, _num, _numT, _isCols = false) => this.getLast(_first + _num + (_first < _numT ? 2 : 3) * _numT, _isCols); const first = this.first; const last = this.both ? { rows: calculateLast(this.first.rows, numItemsInViewport.rows, numToleratedItems[0]), cols: calculateLast(this.first.cols, numItemsInViewport.cols, numToleratedItems[1], true) } : calculateLast(this.first, numItemsInViewport, numToleratedItems); this.last = last; this.numItemsInViewport = numItemsInViewport; this.d_numToleratedItems = numToleratedItems; if (this.showLoader) { this.loaderArr = this.both ? Array.from({ length: numItemsInViewport.rows }).map(() => Array.from({ length: numItemsInViewport.cols })) : Array.from({ length: numItemsInViewport }); } if (this._lazy) { Promise.resolve().then(() => { this.lazyLoadState = { first: this._step ? (this.both ? { rows: 0, cols: first.cols } : 0) : first, last: Math.min(this._step ? this._step : this.last, this.items.length) }; this.handleEvents('onLazyLoad', this.lazyLoadState); }); } } calculateAutoSize() { if (this._autoSize && !this.d_loading) { Promise.resolve().then(() => { if (this.contentEl) { this.contentEl.style.minHeight = this.contentEl.style.minWidth = 'auto'; const { offsetWidth, offsetHeight } = this.contentEl; (this.both || this.horizontal) && (this.elementViewChild.nativeElement.style.width = (offsetWidth < this.defaultWidth ? offsetWidth : this.defaultWidth) + 'px'); (this.both || this.vertical) && (this.elementViewChild.nativeElement.style.height = (offsetHeight < this.defaultHeight ? offsetHeight : this.defaultHeight) + 'px'); this.contentEl.style.minHeight = this.contentEl.style.minWidth = ''; } }); } } getLast(last = 0, isCols = false) { return this._items ? Math.min(isCols ? (this._columns || this._items[0]).length : this._items.length, last) : 0; } getContentPosition() { if (this.contentEl) { const style = getComputedStyle(this.contentEl); const left = parseFloat(style.paddingLeft) + Math.max(parseFloat(style.left) || 0, 0); const right = parseFloat(style.paddingRight) + Math.max(parseFloat(style.right) || 0, 0); const top = parseFloat(style.paddingTop) + Math.max(parseFloat(style.top) || 0, 0); const bottom = parseFloat(style.paddingBottom) + Math.max(parseFloat(style.bottom) || 0, 0); return { left, right, top, bottom, x: left + right, y: top + bottom }; } return { left: 0, right: 0, top: 0, bottom: 0, x: 0, y: 0 }; } setSize() { if (this.elementViewChild?.nativeElement) { const parentElement = this.elementViewChild.nativeElement.parentElement.parentElement; const width = this._scrollWidth || `${this.elementViewChild.nativeElement.offsetWidth || parentElement.offsetWidth}px`; const height = this._scrollHeight || `${this.elementViewChild.nativeElement.offsetHeight || parentElement.offsetHeight}px`; const setProp = (_name, _value) => (this.elementViewChild.nativeElement.style[_name] = _value); if (this.both || this.horizontal) { setProp('height', height); setProp('width', width); } else { setProp('height', height); } } } setSpacerSize() { if (this._items) { const contentPos = this.getContentPosition(); const setProp = (_name, _value, _size, _cpos = 0) => (this.spacerStyle = { ...this.spacerStyle, ...{ [`${_name}`]: (_value || []).length * _size + _cpos + 'px' } }); if (this.both) { setProp('height', this._items, this._itemSize[0], contentPos.y); setProp('width', this._columns || this._items[1], this._itemSize[1], contentPos.x); } else { this.horizontal ? setProp('width', this._columns || this._items, this._itemSize, contentPos.x) : setProp('height', this._items, this._itemSize, contentPos.y); } } } setContentPosition(pos) { if (this.contentEl && !this._appendOnly) { const first = pos ? pos.first : this.first; const calculateTranslateVal = (_first, _size) => _first * _size; const setTransform = (_x = 0, _y = 0) => (this.contentStyle = { ...this.contentStyle, ...{ transform: `translate3d(${_x}px, ${_y}px, 0)` } }); if (this.both) { setTransform(calculateTranslateVal(first.cols, this._itemSize[1]), calculateTranslateVal(first.rows, this._itemSize[0])); } else { const translateVal = calculateTranslateVal(first, this._itemSize); this.horizontal ? setTransform(translateVal, 0) : setTransform(0, translateVal); } } } onScrollPositionChange(event) { const target = event.target; const contentPos = this.getContentPosition(); const calculateScrollPos = (_pos, _cpos) => (_pos ? (_pos > _cpos ? _pos - _cpos : _pos) : 0); const calculateCurrentIndex = (_pos, _size) => Math.floor(_pos / (_size || _pos)); const calculateTriggerIndex = (_currentIndex, _first, _last, _num, _numT, _isScrollDownOrRight) => { return _currentIndex <= _numT ? _numT : _isScrollDownOrRight ? _last - _num - _numT : _first + _numT - 1; }; const calculateFirst = (_currentIndex, _triggerIndex, _first, _last, _num, _numT, _isScrollDownOrRight) => { if (_currentIndex <= _numT) return 0; else return Math.max(0, _isScrollDownOrRight ? (_currentIndex < _triggerIndex ? _first : _currentIndex - _numT) : _currentIndex > _triggerIndex ? _first : _currentIndex - 2 * _numT); }; const calculateLast = (_currentIndex, _first, _last, _num, _numT, _isCols = false) => { let lastValue = _first + _num + 2 * _numT; if (_currentIndex >= _numT) { lastValue += _numT + 1; } return this.getLast(lastValue, _isCols); }; const scrollTop = calculateScrollPos(target.scrollTop, contentPos.top); const scrollLeft = calculateScrollPos(target.scrollLeft, contentPos.left); let newFirst = this.both ? { rows: 0, cols: 0 } : 0; let newLast = this.last; let isRangeChanged = false; let newScrollPos = this.lastScrollPos; if (this.both) { const isScrollDown = this.lastScrollPos.top <= scrollTop; const isScrollRight = this.lastScrollPos.left <= scrollLeft; if (!this._appendOnly || (this._appendOnly && (isScrollDown || isScrollRight))) { const currentIndex = { rows: calculateCurrentIndex(scrollTop, this._itemSize[0]), cols: calculateCurrentIndex(scrollLeft, this._itemSize[1]) }; const triggerIndex = { rows: calculateTriggerIndex(currentIndex.rows, this.first.rows, this.last.rows, this.numItemsInViewport.rows, this.d_numToleratedItems[0], isScrollDown), cols: calculateTriggerIndex(currentIndex.cols, this.first.cols, this.last.cols, this.numItemsInViewport.cols, this.d_numToleratedItems[1], isScrollRight) }; newFirst = { rows: calculateFirst(currentIndex.rows, triggerIndex.rows, this.first.rows, this.last.rows, this.numItemsInViewport.rows, this.d_numToleratedItems[0], isScrollDown), cols: calculateFirst(currentIndex.cols, triggerIndex.cols, this.first.cols, this.last.cols, this.numItemsInViewport.cols, this.d_numToleratedItems[1], isScrollRight) }; newLast = { rows: calculateLast(currentIndex.rows, newFirst.rows, this.last.rows, this.numItemsInViewport.rows, this.d_numToleratedItems[0]), cols: calculateLast(currentIndex.cols, newFirst.cols, this.last.cols, this.numItemsInViewport.cols, this.d_numToleratedItems[1], true) }; isRangeChanged = newFirst.rows !== this.first.rows || newLast.rows !== this.last.rows || newFirst.cols !== this.first.cols || newLast.cols !== this.last.cols; newScrollPos = { top: scrollTop, left: scrollLeft }; } } else { const scrollPos = this.horizontal ? scrollLeft : scrollTop; const isScrollDownOrRight = this.lastScrollPos <= scrollPos; if (!this._appendOnly || (this._appendOnly && isScrollDownOrRight)) { const currentIndex = calculateCurrentIndex(scrollPos, this._itemSize); const triggerIndex = calculateTriggerIndex(currentIndex, this.first, this.last, this.numItemsInViewport, this.d_numToleratedItems, isScrollDownOrRight); newFirst = calculateFirst(currentIndex, triggerIndex, this.first, this.last, this.numItemsInViewport, this.d_numToleratedItems, isScrollDownOrRight); newLast = calculateLast(currentIndex, newFirst, this.last, this.numItemsInViewport, this.d_numToleratedItems); isRangeChanged = newFirst !== this.first || newLast !== this.last; newScrollPos = scrollPos; } } return { first: newFirst, last: newLast, isRangeChanged, scrollPos: newScrollPos }; } onScrollChange(event) { const { first, last, isRangeChanged, scrollPos } = this.onScrollPositionChange(event); if (isRangeChanged) { const newState = { first, last }; this.setContentPosition(newState); this.first = first; this.last = last; this.lastScrollPos = scrollPos; this.handleEvents('onScrollIndexChange', newState); if (this._lazy && this.isPageChanged) { const lazyLoadState = { first: this._step ? Math.min(this.getPageByFirst() * this._step, this.items.length - this._step) : first, last: Math.min(this._step ? (this.getPageByFirst() + 1) * this._step : last, this.items.length) }; const isLazyStateChanged = this.lazyLoadState.first !== lazyLoadState.first || this.lazyLoadState.last !== lazyLoadState.last; isLazyStateChanged && this.handleEvents('onLazyLoad', lazyLoadState); this.lazyLoadState = lazyLoadState; } } } onContainerScroll(event) { this.handleEvents('onScroll', { originalEvent: event }); if (this._delay && this.isPageChanged) { if (this.scrollTimeout) { clearTimeout(this.scrollTimeout); } if (!this.d_loading && this.showLoader) { const { isRangeChanged } = this.onScrollPositionChange(event); const changed = isRangeChanged || (this._step ? this.isPageChanged : false); if (changed) { this.d_loading = true; this.cd.detectChanges(); } } this.scrollTimeout = setTimeout(() => { this.onScrollChange(event); if (this.d_loading && this.showLoader && (!this._lazy || this._loading === undefined)) { this.d_loading = false; this.page = this.getPageByFirst(); this.cd.detectChanges(); } }, this._delay); } else { !this.d_loading && this.onScrollChange(event); } } bindResizeListener() { if (!this.windowResizeListener) { this.zone.runOutsideAngular(() => { this.windowResizeListener = this.onWindowResize.bind(this); window.addEventListener('resize', this.windowResizeListener); window.addEventListener('orientationchange', this.windowResizeListener); }); } } unbindResizeListener() { if (this.windowResizeListener) { window.removeEventListener('resize', this.windowResizeListener); window.removeEventListener('orientationchange', this.windowResizeListener); this.windowResizeListener = null; } } onWindowResize() { if (this.resizeTimeout) { clearTimeout(this.resizeTimeout); } this.resizeTimeout = setTimeout(() => { if (DomHandler.isVisible(this.elementViewChild?.nativeElement)) { const [width, height] = [DomHandler.getWidth(this.elementViewChild.nativeElement), DomHandler.getHeight(this.elementViewChild.nativeElement)]; const [isDiffWidth, isDiffHeight] = [width !== this.defaultWidth, height !== this.defaultHeight]; const reinit = this.both ? isDiffWidth || isDiffHeight : this.horizontal ? isDiffWidth : this.vertical ? isDiffHeight : false; reinit && this.zone.run(() => { this.d_numToleratedItems = this._numToleratedItems; this.defaultWidth = width; this.defaultHeight = height; this.init(); }); } }, this._resizeDelay); } handleEvents(name, params) { return this.options && this.options[name] ? this.options[name](params) : this[name].emit(params); } getContentOptions() { return { contentStyleClass: `p-scroller-content ${this.d_loading ? 'p-scroller-loading' : ''}`, items: this.loadedItems, getItemOptions: (index) => this.getOptions(index), loading: this.d_loading, getLoaderOptions: (index, options) => this.getLoaderOptions(index, options), itemSize: this._itemSize, rows: this.loadedRows, columns: this.loadedColumns, spacerStyle: this.spacerStyle, contentStyle: this.contentStyle, vertical: this.vertical, horizontal: this.horizontal, both: this.both }; } getOptions(renderedIndex) { const count = (this._items || []).length; const index = this.both ? this.first.rows + renderedIndex : this.first + renderedIndex; return { index, count, first: index === 0, last: index === count - 1, even: index % 2 === 0, odd: index % 2 !== 0 }; } getLoaderOptions(index, extOptions) { const count = this.loaderArr.length; return { index, count, first: index === 0, last: index === count - 1, even: index % 2 === 0, odd: index % 2 !== 0, ...extOptions }; } } Scroller.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: Scroller, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); Scroller.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.7", type: Scroller, selector: "p-scroller", inputs: { id: "id", style: "style", styleClass: "styleClass", tabindex: "tabindex", items: "items", itemSize: "itemSize", scrollHeight: "scrollHeight", scrollWidth: "scrollWidth", orientation: "orientation", step: "step", delay: "delay", resizeDelay: "resizeDelay", appendOnly: "appendOnly", inline: "inline", lazy: "lazy", disabled: "disabled", loaderDisabled: "loaderDisabled", columns: "columns", showSpacer: "showSpacer", showLoader: "showLoader", numToleratedItems: "numToleratedItems", loading: "loading", autoSize: "autoSize", trackBy: "trackBy", options: "options" }, outputs: { onLazyLoad: "onLazyLoad", onScroll: "onScroll", onScrollIndexChange: "onScrollIndexChange" }, host: { classAttribute: "p-scroller-viewport p-element" }, queries: [{ propertyName: "templates", predicate: PrimeTemplate }], viewQueries: [{ propertyName: "elementViewChild", first: true, predicate: ["element"], descendants: true }, { propertyName: "contentViewChild", first: true, predicate: ["content"], descendants: true }], usesOnChanges: true, ngImport: i0, template: ` <ng-container *ngIf="!_disabled; else disabledContainer"> <div #element [attr.id]="_id" [attr.tabindex]="tabindex" [ngStyle]="_style" [class]="_styleClass" [ngClass]="{ 'p-scroller': true, 'p-scroller-inline': inline, 'p-both-scroll': both, 'p-horizontal-scroll': horizontal }" (scroll)="onContainerScroll($event)" > <ng-container *ngIf="contentTemplate; else buildInContent"> <ng-container *ngTemplateOutlet="contentTemplate; context: { $implicit: loadedItems, options: getContentOptions() }"></ng-container> </ng-container> <ng-template #buildInContent> <div #content class="p-scroller-content" [ngClass]="{ 'p-scroller-loading': d_loading }" [ngStyle]="contentStyle"> <ng-container *ngFor="let item of loadedItems; let index = index; trackBy: _trackBy || index"> <ng-container *ngTemplateOutlet="itemTemplate; context: { $implicit: item, options: getOptions(index) }"></ng-container> </ng-container> </div> </ng-template> <div *ngIf="_showSpacer" class="p-scroller-spacer" [ngStyle]="spacerStyle"></div> <div *ngIf="!loaderDisabled && _showLoader && d_loading" class="p-scroller-loader" [ngClass]="{ 'p-component-overlay': !loaderTemplate }"> <ng-container *ngIf="loaderTemplate; else buildInLoader"> <ng-container *ngFor="let item of loaderArr; let index = index"> <ng-container *ngTemplateOutlet="loaderTemplate; context: { options: getLoaderOptions(index, both && { numCols: _numItemsInViewport.cols }) }"></ng-container> </ng-container> </ng-container> <ng-template #buildInLoader> <ng-container *ngIf="loaderIconTemplate; else buildInLoaderIcon"> <ng-container *ngTemplateOutlet="loaderIconTemplate; context: { options: { styleClass: 'p-scroller-loading-icon' } }"></ng-container> </ng-container> <ng-template #buildInLoaderIcon> <i class="p-scroller-loading-icon pi pi-spinner pi-spin"></i> </ng-template> </ng-template> </div> </div> </ng-container> <ng-template #disabledContainer> <ng-content></ng-content> <ng-container *ngIf="contentTemplate"> <ng-container *ngTemplateOutlet="contentTemplate; context: { $implicit: items, options: { rows: _items, columns: loadedColumns } }"></ng-container> </ng-container> </ng-template> `, isInline: true, styles: ["p-scroller{flex:1;outline:0 none}.p-scroller{position:relative;overflow:auto;contain:strict;transform:translateZ(0);will-change:scroll-position;outline:0 none}.p-scroller-content{position:absolute;top:0;left:0;min-height:100%;min-width:100%;will-change:transform}.p-scroller-spacer{position:absolute;top:0;left:0;height:1px;width:1px;transform-origin:0 0;pointer-events:none}.p-scroller-loader{position:sticky;top:0;left:0;width:100%;height:100%}.p-scroller-loader.p-component-overlay{display:flex;align-items:center;justify-content:center}.p-scroller-loading-icon{font-size:2rem}.p-scroller-inline .p-scroller-content{position:static}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None }); i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: Scroller, decorators: [{ type: Component, args: [{ selector: 'p-scroller', template: ` <ng-container *ngIf="!_disabled; else disabledContainer"> <div #element [attr.id]="_id" [attr.tabindex]="tabindex" [ngStyle]="_style" [class]="_styleClass" [ngClass]="{ 'p-scroller': true, 'p-scroller-inline': inline, 'p-both-scroll': both, 'p-horizontal-scroll': horizontal }" (scroll)="onContainerScroll($event)" > <ng-container *ngIf="contentTemplate; else buildInContent"> <ng-container *ngTemplateOutlet="contentTemplate; context: { $implicit: loadedItems, options: getContentOptions() }"></ng-container> </ng-container> <ng-template #buildInContent> <div #content class="p-scroller-content" [ngClass]="{ 'p-scroller-loading': d_loading }" [ngStyle]="contentStyle"> <ng-container *ngFor="let item of loadedItems; let index = index; trackBy: _trackBy || index"> <ng-container *ngTemplateOutlet="itemTemplate; context: { $implicit: item, options: getOptions(index) }"></ng-container> </ng-container> </div> </ng-template> <div *ngIf="_showSpacer" class="p-scroller-spacer" [ngStyle]="spacerStyle"></div> <div *ngIf="!loaderDisabled && _showLoader && d_loading" class="p-scroller-loader" [ngClass]="{ 'p-component-overlay': !loaderTemplate }"> <ng-container *ngIf="loaderTemplate; else buildInLoader"> <ng-container *ngFor="let item of loaderArr; let index = index"> <ng-container *ngTemplateOutlet="loaderTemplate; context: { options: getLoaderOptions(index, both && { numCols: _numItemsInViewport.cols }) }"></ng-container> </ng-container> </ng-container> <ng-template #buildInLoader> <ng-container *ngIf="loaderIconTemplate; else buildInLoaderIcon"> <ng-container *ngTemplateOutlet="loaderIconTemplate; context: { options: { styleClass: 'p-scroller-loading-icon' } }"></ng-container> </ng-container> <ng-template #buildInLoaderIcon> <i class="p-scroller-loading-icon pi pi-spinner pi-spin"></i> </ng-template> </ng-template> </div> </div> </ng-container> <ng-template #disabledContainer> <ng-content></ng-content> <ng-container *ngIf="contentTemplate"> <ng-container *ngTemplateOutlet="contentTemplate; context: { $implicit: items, options: { rows: _items, columns: loadedColumns } }"></ng-container> </ng-container> </ng-template> `, changeDetection: ChangeDetectionStrategy.Default, encapsulation: ViewEncapsulation.None, host: { class: 'p-scroller-viewport p-element' }, styles: ["p-scroller{flex:1;outline:0 none}.p-scroller{position:relative;overflow:auto;contain:strict;transform:translateZ(0);will-change:scroll-position;outline:0 none}.p-scroller-content{position:absolute;top:0;left:0;min-height:100%;min-width:100%;will-change:transform}.p-scroller-spacer{position:absolute;top:0;left:0;height:1px;width:1px;transform-origin:0 0;pointer-events:none}.p-scroller-loader{position:sticky;top:0;left:0;width:100%;height:100%}.p-scroller-loader.p-component-overlay{display:flex;align-items:center;justify-content:center}.p-scroller-loading-icon{font-size:2rem}.p-scroller-inline .p-scroller-content{position:static}\n"] }] }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.NgZone }]; }, propDecorators: { id: [{ type: Input }], style: [{ type: Input }], styleClass: [{ type: Input }], tabindex: [{ type: Input }], items: [{ type: Input }], itemSize: [{ type: Input }], scrollHeight: [{ type: Input }], scrollWidth: [{ type: Input }], orientation: [{ type: Input }], step: [{ type: Input }], delay: [{ type: Input }], resizeDelay: [{ type: Input }], appendOnly: [{ type: Input }], inline: [{ type: Input }], lazy: [{ type: Input }], disabled: [{ type: Input }], loaderDisabled: [{ type: Input }], columns: [{ type: Input }], showSpacer: [{ type: Input }], showLoader: [{ type: Input }], numToleratedItems: [{ type: Input }], loading: [{ type: Input }], autoSize: [{ type: Input }], trackBy: [{ type: Input }], options: [{ type: Input }], elementViewChild: [{ type: ViewChild, args: ['element'] }], contentViewChild: [{ type: ViewChild, args: ['content'] }], templates: [{ type: ContentChildren, args: [PrimeTemplate] }], onLazyLoad: [{ type: Output }], onScroll: [{ type: Output }], onScrollIndexChange: [{ type: Output }] } }); export class ScrollerModule { } ScrollerModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: ScrollerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); ScrollerModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.0.7", ngImport: i0, type: ScrollerModule, declarations: [Scroller], imports: [CommonModule], exports: [Scroller] }); ScrollerModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: ScrollerModule, imports: [CommonModule] }); i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: ScrollerModule, decorators: [{ type: NgModule, args: [{ imports: [CommonModule], exports: [Scroller], declarations: [Scroller] }] }] }); //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2Nyb2xsZXIuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9zcmMvYXBwL2NvbXBvbmVudHMvc2Nyb2xsZXIvc2Nyb2xsZXIudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLGlCQUFpQixDQUFDO0FBQy9DLE9BQU8sRUFHSCx1QkFBdUIsRUFFdkIsU0FBUyxFQUNULGVBQWUsRUFFZixZQUFZLEVBQ1osS0FBSyxFQUNMLFFBQVEsRUFJUixNQUFNLEVBSU4sU0FBUyxFQUNULGlCQUFpQixFQUNwQixNQUFNLGVBQWUsQ0FBQztBQUN2QixPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sYUFBYSxDQUFDO0FBQzVDLE9BQU8sRUFBRSxVQUFVLEVBQUUsTUFBTSxhQUFhLENBQUM7OztBQTJGekMsTUFBTSxPQUFPLFFBQVE7SUFvVWpCLFlBQW9CLEVBQXFCLEVBQVUsSUFBWTtRQUEzQyxPQUFFLEdBQUYsRUFBRSxDQUFtQjtRQUFVLFNBQUksR0FBSixJQUFJLENBQVE7UUExSXJELGVBQVUsR0FBc0IsSUFBSSxZQUFZLEVBQUUsQ0FBQztRQUVuRCxhQUFRLEdBQXNCLElBQUksWUFBWSxFQUFFLENBQUM7UUFFakQsd0JBQW1CLEdBQXNCLElBQUksWUFBWSxFQUFFLENBQUM7UUFRdEUsY0FBUyxHQUFXLENBQUMsQ0FBQztRQUl0QixjQUFTLEdBQVEsQ0FBQyxDQUFDO1FBTW5CLGlCQUFZLEdBQVcsVUFBVSxDQUFDO1FBRWxDLFVBQUssR0FBVyxDQUFDLENBQUM7UUFFbEIsV0FBTSxHQUFXLENBQUMsQ0FBQztRQUVuQixpQkFBWSxHQUFXLEVBQUUsQ0FBQztRQUUxQixnQkFBVyxHQUFZLEtBQUssQ0FBQztRQUU3QixZQUFPLEdBQVksS0FBSyxDQUFDO1FBRXpCLFVBQUssR0FBWSxLQUFLLENBQUM7UUFFdkIsY0FBUyxHQUFZLEtBQUssQ0FBQztRQUUzQixvQkFBZSxHQUFZLEtBQUssQ0FBQztRQUlq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