@ng-web-apis/intersection-observer
Version:
A library for declarative use of Intersection Observer API with Angular
56 lines • 7.86 kB
JavaScript
import { Directive, inject } from '@angular/core';
import { SafeObserver } from '../classes/safe-observer';
import { INTERSECTION_ROOT } from '../tokens/intersection-root';
import { rootMarginFactory } from '../utils/root-margin-factory';
import { thresholdFactory } from '../utils/threshold-factory';
import * as i0 from "@angular/core";
class WaIntersectionObserverDirective extends SafeObserver {
callbacks = new Map();
margin = '';
threshold = '';
constructor() {
const root = inject(INTERSECTION_ROOT, { optional: true });
super((entries) => {
this.callbacks.forEach((callback, element) => {
const filtered = entries.filter(({ target }) => target === element);
return filtered.length && callback(filtered, this);
});
}, {
root: root?.nativeElement,
rootMargin: rootMarginFactory(),
threshold: thresholdFactory(),
});
}
observe(target, callback = () => { }) {
super.observe(target);
this.callbacks.set(target, callback);
}
unobserve(target) {
super.unobserve(target);
this.callbacks.delete(target);
}
ngOnDestroy() {
this.disconnect();
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: WaIntersectionObserverDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: WaIntersectionObserverDirective, isStandalone: true, selector: "[waIntersectionObserver]", inputs: { margin: ["waIntersectionRootMargin", "margin"], threshold: ["waIntersectionThreshold", "threshold"] }, exportAs: ["IntersectionObserver"], usesInheritance: true, ngImport: i0 });
}
export { WaIntersectionObserverDirective };
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: WaIntersectionObserverDirective, decorators: [{
type: Directive,
args: [{
standalone: true,
selector: '[waIntersectionObserver]',
inputs: ['margin: waIntersectionRootMargin', 'threshold: waIntersectionThreshold'],
exportAs: 'IntersectionObserver',
}]
}], ctorParameters: function () { return []; } });
/**
* @deprecated: use {@link WaIntersectionObserverDirective}
*/
export const IntersectionObserverDirective = WaIntersectionObserverDirective;
/**
* @deprecated: use {@link WaIntersectionObserver}
*/
export const WaObserver = WaIntersectionObserverDirective;
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW50ZXJzZWN0aW9uLW9ic2VydmVyLmRpcmVjdGl2ZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL2xpYnMvaW50ZXJzZWN0aW9uLW9ic2VydmVyL3NyYy9kaXJlY3RpdmVzL2ludGVyc2VjdGlvbi1vYnNlcnZlci5kaXJlY3RpdmUudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBRUEsT0FBTyxFQUFDLFNBQVMsRUFBRSxNQUFNLEVBQUMsTUFBTSxlQUFlLENBQUM7QUFFaEQsT0FBTyxFQUFDLFlBQVksRUFBQyxNQUFNLDBCQUEwQixDQUFDO0FBQ3RELE9BQU8sRUFBQyxpQkFBaUIsRUFBQyxNQUFNLDZCQUE2QixDQUFDO0FBQzlELE9BQU8sRUFBQyxpQkFBaUIsRUFBQyxNQUFNLDhCQUE4QixDQUFDO0FBQy9ELE9BQU8sRUFBQyxnQkFBZ0IsRUFBQyxNQUFNLDRCQUE0QixDQUFDOztBQUU1RCxNQU1hLCtCQUFnQyxTQUFRLFlBQVk7SUFDNUMsU0FBUyxHQUFHLElBQUksR0FBRyxFQUF5QyxDQUFDO0lBRXZFLE1BQU0sR0FBRyxFQUFFLENBQUM7SUFDWixTQUFTLEdBQUcsRUFBRSxDQUFDO0lBRXRCO1FBQ0ksTUFBTSxJQUFJLEdBQUcsTUFBTSxDQUFDLGlCQUFpQixFQUFFLEVBQUMsUUFBUSxFQUFFLElBQUksRUFBQyxDQUFDLENBQUM7UUFFekQsS0FBSyxDQUNELENBQUMsT0FBTyxFQUFFLEVBQUU7WUFDUixJQUFJLENBQUMsU0FBUyxDQUFDLE9BQU8sQ0FBQyxDQUFDLFFBQVEsRUFBRSxPQUFPLEVBQUUsRUFBRTtnQkFDekMsTUFBTSxRQUFRLEdBQUcsT0FBTyxDQUFDLE1BQU0sQ0FBQyxDQUFDLEVBQUMsTUFBTSxFQUFDLEVBQUUsRUFBRSxDQUFDLE1BQU0sS0FBSyxPQUFPLENBQUMsQ0FBQztnQkFFbEUsT0FBTyxRQUFRLENBQUMsTUFBTSxJQUFJLFFBQVEsQ0FBQyxRQUFRLEVBQUUsSUFBSSxDQUFDLENBQUM7WUFDdkQsQ0FBQyxDQUFDLENBQUM7UUFDUCxDQUFDLEVBQ0Q7WUFDSSxJQUFJLEVBQUUsSUFBSSxFQUFFLGFBQWE7WUFDekIsVUFBVSxFQUFFLGlCQUFpQixFQUFFO1lBQy9CLFNBQVMsRUFBRSxnQkFBZ0IsRUFBRTtTQUNoQyxDQUNKLENBQUM7SUFDTixDQUFDO0lBRWUsT0FBTyxDQUNuQixNQUFlLEVBQ2YsV0FBeUMsR0FBRyxFQUFFLEdBQUUsQ0FBQztRQUVqRCxLQUFLLENBQUMsT0FBTyxDQUFDLE1BQU0sQ0FBQyxDQUFDO1FBQ3RCLElBQUksQ0FBQyxTQUFTLENBQUMsR0FBRyxDQUFDLE1BQU0sRUFBRSxRQUFRLENBQUMsQ0FBQztJQUN6QyxDQUFDO0lBRWUsU0FBUyxDQUFDLE1BQWU7UUFDckMsS0FBSyxDQUFDLFNBQVMsQ0FBQyxNQUFNLENBQUMsQ0FBQztRQUN4QixJQUFJLENBQUMsU0FBUyxDQUFDLE1BQU0sQ0FBQyxNQUFNLENBQUMsQ0FBQztJQUNsQyxDQUFDO0lBRU0sV0FBVztRQUNkLElBQUksQ0FBQyxVQUFVLEVBQUUsQ0FBQztJQUN0QixDQUFDO3dHQXhDUSwrQkFBK0I7NEZBQS9CLCtCQUErQjs7U0FBL0IsK0JBQStCOzRGQUEvQiwrQkFBK0I7a0JBTjNDLFNBQVM7bUJBQUM7b0JBQ1AsVUFBVSxFQUFFLElBQUk7b0JBQ2hCLFFBQVEsRUFBRSwwQkFBMEI7b0JBQ3BDLE1BQU0sRUFBRSxDQUFDLGtDQUFrQyxFQUFFLG9DQUFvQyxDQUFDO29CQUNsRixRQUFRLEVBQUUsc0JBQXNCO2lCQUNuQzs7QUE0Q0Q7O0dBRUc7QUFDSCxNQUFNLENBQUMsTUFBTSw2QkFBNkIsR0FBRywrQkFBK0IsQ0FBQztBQUU3RTs7R0FFRztBQUNILE1BQU0sQ0FBQyxNQUFNLFVBQVUsR0FBRywrQkFBK0IsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbIi8qIGVzbGludC1kaXNhYmxlIEBhbmd1bGFyLWVzbGludC9uby1hdHRyaWJ1dGUtZGVjb3JhdG9yICovXG5pbXBvcnQgdHlwZSB7T25EZXN0cm95fSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7RGlyZWN0aXZlLCBpbmplY3R9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuXG5pbXBvcnQge1NhZmVPYnNlcnZlcn0gZnJvbSAnLi4vY2xhc3Nlcy9zYWZlLW9ic2VydmVyJztcbmltcG9ydCB7SU5URVJTRUNUSU9OX1JPT1R9IGZyb20gJy4uL3Rva2Vucy9pbnRlcnNlY3Rpb24tcm9vdCc7XG5pbXBvcnQge3Jvb3RNYXJnaW5GYWN0b3J5fSBmcm9tICcuLi91dGlscy9yb290LW1hcmdpbi1mYWN0b3J5JztcbmltcG9ydCB7dGhyZXNob2xkRmFjdG9yeX0gZnJvbSAnLi4vdXRpbHMvdGhyZXNob2xkLWZhY3RvcnknO1xuXG5ARGlyZWN0aXZlKHtcbiAgICBzdGFuZGFsb25lOiB0cnVlLFxuICAgIHNlbGVjdG9yOiAnW3dhSW50ZXJzZWN0aW9uT2JzZXJ2ZXJdJyxcbiAgICBpbnB1dHM6IFsnbWFyZ2luOiB3YUludGVyc2VjdGlvblJvb3RNYXJnaW4nLCAndGhyZXNob2xkOiB3YUludGVyc2VjdGlvblRocmVzaG9sZCddLFxuICAgIGV4cG9ydEFzOiAnSW50ZXJzZWN0aW9uT2JzZXJ2ZXInLFxufSlcbmV4cG9ydCBjbGFzcyBXYUludGVyc2VjdGlvbk9ic2VydmVyRGlyZWN0aXZlIGV4dGVuZHMgU2FmZU9ic2VydmVyIGltcGxlbWVudHMgT25EZXN0cm95IHtcbiAgICBwcml2YXRlIHJlYWRvbmx5IGNhbGxiYWNrcyA9IG5ldyBNYXA8RWxlbWVudCwgSW50ZXJzZWN0aW9uT2JzZXJ2ZXJDYWxsYmFjaz4oKTtcblxuICAgIHB1YmxpYyBtYXJnaW4gPSAnJztcbiAgICBwdWJsaWMgdGhyZXNob2xkID0gJyc7XG5cbiAgICBjb25zdHJ1Y3RvcigpIHtcbiAgICAgICAgY29uc3Qgcm9vdCA9IGluamVjdChJTlRFUlNFQ1RJT05fUk9PVCwge29wdGlvbmFsOiB0cnVlfSk7XG5cbiAgICAgICAgc3VwZXIoXG4gICAgICAgICAgICAoZW50cmllcykgPT4ge1xuICAgICAgICAgICAgICAgIHRoaXMuY2FsbGJhY2tzLmZvckVhY2goKGNhbGxiYWNrLCBlbGVtZW50KSA9PiB7XG4gICAgICAgICAgICAgICAgICAgIGNvbnN0IGZpbHRlcmVkID0gZW50cmllcy5maWx0ZXIoKHt0YXJnZXR9KSA9PiB0YXJnZXQgPT09IGVsZW1lbnQpO1xuXG4gICAgICAgICAgICAgICAgICAgIHJldHVybiBmaWx0ZXJlZC5sZW5ndGggJiYgY2FsbGJhY2soZmlsdGVyZWQsIHRoaXMpO1xuICAgICAgICAgICAgICAgIH0pO1xuICAgICAgICAgICAgfSxcbiAgICAgICAgICAgIHtcbiAgICAgICAgICAgICAgICByb290OiByb290Py5uYXRpdmVFbGVtZW50LFxuICAgICAgICAgICAgICAgIHJvb3RNYXJnaW46IHJvb3RNYXJnaW5GYWN0b3J5KCksXG4gICAgICAgICAgICAgICAgdGhyZXNob2xkOiB0aHJlc2hvbGRGYWN0b3J5KCksXG4gICAgICAgICAgICB9LFxuICAgICAgICApO1xuICAgIH1cblxuICAgIHB1YmxpYyBvdmVycmlkZSBvYnNlcnZlKFxuICAgICAgICB0YXJnZXQ6IEVsZW1lbnQsXG4gICAgICAgIGNhbGxiYWNrOiBJbnRlcnNlY3Rpb25PYnNlcnZlckNhbGxiYWNrID0gKCkgPT4ge30sXG4gICAgKTogdm9pZCB7XG4gICAgICAgIHN1cGVyLm9ic2VydmUodGFyZ2V0KTtcbiAgICAgICAgdGhpcy5jYWxsYmFja3Muc2V0KHRhcmdldCwgY2FsbGJhY2spO1xuICAgIH1cblxuICAgIHB1YmxpYyBvdmVycmlkZSB1bm9ic2VydmUodGFyZ2V0OiBFbGVtZW50KTogdm9pZCB7XG4gICAgICAgIHN1cGVyLnVub2JzZXJ2ZSh0YXJnZXQpO1xuICAgICAgICB0aGlzLmNhbGxiYWNrcy5kZWxldGUodGFyZ2V0KTtcbiAgICB9XG5cbiAgICBwdWJsaWMgbmdPbkRlc3Ryb3koKTogdm9pZCB7XG4gICAgICAgIHRoaXMuZGlzY29ubmVjdCgpO1xuICAgIH1cbn1cblxuLyoqXG4gKiBAZGVwcmVjYXRlZDogdXNlIHtAbGluayBXYUludGVyc2VjdGlvbk9ic2VydmVyRGlyZWN0aXZlfVxuICovXG5leHBvcnQgY29uc3QgSW50ZXJzZWN0aW9uT2JzZXJ2ZXJEaXJlY3RpdmUgPSBXYUludGVyc2VjdGlvbk9ic2VydmVyRGlyZWN0aXZlO1xuXG4vKipcbiAqIEBkZXByZWNhdGVkOiB1c2Uge0BsaW5rIFdhSW50ZXJzZWN0aW9uT2JzZXJ2ZXJ9XG4gKi9cbmV4cG9ydCBjb25zdCBXYU9ic2VydmVyID0gV2FJbnRlcnNlY3Rpb25PYnNlcnZlckRpcmVjdGl2ZTtcbiJdfQ==