@aurigma/design-atoms/Utils/ClickOutEvent.js

Design Atoms is a part of Customer's Canvas SDK which allows for manipulating individual design elements through your code.

import { throttle } from "@aurigma/design-atoms-model";
import { Utils } from "../Utils/Common";
import { getChildElementsRecursive } from "./Dom";
/** static class */
export class ClickOutEvent {
    static initFor(element, options) {
        if (ClickOutEvent._initializedElements.has(element))
            ClickOutEvent.deInitFor(element);
        if (options == null)
            options = {};
        if (options.documents == null)
            options.documents = [element.ownerDocument];
        if (options.ignoreElements == null)
            options.ignoreElements = [];
        const { ignoreEventPathElementsSelector } = options;
        const listeners = [];
        const listener = throttle((e) => {
            const eventPath = Utils.getEventPath(e);
            if (ignoreEventPathElementsSelector != null && Array.from(document.querySelectorAll(ignoreEventPathElementsSelector)).some(el => eventPath.includes(el)))
                return;
            ClickOutEvent._onDocumentClick(eventPath, element);
        }, 100, { trailing: false });
        options.documents.forEach(doc => {
            for (let event of ["click", "touchend", "pointerup"]) {
                doc.addEventListener(event, listener);
                listeners.push({ doc: doc, event: event, listener: listener });
            }
        });
        ClickOutEvent._initializedElements.set(element, { listeners: listeners, ignoreElements: options.ignoreElements, ignoreElementSelector: options.ignoreElementSelector });
    }
    static _onDocumentClick(eventPath, targetElement) {
        const initializedElement = ClickOutEvent._initializedElements.get(targetElement);
        const ignoreElements = [
            targetElement,
            ...getChildElementsRecursive(targetElement),
            ...initializedElement.ignoreElements,
            ...(initializedElement.ignoreElementSelector != null ? Array.from(document.querySelectorAll(initializedElement.ignoreElementSelector)) : [])
        ];
        if (eventPath.some(el => ignoreElements.includes(el)))
            return;
        const event = new CustomEvent(ClickOutEvent.eventName);
        targetElement.dispatchEvent(event);
    }
    static deInitFor(element) {
        if (!ClickOutEvent._initializedElements.has(element))
            return;
        for (let { doc, event, listener } of ClickOutEvent._initializedElements.get(element).listeners)
            removeListener(doc, event, listener);
        ClickOutEvent._initializedElements.delete(element);
        function removeListener(doc, event, listener) {
            try {
                doc.removeEventListener(event, listener);
            }
            catch (ex) {
                if (ex instanceof TypeError)
                    return; //IE/Edge workaround
                throw ex;
            }
        }
    }
}
ClickOutEvent.eventName = "clickOut";
ClickOutEvent._initializedElements = new Map();
//# sourceMappingURL=ClickOutEvent.js.map