@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.

var __values = (this && this.__values) || function(o) {
    var s = typeof Symbol === "function" && Symbol.iterator, m = s && o[s], i = 0;
    if (m) return m.call(o);
    if (o && typeof o.length === "number") return {
        next: function () {
            if (o && i >= o.length) o = void 0;
            return { value: o && o[i++], done: !o };
        }
    };
    throw new TypeError(s ? "Object is not iterable." : "Symbol.iterator is not defined.");
};
var __read = (this && this.__read) || function (o, n) {
    var m = typeof Symbol === "function" && o[Symbol.iterator];
    if (!m) return o;
    var i = m.call(o), r, ar = [], e;
    try {
        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
    }
    catch (error) { e = { error: error }; }
    finally {
        try {
            if (r && !r.done && (m = i["return"])) m.call(i);
        }
        finally { if (e) throw e.error; }
    }
    return ar;
};
var __spread = (this && this.__spread) || function () {
    for (var ar = [], i = 0; i < arguments.length; i++) ar = ar.concat(__read(arguments[i]));
    return ar;
};
import * as _ from "underscore";
import { Utils } from "../Utils/Common";
import { getChildElementsRecursive } from "./Dom";
//namespace CustomersCanvas.Utils {
/** static class */
var ClickOutEvent = /** @class */ (function () {
    function ClickOutEvent() {
    }
    ClickOutEvent.initFor = function (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 = [];
        var ignoreEventPathElementsSelector = options.ignoreEventPathElementsSelector;
        var listeners = [];
        var listener = _.throttle(function (e) {
            var eventPath = Utils.getEventPath(e);
            if (ignoreEventPathElementsSelector != null && Array.from(document.querySelectorAll(ignoreEventPathElementsSelector)).some(function (el) { return eventPath.includes(el); }))
                return;
            ClickOutEvent._onDocumentClick(eventPath, element);
        }, 100, { trailing: false });
        options.documents.forEach(function (doc) {
            var e_1, _a;
            try {
                for (var _b = __values(["click", "touchend", "pointerup"]), _c = _b.next(); !_c.done; _c = _b.next()) {
                    var event_1 = _c.value;
                    doc.addEventListener(event_1, listener);
                    listeners.push({ doc: doc, event: event_1, listener: listener });
                }
            }
            catch (e_1_1) { e_1 = { error: e_1_1 }; }
            finally {
                try {
                    if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
                }
                finally { if (e_1) throw e_1.error; }
            }
        });
        ClickOutEvent._initializedElements.set(element, { listeners: listeners, ignoreElements: options.ignoreElements, ignoreElementSelector: options.ignoreElementSelector });
    };
    ClickOutEvent._onDocumentClick = function (eventPath, targetElement) {
        var initializedElement = ClickOutEvent._initializedElements.get(targetElement);
        var ignoreElements = __spread([
            targetElement
        ], getChildElementsRecursive(targetElement), initializedElement.ignoreElements, (initializedElement.ignoreElementSelector != null ? Array.from(document.querySelectorAll(initializedElement.ignoreElementSelector)) : []));
        if (eventPath.some(function (el) { return ignoreElements.includes(el); }))
            return;
        var event = new CustomEvent(ClickOutEvent.eventName);
        targetElement.dispatchEvent(event);
    };
    ClickOutEvent.deInitFor = function (element) {
        var e_2, _a;
        if (!ClickOutEvent._initializedElements.has(element))
            return;
        try {
            for (var _b = __values(ClickOutEvent._initializedElements.get(element).listeners), _c = _b.next(); !_c.done; _c = _b.next()) {
                var _d = _c.value, doc = _d.doc, event_2 = _d.event, listener = _d.listener;
                removeListener(doc, event_2, listener);
            }
        }
        catch (e_2_1) { e_2 = { error: e_2_1 }; }
        finally {
            try {
                if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
            }
            finally { if (e_2) throw e_2.error; }
        }
        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();
    return ClickOutEvent;
}());
export { ClickOutEvent };
//}
//# sourceMappingURL=ClickOutEvent.js.map