| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887 |
- import { fromEvent, Subject, merge } from 'rxjs';
- import { auditTime, takeUntil, distinctUntilChanged, mapTo } from 'rxjs/operators';
- import { InjectionToken, Directive, NgZone, KeyValueDiffers, ElementRef, Inject, PLATFORM_ID, Optional, Input, Output, EventEmitter, Component, ViewEncapsulation, ChangeDetectorRef, HostBinding, ViewChild, NgModule } from '@angular/core';
- import { isPlatformBrowser, CommonModule } from '@angular/common';
- import PerfectScrollbar from 'perfect-scrollbar';
- import ResizeObserver from 'resize-observer-polyfill';
- /**
- * @fileoverview added by tsickle
- * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
- */
- /** @type {?} */
- var PERFECT_SCROLLBAR_CONFIG = new InjectionToken('PERFECT_SCROLLBAR_CONFIG');
- var Geometry = /** @class */ (function () {
- function Geometry(x, y, w, h) {
- this.x = x;
- this.y = y;
- this.w = w;
- this.h = h;
- }
- return Geometry;
- }());
- var Position = /** @class */ (function () {
- function Position(x, y) {
- this.x = x;
- this.y = y;
- }
- return Position;
- }());
- /** @type {?} */
- var PerfectScrollbarEvents = [
- 'psScrollY',
- 'psScrollX',
- 'psScrollUp',
- 'psScrollDown',
- 'psScrollLeft',
- 'psScrollRight',
- 'psYReachEnd',
- 'psYReachStart',
- 'psXReachEnd',
- 'psXReachStart'
- ];
- var PerfectScrollbarConfig = /** @class */ (function () {
- function PerfectScrollbarConfig(config) {
- if (config === void 0) { config = {}; }
- this.assign(config);
- }
- /**
- * @param {?=} config
- * @return {?}
- */
- PerfectScrollbarConfig.prototype.assign = /**
- * @param {?=} config
- * @return {?}
- */
- function (config) {
- if (config === void 0) { config = {}; }
- for (var key in config) {
- this[(/** @type {?} */ (key))] = config[(/** @type {?} */ (key))];
- }
- };
- return PerfectScrollbarConfig;
- }());
- /**
- * @fileoverview added by tsickle
- * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
- */
- var PerfectScrollbarDirective = /** @class */ (function () {
- function PerfectScrollbarDirective(zone, differs, elementRef, platformId, defaults) {
- this.zone = zone;
- this.differs = differs;
- this.elementRef = elementRef;
- this.platformId = platformId;
- this.defaults = defaults;
- this.instance = null;
- this.ro = null;
- this.timeout = null;
- this.animation = null;
- this.configDiff = null;
- this.ngDestroy = new Subject();
- this.disabled = false;
- this.psScrollY = new EventEmitter();
- this.psScrollX = new EventEmitter();
- this.psScrollUp = new EventEmitter();
- this.psScrollDown = new EventEmitter();
- this.psScrollLeft = new EventEmitter();
- this.psScrollRight = new EventEmitter();
- this.psYReachEnd = new EventEmitter();
- this.psYReachStart = new EventEmitter();
- this.psXReachEnd = new EventEmitter();
- this.psXReachStart = new EventEmitter();
- }
- /**
- * @return {?}
- */
- PerfectScrollbarDirective.prototype.ngOnInit = /**
- * @return {?}
- */
- function () {
- var _this = this;
- if (!this.disabled && isPlatformBrowser(this.platformId)) {
- /** @type {?} */
- var config_1 = new PerfectScrollbarConfig(this.defaults);
- config_1.assign(this.config); // Custom configuration
- this.zone.runOutsideAngular((/**
- * @return {?}
- */
- function () {
- _this.instance = new PerfectScrollbar(_this.elementRef.nativeElement, config_1);
- }));
- if (!this.configDiff) {
- this.configDiff = this.differs.find(this.config || {}).create();
- this.configDiff.diff(this.config || {});
- }
- this.zone.runOutsideAngular((/**
- * @return {?}
- */
- function () {
- _this.ro = new ResizeObserver((/**
- * @return {?}
- */
- function () {
- _this.update();
- }));
- if (_this.elementRef.nativeElement.children[0]) {
- _this.ro.observe(_this.elementRef.nativeElement.children[0]);
- }
- _this.ro.observe(_this.elementRef.nativeElement);
- }));
- this.zone.runOutsideAngular((/**
- * @return {?}
- */
- function () {
- PerfectScrollbarEvents.forEach((/**
- * @param {?} eventName
- * @return {?}
- */
- function (eventName) {
- /** @type {?} */
- var eventType = eventName.replace(/([A-Z])/g, (/**
- * @param {?} c
- * @return {?}
- */
- function (c) { return "-" + c.toLowerCase(); }));
- fromEvent(_this.elementRef.nativeElement, eventType)
- .pipe(auditTime(20), takeUntil(_this.ngDestroy))
- .subscribe((/**
- * @param {?} event
- * @return {?}
- */
- function (event) {
- _this[eventName].emit(event);
- }));
- }));
- }));
- }
- };
- /**
- * @return {?}
- */
- PerfectScrollbarDirective.prototype.ngOnDestroy = /**
- * @return {?}
- */
- function () {
- var _this = this;
- if (isPlatformBrowser(this.platformId)) {
- this.ngDestroy.next();
- this.ngDestroy.complete();
- if (this.ro) {
- this.ro.disconnect();
- }
- if (this.timeout && typeof window !== 'undefined') {
- window.clearTimeout(this.timeout);
- }
- this.zone.runOutsideAngular((/**
- * @return {?}
- */
- function () {
- if (_this.instance) {
- _this.instance.destroy();
- }
- }));
- this.instance = null;
- }
- };
- /**
- * @return {?}
- */
- PerfectScrollbarDirective.prototype.ngDoCheck = /**
- * @return {?}
- */
- function () {
- if (!this.disabled && this.configDiff && isPlatformBrowser(this.platformId)) {
- /** @type {?} */
- var changes = this.configDiff.diff(this.config || {});
- if (changes) {
- this.ngOnDestroy();
- this.ngOnInit();
- }
- }
- };
- /**
- * @param {?} changes
- * @return {?}
- */
- PerfectScrollbarDirective.prototype.ngOnChanges = /**
- * @param {?} changes
- * @return {?}
- */
- function (changes) {
- if (changes['disabled'] && !changes['disabled'].isFirstChange() && isPlatformBrowser(this.platformId)) {
- if (changes['disabled'].currentValue !== changes['disabled'].previousValue) {
- if (changes['disabled'].currentValue === true) {
- this.ngOnDestroy();
- }
- else if (changes['disabled'].currentValue === false) {
- this.ngOnInit();
- }
- }
- }
- };
- /**
- * @return {?}
- */
- PerfectScrollbarDirective.prototype.ps = /**
- * @return {?}
- */
- function () {
- return this.instance;
- };
- /**
- * @return {?}
- */
- PerfectScrollbarDirective.prototype.update = /**
- * @return {?}
- */
- function () {
- var _this = this;
- if (typeof window !== 'undefined') {
- if (this.timeout) {
- window.clearTimeout(this.timeout);
- }
- this.timeout = window.setTimeout((/**
- * @return {?}
- */
- function () {
- if (!_this.disabled && _this.configDiff) {
- try {
- _this.zone.runOutsideAngular((/**
- * @return {?}
- */
- function () {
- if (_this.instance) {
- _this.instance.update();
- }
- }));
- }
- catch (error) {
- // Update can be finished after destroy so catch errors
- }
- }
- }), 0);
- }
- };
- /**
- * @param {?=} prefix
- * @return {?}
- */
- PerfectScrollbarDirective.prototype.geometry = /**
- * @param {?=} prefix
- * @return {?}
- */
- function (prefix) {
- if (prefix === void 0) { prefix = 'scroll'; }
- return new Geometry(this.elementRef.nativeElement[prefix + 'Left'], this.elementRef.nativeElement[prefix + 'Top'], this.elementRef.nativeElement[prefix + 'Width'], this.elementRef.nativeElement[prefix + 'Height']);
- };
- /**
- * @param {?=} absolute
- * @return {?}
- */
- PerfectScrollbarDirective.prototype.position = /**
- * @param {?=} absolute
- * @return {?}
- */
- function (absolute) {
- if (absolute === void 0) { absolute = false; }
- if (!absolute && this.instance) {
- return new Position(this.instance.reach.x || 0, this.instance.reach.y || 0);
- }
- else {
- return new Position(this.elementRef.nativeElement.scrollLeft, this.elementRef.nativeElement.scrollTop);
- }
- };
- /**
- * @param {?=} direction
- * @return {?}
- */
- PerfectScrollbarDirective.prototype.scrollable = /**
- * @param {?=} direction
- * @return {?}
- */
- function (direction) {
- if (direction === void 0) { direction = 'any'; }
- /** @type {?} */
- var element = this.elementRef.nativeElement;
- if (direction === 'any') {
- return element.classList.contains('ps--active-x') ||
- element.classList.contains('ps--active-y');
- }
- else if (direction === 'both') {
- return element.classList.contains('ps--active-x') &&
- element.classList.contains('ps--active-y');
- }
- else {
- return element.classList.contains('ps--active-' + direction);
- }
- };
- /**
- * @param {?} x
- * @param {?=} y
- * @param {?=} speed
- * @return {?}
- */
- PerfectScrollbarDirective.prototype.scrollTo = /**
- * @param {?} x
- * @param {?=} y
- * @param {?=} speed
- * @return {?}
- */
- function (x, y, speed) {
- if (!this.disabled) {
- if (y == null && speed == null) {
- this.animateScrolling('scrollTop', x, speed);
- }
- else {
- if (x != null) {
- this.animateScrolling('scrollLeft', x, speed);
- }
- if (y != null) {
- this.animateScrolling('scrollTop', y, speed);
- }
- }
- }
- };
- /**
- * @param {?} x
- * @param {?=} speed
- * @return {?}
- */
- PerfectScrollbarDirective.prototype.scrollToX = /**
- * @param {?} x
- * @param {?=} speed
- * @return {?}
- */
- function (x, speed) {
- this.animateScrolling('scrollLeft', x, speed);
- };
- /**
- * @param {?} y
- * @param {?=} speed
- * @return {?}
- */
- PerfectScrollbarDirective.prototype.scrollToY = /**
- * @param {?} y
- * @param {?=} speed
- * @return {?}
- */
- function (y, speed) {
- this.animateScrolling('scrollTop', y, speed);
- };
- /**
- * @param {?=} offset
- * @param {?=} speed
- * @return {?}
- */
- PerfectScrollbarDirective.prototype.scrollToTop = /**
- * @param {?=} offset
- * @param {?=} speed
- * @return {?}
- */
- function (offset, speed) {
- this.animateScrolling('scrollTop', (offset || 0), speed);
- };
- /**
- * @param {?=} offset
- * @param {?=} speed
- * @return {?}
- */
- PerfectScrollbarDirective.prototype.scrollToLeft = /**
- * @param {?=} offset
- * @param {?=} speed
- * @return {?}
- */
- function (offset, speed) {
- this.animateScrolling('scrollLeft', (offset || 0), speed);
- };
- /**
- * @param {?=} offset
- * @param {?=} speed
- * @return {?}
- */
- PerfectScrollbarDirective.prototype.scrollToRight = /**
- * @param {?=} offset
- * @param {?=} speed
- * @return {?}
- */
- function (offset, speed) {
- /** @type {?} */
- var left = this.elementRef.nativeElement.scrollWidth -
- this.elementRef.nativeElement.clientWidth;
- this.animateScrolling('scrollLeft', left - (offset || 0), speed);
- };
- /**
- * @param {?=} offset
- * @param {?=} speed
- * @return {?}
- */
- PerfectScrollbarDirective.prototype.scrollToBottom = /**
- * @param {?=} offset
- * @param {?=} speed
- * @return {?}
- */
- function (offset, speed) {
- /** @type {?} */
- var top = this.elementRef.nativeElement.scrollHeight -
- this.elementRef.nativeElement.clientHeight;
- this.animateScrolling('scrollTop', top - (offset || 0), speed);
- };
- /**
- * @param {?} qs
- * @param {?=} offset
- * @param {?=} speed
- * @return {?}
- */
- PerfectScrollbarDirective.prototype.scrollToElement = /**
- * @param {?} qs
- * @param {?=} offset
- * @param {?=} speed
- * @return {?}
- */
- function (qs, offset, speed) {
- /** @type {?} */
- var element = this.elementRef.nativeElement.querySelector(qs);
- if (element) {
- /** @type {?} */
- var elementPos = element.getBoundingClientRect();
- /** @type {?} */
- var scrollerPos = this.elementRef.nativeElement.getBoundingClientRect();
- if (this.elementRef.nativeElement.classList.contains('ps--active-x')) {
- /** @type {?} */
- var currentPos = this.elementRef.nativeElement['scrollLeft'];
- /** @type {?} */
- var position = elementPos.left - scrollerPos.left + currentPos;
- this.animateScrolling('scrollLeft', position + (offset || 0), speed);
- }
- if (this.elementRef.nativeElement.classList.contains('ps--active-y')) {
- /** @type {?} */
- var currentPos = this.elementRef.nativeElement['scrollTop'];
- /** @type {?} */
- var position = elementPos.top - scrollerPos.top + currentPos;
- this.animateScrolling('scrollTop', position + (offset || 0), speed);
- }
- }
- };
- /**
- * @private
- * @param {?} target
- * @param {?} value
- * @param {?=} speed
- * @return {?}
- */
- PerfectScrollbarDirective.prototype.animateScrolling = /**
- * @private
- * @param {?} target
- * @param {?} value
- * @param {?=} speed
- * @return {?}
- */
- function (target, value, speed) {
- var _this = this;
- if (this.animation) {
- window.cancelAnimationFrame(this.animation);
- this.animation = null;
- }
- if (!speed || typeof window === 'undefined') {
- this.elementRef.nativeElement[target] = value;
- }
- else if (value !== this.elementRef.nativeElement[target]) {
- /** @type {?} */
- var newValue_1 = 0;
- /** @type {?} */
- var scrollCount_1 = 0;
- /** @type {?} */
- var oldTimestamp_1 = performance.now();
- /** @type {?} */
- var oldValue_1 = this.elementRef.nativeElement[target];
- /** @type {?} */
- var cosParameter_1 = (oldValue_1 - value) / 2;
- /** @type {?} */
- var step_1 = (/**
- * @param {?} newTimestamp
- * @return {?}
- */
- function (newTimestamp) {
- scrollCount_1 += Math.PI / (speed / (newTimestamp - oldTimestamp_1));
- newValue_1 = Math.round(value + cosParameter_1 + cosParameter_1 * Math.cos(scrollCount_1));
- // Only continue animation if scroll position has not changed
- if (_this.elementRef.nativeElement[target] === oldValue_1) {
- if (scrollCount_1 >= Math.PI) {
- _this.animateScrolling(target, value, 0);
- }
- else {
- _this.elementRef.nativeElement[target] = newValue_1;
- // On a zoomed out page the resulting offset may differ
- oldValue_1 = _this.elementRef.nativeElement[target];
- oldTimestamp_1 = newTimestamp;
- _this.animation = window.requestAnimationFrame(step_1);
- }
- }
- });
- window.requestAnimationFrame(step_1);
- }
- };
- PerfectScrollbarDirective.decorators = [
- { type: Directive, args: [{
- selector: '[perfectScrollbar]',
- exportAs: 'ngxPerfectScrollbar'
- },] }
- ];
- /** @nocollapse */
- PerfectScrollbarDirective.ctorParameters = function () { return [
- { type: NgZone },
- { type: KeyValueDiffers },
- { type: ElementRef },
- { type: Object, decorators: [{ type: Inject, args: [PLATFORM_ID,] }] },
- { type: undefined, decorators: [{ type: Optional }, { type: Inject, args: [PERFECT_SCROLLBAR_CONFIG,] }] }
- ]; };
- PerfectScrollbarDirective.propDecorators = {
- disabled: [{ type: Input }],
- config: [{ type: Input, args: ['perfectScrollbar',] }],
- psScrollY: [{ type: Output }],
- psScrollX: [{ type: Output }],
- psScrollUp: [{ type: Output }],
- psScrollDown: [{ type: Output }],
- psScrollLeft: [{ type: Output }],
- psScrollRight: [{ type: Output }],
- psYReachEnd: [{ type: Output }],
- psYReachStart: [{ type: Output }],
- psXReachEnd: [{ type: Output }],
- psXReachStart: [{ type: Output }]
- };
- return PerfectScrollbarDirective;
- }());
- /**
- * @fileoverview added by tsickle
- * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
- */
- var PerfectScrollbarComponent = /** @class */ (function () {
- function PerfectScrollbarComponent(zone, cdRef, platformId) {
- this.zone = zone;
- this.cdRef = cdRef;
- this.platformId = platformId;
- this.states = {};
- this.indicatorX = false;
- this.indicatorY = false;
- this.interaction = false;
- this.scrollPositionX = 0;
- this.scrollPositionY = 0;
- this.scrollDirectionX = 0;
- this.scrollDirectionY = 0;
- this.usePropagationX = false;
- this.usePropagationY = false;
- this.allowPropagationX = false;
- this.allowPropagationY = false;
- this.stateTimeout = null;
- this.ngDestroy = new Subject();
- this.stateUpdate = new Subject();
- this.disabled = false;
- this.usePSClass = true;
- this.autoPropagation = false;
- this.scrollIndicators = false;
- this.psScrollY = new EventEmitter();
- this.psScrollX = new EventEmitter();
- this.psScrollUp = new EventEmitter();
- this.psScrollDown = new EventEmitter();
- this.psScrollLeft = new EventEmitter();
- this.psScrollRight = new EventEmitter();
- this.psYReachEnd = new EventEmitter();
- this.psYReachStart = new EventEmitter();
- this.psXReachEnd = new EventEmitter();
- this.psXReachStart = new EventEmitter();
- }
- /**
- * @return {?}
- */
- PerfectScrollbarComponent.prototype.ngOnInit = /**
- * @return {?}
- */
- function () {
- var _this = this;
- if (isPlatformBrowser(this.platformId)) {
- this.stateUpdate
- .pipe(takeUntil(this.ngDestroy), distinctUntilChanged((/**
- * @param {?} a
- * @param {?} b
- * @return {?}
- */
- function (a, b) { return (a === b && !_this.stateTimeout); })))
- .subscribe((/**
- * @param {?} state
- * @return {?}
- */
- function (state) {
- if (_this.stateTimeout && typeof window !== 'undefined') {
- window.clearTimeout(_this.stateTimeout);
- _this.stateTimeout = null;
- }
- if (state === 'x' || state === 'y') {
- _this.interaction = false;
- if (state === 'x') {
- _this.indicatorX = false;
- _this.states.left = false;
- _this.states.right = false;
- if (_this.autoPropagation && _this.usePropagationX) {
- _this.allowPropagationX = false;
- }
- }
- else if (state === 'y') {
- _this.indicatorY = false;
- _this.states.top = false;
- _this.states.bottom = false;
- if (_this.autoPropagation && _this.usePropagationY) {
- _this.allowPropagationY = false;
- }
- }
- }
- else {
- if (state === 'left' || state === 'right') {
- _this.states.left = false;
- _this.states.right = false;
- _this.states[state] = true;
- if (_this.autoPropagation && _this.usePropagationX) {
- _this.indicatorX = true;
- }
- }
- else if (state === 'top' || state === 'bottom') {
- _this.states.top = false;
- _this.states.bottom = false;
- _this.states[state] = true;
- if (_this.autoPropagation && _this.usePropagationY) {
- _this.indicatorY = true;
- }
- }
- if (_this.autoPropagation && typeof window !== 'undefined') {
- _this.stateTimeout = window.setTimeout((/**
- * @return {?}
- */
- function () {
- _this.indicatorX = false;
- _this.indicatorY = false;
- _this.stateTimeout = null;
- if (_this.interaction && (_this.states.left || _this.states.right)) {
- _this.allowPropagationX = true;
- }
- if (_this.interaction && (_this.states.top || _this.states.bottom)) {
- _this.allowPropagationY = true;
- }
- _this.cdRef.markForCheck();
- }), 500);
- }
- }
- _this.cdRef.markForCheck();
- _this.cdRef.detectChanges();
- }));
- this.zone.runOutsideAngular((/**
- * @return {?}
- */
- function () {
- if (_this.directiveRef) {
- /** @type {?} */
- var element = _this.directiveRef.elementRef.nativeElement;
- fromEvent(element, 'wheel')
- .pipe(takeUntil(_this.ngDestroy))
- .subscribe((/**
- * @param {?} event
- * @return {?}
- */
- function (event) {
- if (!_this.disabled && _this.autoPropagation) {
- /** @type {?} */
- var scrollDeltaX = event.deltaX;
- /** @type {?} */
- var scrollDeltaY = event.deltaY;
- _this.checkPropagation(event, scrollDeltaX, scrollDeltaY);
- }
- }));
- fromEvent(element, 'touchmove')
- .pipe(takeUntil(_this.ngDestroy))
- .subscribe((/**
- * @param {?} event
- * @return {?}
- */
- function (event) {
- if (!_this.disabled && _this.autoPropagation) {
- /** @type {?} */
- var scrollPositionX = event.touches[0].clientX;
- /** @type {?} */
- var scrollPositionY = event.touches[0].clientY;
- /** @type {?} */
- var scrollDeltaX = scrollPositionX - _this.scrollPositionX;
- /** @type {?} */
- var scrollDeltaY = scrollPositionY - _this.scrollPositionY;
- _this.checkPropagation(event, scrollDeltaX, scrollDeltaY);
- _this.scrollPositionX = scrollPositionX;
- _this.scrollPositionY = scrollPositionY;
- }
- }));
- merge(fromEvent(element, 'ps-scroll-x')
- .pipe(mapTo('x')), fromEvent(element, 'ps-scroll-y')
- .pipe(mapTo('y')), fromEvent(element, 'ps-x-reach-end')
- .pipe(mapTo('right')), fromEvent(element, 'ps-y-reach-end')
- .pipe(mapTo('bottom')), fromEvent(element, 'ps-x-reach-start')
- .pipe(mapTo('left')), fromEvent(element, 'ps-y-reach-start')
- .pipe(mapTo('top')))
- .pipe(takeUntil(_this.ngDestroy))
- .subscribe((/**
- * @param {?} state
- * @return {?}
- */
- function (state) {
- if (!_this.disabled && (_this.autoPropagation || _this.scrollIndicators)) {
- _this.stateUpdate.next(state);
- }
- }));
- }
- }));
- window.setTimeout((/**
- * @return {?}
- */
- function () {
- PerfectScrollbarEvents.forEach((/**
- * @param {?} eventName
- * @return {?}
- */
- function (eventName) {
- if (_this.directiveRef) {
- _this.directiveRef[eventName] = _this[eventName];
- }
- }));
- }), 0);
- }
- };
- /**
- * @return {?}
- */
- PerfectScrollbarComponent.prototype.ngOnDestroy = /**
- * @return {?}
- */
- function () {
- if (isPlatformBrowser(this.platformId)) {
- this.ngDestroy.next();
- this.ngDestroy.unsubscribe();
- if (this.stateTimeout && typeof window !== 'undefined') {
- window.clearTimeout(this.stateTimeout);
- }
- }
- };
- /**
- * @return {?}
- */
- PerfectScrollbarComponent.prototype.ngDoCheck = /**
- * @return {?}
- */
- function () {
- if (isPlatformBrowser(this.platformId)) {
- if (!this.disabled && this.autoPropagation && this.directiveRef) {
- /** @type {?} */
- var element = this.directiveRef.elementRef.nativeElement;
- this.usePropagationX = element.classList.contains('ps--active-x');
- this.usePropagationY = element.classList.contains('ps--active-y');
- }
- }
- };
- /**
- * @private
- * @param {?} event
- * @param {?} deltaX
- * @param {?} deltaY
- * @return {?}
- */
- PerfectScrollbarComponent.prototype.checkPropagation = /**
- * @private
- * @param {?} event
- * @param {?} deltaX
- * @param {?} deltaY
- * @return {?}
- */
- function (event, deltaX, deltaY) {
- this.interaction = true;
- /** @type {?} */
- var scrollDirectionX = (deltaX < 0) ? -1 : 1;
- /** @type {?} */
- var scrollDirectionY = (deltaY < 0) ? -1 : 1;
- if ((this.usePropagationX && this.usePropagationY) ||
- (this.usePropagationX && (!this.allowPropagationX ||
- (this.scrollDirectionX !== scrollDirectionX))) ||
- (this.usePropagationY && (!this.allowPropagationY ||
- (this.scrollDirectionY !== scrollDirectionY)))) {
- event.preventDefault();
- event.stopPropagation();
- }
- if (!!deltaX) {
- this.scrollDirectionX = scrollDirectionX;
- }
- if (!!deltaY) {
- this.scrollDirectionY = scrollDirectionY;
- }
- this.stateUpdate.next('interaction');
- this.cdRef.detectChanges();
- };
- PerfectScrollbarComponent.decorators = [
- { type: Component, args: [{
- selector: 'perfect-scrollbar',
- exportAs: 'ngxPerfectScrollbar',
- template: "<div style=\"position: static;\" [class.ps]=\"usePSClass\" [perfectScrollbar]=\"config\" [disabled]=\"disabled\">\n <div class=\"ps-content\">\n <ng-content></ng-content>\n </div>\n\n <div *ngIf=\"scrollIndicators\" class=\"ps-overlay\" [class.ps-at-top]=\"states.top\" [class.ps-at-left]=\"states.left\" [class.ps-at-right]=\"states.right\" [class.ps-at-bottom]=\"states.bottom\">\n <div class=\"ps-indicator-top\" [class.ps-indicator-show]=\"indicatorY && interaction\"></div>\n <div class=\"ps-indicator-left\" [class.ps-indicator-show]=\"indicatorX && interaction\"></div>\n <div class=\"ps-indicator-right\" [class.ps-indicator-show]=\"indicatorX && interaction\"></div>\n <div class=\"ps-indicator-bottom\" [class.ps-indicator-show]=\"indicatorY && interaction\"></div>\n </div>\n</div>\n",
- encapsulation: ViewEncapsulation.None,
- styles: ["/*\n TODO: Remove important flags after this bug if fixed:\n https://github.com/angular/flex-layout/issues/381\n*/\n\nperfect-scrollbar {\n position: relative;\n\n display: block;\n overflow: hidden;\n width: 100%;\n height: 100%;\n max-width: 100%;\n max-height: 100%;\n}\n\nperfect-scrollbar[hidden] {\n display: none;\n}\n\nperfect-scrollbar[fxflex] {\n display: flex;\n flex-direction: column;\n height: auto;\n min-width: 0;\n min-height: 0;\n\n -webkit-box-direction: column;\n -webkit-box-orient: column;\n}\n\nperfect-scrollbar[fxflex] > .ps {\n -ms-flex: 1 1 auto;\n\n flex: 1 1 auto;\n width: auto;\n height: auto;\n min-width: 0;\n min-height: 0;\n\n -webkit-box-flex: 1;\n}\n\nperfect-scrollbar[fxlayout] > .ps,\nperfect-scrollbar[fxlayout] > .ps > .ps-content {\n display: flex;\n\n -ms-flex: 1 1 auto;\n\n flex: 1 1 auto;\n flex-direction: inherit;\n align-items: inherit;\n align-content: inherit;\n justify-content: inherit;\n width: 100%;\n height: 100%;\n\n -webkit-box-align: inherit;\n -webkit-box-direction: inherit;\n -webkit-box-flex: 1;\n -webkit-box-orient: inherit;\n -webkit-box-pack: inherit;\n}\n\nperfect-scrollbar[fxlayout='row'] > .ps,\nperfect-scrollbar[fxlayout='row'] > .ps > .ps-content, {\n flex-direction: row !important;\n\n -webkit-box-direction: row !important;\n -webkit-box-orient: row !important;\n}\n\nperfect-scrollbar[fxlayout='column'] > .ps,\nperfect-scrollbar[fxlayout='column'] > .ps > .ps-content {\n flex-direction: column !important;\n\n -webkit-box-direction: column !important;\n -webkit-box-orient: column !important;\n}\n\nperfect-scrollbar > .ps {\n position: static;\n\n display: block;\n width: inherit;\n height: inherit;\n max-width: inherit;\n max-height: inherit;\n}\n\nperfect-scrollbar > .ps textarea {\n -ms-overflow-style: scrollbar;\n}\n\nperfect-scrollbar > .ps > .ps-overlay {\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n\n display: block;\n overflow: hidden;\n\n pointer-events: none;\n}\n\nperfect-scrollbar > .ps > .ps-overlay .ps-indicator-top,\nperfect-scrollbar > .ps > .ps-overlay .ps-indicator-left,\nperfect-scrollbar > .ps > .ps-overlay .ps-indicator-right,\nperfect-scrollbar > .ps > .ps-overlay .ps-indicator-bottom {\n position: absolute;\n\n opacity: 0;\n\n transition: opacity 300ms ease-in-out;\n}\n\nperfect-scrollbar > .ps > .ps-overlay .ps-indicator-top,\nperfect-scrollbar > .ps > .ps-overlay .ps-indicator-bottom {\n left: 0;\n\n min-width: 100%;\n min-height: 24px;\n}\n\nperfect-scrollbar > .ps > .ps-overlay .ps-indicator-left,\nperfect-scrollbar > .ps > .ps-overlay .ps-indicator-right {\n top: 0;\n\n min-width: 24px;\n min-height: 100%;\n}\n\nperfect-scrollbar > .ps > .ps-overlay .ps-indicator-top {\n top: 0;\n}\n\nperfect-scrollbar > .ps > .ps-overlay .ps-indicator-left {\n left: 0;\n}\n\nperfect-scrollbar > .ps > .ps-overlay .ps-indicator-right {\n right: 0;\n}\n\nperfect-scrollbar > .ps > .ps-overlay .ps-indicator-bottom {\n bottom: 0;\n}\n\nperfect-scrollbar > .ps.ps--active-y > .ps__rail-y {\n top: 0 !important;\n right: 0 !important;\n left: auto !important;\n\n width: 10px;\n\n cursor: default;\n\n transition:\n width 200ms linear,\n opacity 200ms linear,\n background-color 200ms linear;\n}\n\nperfect-scrollbar > .ps.ps--active-y > .ps__rail-y:hover,\nperfect-scrollbar > .ps.ps--active-y > .ps__rail-y.ps--clicking {\n width: 15px;\n}\n\nperfect-scrollbar > .ps.ps--active-x > .ps__rail-x {\n top: auto !important;\n bottom: 0 !important;\n left: 0 !important;\n\n height: 10px;\n\n cursor: default;\n\n transition:\n height 200ms linear,\n opacity 200ms linear,\n background-color 200ms linear;\n}\n\nperfect-scrollbar > .ps.ps--active-x > .ps__rail-x:hover,\nperfect-scrollbar > .ps.ps--active-x > .ps__rail-x.ps--clicking {\n height: 15px;\n}\n\nperfect-scrollbar > .ps.ps--active-x.ps--active-y > .ps__rail-y {\n margin: 0 0 10px;\n}\n\nperfect-scrollbar > .ps.ps--active-x.ps--active-y > .ps__rail-x {\n margin: 0 10px 0 0;\n}\n\nperfect-scrollbar > .ps.ps--scrolling-y > .ps__rail-y,\nperfect-scrollbar > .ps.ps--scrolling-x > .ps__rail-x {\n opacity: 0.9;\n\n background-color: #eee;\n}\n\nperfect-scrollbar.ps-show-always > .ps.ps--active-y > .ps__rail-y,\nperfect-scrollbar.ps-show-always > .ps.ps--active-x > .ps__rail-x {\n opacity: 0.6;\n}\n\nperfect-scrollbar.ps-show-active > .ps.ps--active-y > .ps-overlay:not(.ps-at-top) .ps-indicator-top {\n opacity: 1;\n\n background: linear-gradient(to bottom, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%);\n}\n\nperfect-scrollbar.ps-show-active > .ps.ps--active-y > .ps-overlay:not(.ps-at-bottom) .ps-indicator-bottom {\n opacity: 1;\n\n background: linear-gradient(to top, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%);\n}\n\nperfect-scrollbar.ps-show-active > .ps.ps--active-x > .ps-overlay:not(.ps-at-left) .ps-indicator-left {\n opacity: 1;\n\n background: linear-gradient(to right, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%);\n}\n\nperfect-scrollbar.ps-show-active > .ps.ps--active-x > .ps-overlay:not(.ps-at-right) .ps-indicator-right {\n opacity: 1;\n\n background: linear-gradient(to left, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%);\n}\n\nperfect-scrollbar.ps-show-active.ps-show-limits > .ps.ps--active-y > .ps-overlay.ps-at-top .ps-indicator-top {\n background: linear-gradient(to bottom, rgba(170, 170, 170, 0.5) 0%, rgba(170, 170, 170, 0) 100%);\n}\n\nperfect-scrollbar.ps-show-active.ps-show-limits > .ps.ps--active-y > .ps-overlay.ps-at-bottom .ps-indicator-bottom {\n background: linear-gradient(to top, rgba(170, 170, 170, 0.5) 0%, rgba(170, 170, 170, 0) 100%);\n}\n\nperfect-scrollbar.ps-show-active.ps-show-limits > .ps.ps--active-x > .ps-overlay.ps-at-left .ps-indicator-left {\n background: linear-gradient(to right, rgba(170, 170, 170, 0.5) 0%, rgba(170, 170, 170, 0) 100%);\n}\n\nperfect-scrollbar.ps-show-active.ps-show-limits > .ps.ps--active-x > .ps-overlay.ps-at-right .ps-indicator-right {\n background: linear-gradient(to left, rgba(170, 170, 170, 0.5) 0%, rgba(170, 170, 170, 0) 100%);\n}\n\nperfect-scrollbar.ps-show-active.ps-show-limits > .ps.ps--active-y > .ps-overlay.ps-at-top .ps-indicator-top.ps-indicator-show,\nperfect-scrollbar.ps-show-active.ps-show-limits > .ps.ps--active-y > .ps-overlay.ps-at-bottom .ps-indicator-bottom.ps-indicator-show,\nperfect-scrollbar.ps-show-active.ps-show-limits > .ps.ps--active-x > .ps-overlay.ps-at-left .ps-indicator-left.ps-indicator-show,\nperfect-scrollbar.ps-show-active.ps-show-limits > .ps.ps--active-x > .ps-overlay.ps-at-right .ps-indicator-right.ps-indicator-show {\n opacity: 1;\n}\n", "/*\n * Container style\n */\n.ps {\n overflow: hidden !important;\n overflow-anchor: none;\n -ms-overflow-style: none;\n touch-action: auto;\n -ms-touch-action: auto;\n}\n\n/*\n * Scrollbar rail styles\n */\n.ps__rail-x {\n display: none;\n opacity: 0;\n transition: background-color .2s linear, opacity .2s linear;\n -webkit-transition: background-color .2s linear, opacity .2s linear;\n height: 15px;\n /* there must be 'bottom' or 'top' for ps__rail-x */\n bottom: 0px;\n /* please don't change 'position' */\n position: absolute;\n}\n\n.ps__rail-y {\n display: none;\n opacity: 0;\n transition: background-color .2s linear, opacity .2s linear;\n -webkit-transition: background-color .2s linear, opacity .2s linear;\n width: 15px;\n /* there must be 'right' or 'left' for ps__rail-y */\n right: 0;\n /* please don't change 'position' */\n position: absolute;\n}\n\n.ps--active-x > .ps__rail-x,\n.ps--active-y > .ps__rail-y {\n display: block;\n background-color: transparent;\n}\n\n.ps:hover > .ps__rail-x,\n.ps:hover > .ps__rail-y,\n.ps--focus > .ps__rail-x,\n.ps--focus > .ps__rail-y,\n.ps--scrolling-x > .ps__rail-x,\n.ps--scrolling-y > .ps__rail-y {\n opacity: 0.6;\n}\n\n.ps .ps__rail-x:hover,\n.ps .ps__rail-y:hover,\n.ps .ps__rail-x:focus,\n.ps .ps__rail-y:focus,\n.ps .ps__rail-x.ps--clicking,\n.ps .ps__rail-y.ps--clicking {\n background-color: #eee;\n opacity: 0.9;\n}\n\n/*\n * Scrollbar thumb styles\n */\n.ps__thumb-x {\n background-color: #aaa;\n border-radius: 6px;\n transition: background-color .2s linear, height .2s ease-in-out;\n -webkit-transition: background-color .2s linear, height .2s ease-in-out;\n height: 6px;\n /* there must be 'bottom' for ps__thumb-x */\n bottom: 2px;\n /* please don't change 'position' */\n position: absolute;\n}\n\n.ps__thumb-y {\n background-color: #aaa;\n border-radius: 6px;\n transition: background-color .2s linear, width .2s ease-in-out;\n -webkit-transition: background-color .2s linear, width .2s ease-in-out;\n width: 6px;\n /* there must be 'right' for ps__thumb-y */\n right: 2px;\n /* please don't change 'position' */\n position: absolute;\n}\n\n.ps__rail-x:hover > .ps__thumb-x,\n.ps__rail-x:focus > .ps__thumb-x,\n.ps__rail-x.ps--clicking .ps__thumb-x {\n background-color: #999;\n height: 11px;\n}\n\n.ps__rail-y:hover > .ps__thumb-y,\n.ps__rail-y:focus > .ps__thumb-y,\n.ps__rail-y.ps--clicking .ps__thumb-y {\n background-color: #999;\n width: 11px;\n}\n\n/* MS supports */\n@supports (-ms-overflow-style: none) {\n .ps {\n overflow: auto !important;\n }\n}\n\n@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {\n .ps {\n overflow: auto !important;\n }\n}\n"]
- }] }
- ];
- /** @nocollapse */
- PerfectScrollbarComponent.ctorParameters = function () { return [
- { type: NgZone },
- { type: ChangeDetectorRef },
- { type: Object, decorators: [{ type: Inject, args: [PLATFORM_ID,] }] }
- ]; };
- PerfectScrollbarComponent.propDecorators = {
- disabled: [{ type: Input }],
- usePSClass: [{ type: Input }],
- autoPropagation: [{ type: HostBinding, args: ['class.ps-show-limits',] }, { type: Input }],
- scrollIndicators: [{ type: HostBinding, args: ['class.ps-show-active',] }, { type: Input }],
- config: [{ type: Input }],
- psScrollY: [{ type: Output }],
- psScrollX: [{ type: Output }],
- psScrollUp: [{ type: Output }],
- psScrollDown: [{ type: Output }],
- psScrollLeft: [{ type: Output }],
- psScrollRight: [{ type: Output }],
- psYReachEnd: [{ type: Output }],
- psYReachStart: [{ type: Output }],
- psXReachEnd: [{ type: Output }],
- psXReachStart: [{ type: Output }],
- directiveRef: [{ type: ViewChild, args: [PerfectScrollbarDirective, { static: true },] }]
- };
- return PerfectScrollbarComponent;
- }());
- /**
- * @fileoverview added by tsickle
- * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
- */
- var PerfectScrollbarModule = /** @class */ (function () {
- function PerfectScrollbarModule() {
- }
- PerfectScrollbarModule.decorators = [
- { type: NgModule, args: [{
- imports: [CommonModule],
- declarations: [PerfectScrollbarComponent, PerfectScrollbarDirective],
- exports: [CommonModule, PerfectScrollbarComponent, PerfectScrollbarDirective]
- },] }
- ];
- return PerfectScrollbarModule;
- }());
- /**
- * @fileoverview added by tsickle
- * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
- */
- /**
- * @fileoverview added by tsickle
- * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
- */
- export { Geometry, PERFECT_SCROLLBAR_CONFIG, PerfectScrollbarComponent, PerfectScrollbarConfig, PerfectScrollbarDirective, PerfectScrollbarModule, Position };
- //# sourceMappingURL=ngx-perfect-scrollbar.es5.js.map
|