@ng-web-apis/mutation-observer/fesm2022/ng-web-apis-mutation-observer.mjs

A library for declarative use of Mutation Observer API with Angular

import * as i0 from '@angular/core';
import { InjectionToken, inject, ElementRef, EventEmitter, Directive, Input, Output, Injectable } from '@angular/core';
import { Observable } from 'rxjs';

const SafeObserver = typeof MutationObserver !== 'undefined'
    ? MutationObserver
    : class {
        observe() { }
        disconnect() { }
        takeRecords() {
            return [];
        }
    };

const WA_MUTATION_OBSERVER_INIT = new InjectionToken('[WA_MUTATION_OBSERVER_INIT]');
/**
 * @deprecated: drop in v5.0, use {@link WA_MUTATION_OBSERVER_INIT}
 */
const MUTATION_OBSERVER_INIT = WA_MUTATION_OBSERVER_INIT;
function provideMutationObserverInit(useValue) {
    return {
        provide: WA_MUTATION_OBSERVER_INIT,
        useValue,
    };
}

function booleanAttribute(element, attribute) {
    return element.getAttribute(attribute) !== null || undefined;
}

function mutationObserverInitFactory() {
    const { nativeElement } = inject(ElementRef);
    const attributeFilter = nativeElement.getAttribute('attributeFilter');
    return {
        attributeFilter: attributeFilter?.split(',').map((attr) => attr.trim()),
        attributeOldValue: booleanAttribute(nativeElement, 'attributeOldValue'),
        attributes: booleanAttribute(nativeElement, 'attributes'),
        characterData: booleanAttribute(nativeElement, 'characterData'),
        characterDataOldValue: booleanAttribute(nativeElement, 'characterDataOldValue'),
        childList: booleanAttribute(nativeElement, 'childList'),
        subtree: booleanAttribute(nativeElement, 'subtree'),
    };
}

class WaMutationObserver extends SafeObserver {
    nativeElement = inject(ElementRef).nativeElement;
    config = inject(MUTATION_OBSERVER_INIT);
    attributeFilter = '';
    attributeOldValue = '';
    attributes = '';
    characterData = '';
    characterDataOldValue = '';
    childList = '';
    subtree = '';
    waMutationObserver = new EventEmitter();
    constructor() {
        super((records) => {
            this.waMutationObserver.emit(records);
        });
        this.observe(this.nativeElement, this.config);
    }
    ngOnDestroy() {
        this.disconnect();
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: WaMutationObserver, deps: [], target: i0.ɵɵFactoryTarget.Directive });
    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: WaMutationObserver, isStandalone: true, selector: "[waMutationObserver]", inputs: { attributeFilter: "attributeFilter", attributeOldValue: "attributeOldValue", attributes: "attributes", characterData: "characterData", characterDataOldValue: "characterDataOldValue", childList: "childList", subtree: "subtree" }, outputs: { waMutationObserver: "waMutationObserver" }, providers: [
            {
                provide: MUTATION_OBSERVER_INIT,
                useFactory: mutationObserverInitFactory,
            },
        ], exportAs: ["MutationObserver"], usesInheritance: true, ngImport: i0 });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: WaMutationObserver, decorators: [{
            type: Directive,
            args: [{
                    standalone: true,
                    selector: '[waMutationObserver]',
                    providers: [
                        {
                            provide: MUTATION_OBSERVER_INIT,
                            useFactory: mutationObserverInitFactory,
                        },
                    ],
                    exportAs: 'MutationObserver',
                }]
        }], ctorParameters: function () { return []; }, propDecorators: { attributeFilter: [{
                type: Input
            }], attributeOldValue: [{
                type: Input
            }], attributes: [{
                type: Input
            }], characterData: [{
                type: Input
            }], characterDataOldValue: [{
                type: Input
            }], childList: [{
                type: Input
            }], subtree: [{
                type: Input
            }], waMutationObserver: [{
                type: Output
            }] } });
/**
 * @deprecated: use {@link WaMutationObserver}
 */
const MutationObserverDirective = WaMutationObserver;

class MutationObserverService extends Observable {
    constructor() {
        const nativeElement = inject(ElementRef).nativeElement;
        const config = inject(MUTATION_OBSERVER_INIT);
        super((subscriber) => {
            const observer = new SafeObserver((records) => {
                subscriber.next(records);
            });
            observer.observe(nativeElement, config);
            return () => {
                observer.disconnect();
            };
        });
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MutationObserverService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MutationObserverService });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MutationObserverService, decorators: [{
            type: Injectable
        }], ctorParameters: function () { return []; } });

/**
 * Generated bundle index. Do not edit.
 */

export { MUTATION_OBSERVER_INIT, MutationObserverDirective, MutationObserverService, WA_MUTATION_OBSERVER_INIT, WaMutationObserver, provideMutationObserverInit };
//# sourceMappingURL=ng-web-apis-mutation-observer.mjs.map