igniteui-webcomponents/components/common/controllers/root-click.js

Ignite UI for Web Components is a complete library of UI components, giving you the ability to build modern web applications using encapsulation and the concept of reusable components in a dependency-free approach.

import { findElementFromEventPath } from '../util.js';
export class RootClickController {
    constructor(host, config) {
        this.host = host;
        this.config = config;
        this.host.addController(this);
    }
    addEventListeners() {
        if (!this.host.keepOpenOnOutsideClick) {
            document.addEventListener('click', this, { capture: true });
        }
    }
    removeEventListeners() {
        document.removeEventListener('click', this, { capture: true });
    }
    configureListeners() {
        this.host.open ? this.addEventListeners() : this.removeEventListeners();
    }
    shouldHide(event) {
        const targets = new Set([this.host]);
        if (this.config?.target) {
            targets.add(this.config.target);
        }
        return !findElementFromEventPath((node) => targets.has(node), event);
    }
    handleEvent(event) {
        if (this.host.keepOpenOnOutsideClick) {
            return;
        }
        if (this.shouldHide(event)) {
            this.hide();
        }
    }
    hide() {
        this.config?.hideCallback
            ? this.config.hideCallback.call(this.host)
            : this.host.hide();
    }
    update(config) {
        if (config) {
            this.config = { ...this.config, ...config };
        }
        this.configureListeners();
    }
    hostConnected() {
        this.configureListeners();
    }
    hostDisconnected() {
        this.removeEventListeners();
    }
}
export function addRootClickHandler(host, config) {
    return new RootClickController(host, config);
}
//# sourceMappingURL=root-click.js.map