@solid-primitives/mutation-observer/dist/index.d.ts

Primitive providing the ability to watch for changes made to the DOM tree.

import type { JSX } from "solid-js";
import { type MaybeAccessor } from "@solid-primitives/utils";
export type MutationObserverAdd = (target: Node, options?: MaybeAccessor<MutationObserverInit>) => void;
export type MutationObserverReturn = [
    add: MutationObserverAdd,
    rest: {
        start: VoidFunction;
        stop: VoidFunction;
        instance: MutationObserver;
        isSupported: boolean;
    }
];
export type MutationObserverStandaloneDirectiveProps = [
    options: MutationObserverInit,
    callback: MutationCallback
];
declare module "solid-js" {
    namespace JSX {
        interface Directives {
            mutationObserver: MutationObserverInit | MutationObserverStandaloneDirectiveProps;
        }
    }
}
export type E = JSX.Element;
/**
 * Primitive providing the ability to watch for changes being made to the DOM tree.
 *
 * @param initial html elements to be observed by the MutationObserver
 * @param options MutationObserver options
 * @param callback function called by MutationObserver when DOM tree mutation is triggered
 *
 * @see https://github.com/solidjs-community/solid-primitives/tree/main/packages/mutation-observer
 * @see https://developer.mozilla.org/en-US/docs/Web/API/MutationObserver
 *
 * @example
 * ```ts
 * let ref: !HTMLElement;
 * const [observe, { start, stop, instance }] = createMutationObserver(
 *   () => ref,
 *   { attributes: true, subtree: true },
 *   records => console.log(records)
 * );
 *
 * // Usage as a directive
 * const [mutationObserver] = createMutationObserver([], e => {...})

<div use:mutationObserver={{ childList: true }}>...</div>
 * ```
 */
export declare function createMutationObserver(initial: MaybeAccessor<Node | Node[]>, options: MutationObserverInit, callback: MutationCallback): MutationObserverReturn;
export declare function createMutationObserver(initial: MaybeAccessor<[Node, MutationObserverInit][]>, callback: MutationCallback): MutationObserverReturn;
/**
 * Primitive providing the ability to watch for changes being made to the DOM tree.
 * A Standalone Directive.
 *
 * @param props [MutationObserver options, callback]
 *
 * @see https://github.com/solidjs-community/solid-primitives/tree/main/packages/mutation-observer
 * @see https://developer.mozilla.org/en-US/docs/Web/API/MutationObserver
 *
 * @example
 * ```tsx
 * <div use:mutationObserver={[{ childList: true }, e => {...}]}></div>
 * ```
 */
export declare const mutationObserver: (target: Element, props: () => MutationObserverStandaloneDirectiveProps) => void;