@smart-react-components/ui/util/dom.js

SRC UI includes React and Styled components.

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.isTargetClickable = exports.isElementScrollable = exports.getScrollParent = exports.canBeRenderedInPortal = exports.calculateShownPart = exports.placeholder = exports.mouseWheel = void 0;
const dom_1 = require("@smart-react-components/core/util/dom");
exports.mouseWheel = ['wheel', 'mousewheel', 'DOMMouseScroll'];
exports.placeholder = ['::-webkit-input-placeholder', '::-moz-placeholder', ':-moz-placeholder', ':-ms-input-placeholder', '::placeholder'];
/**
 * Calculates the left, top, width and height of the element shown on the screen.
 */
const calculateShownPart = (el) => {
    if (!el) {
        return {
            left: 0,
            top: 0,
            width: window.innerWidth,
            height: window.innerHeight,
        };
    }
    const parent = (0, exports.calculateShownPart)((0, exports.getScrollParent)(el));
    let { left, top, width, height } = el.getBoundingClientRect();
    // left & width
    if (left < 0) {
        width += left;
        left = 0;
    }
    if (width > 0 && left < parent.left) {
        width -= parent.left - left;
        left = parent.left;
    }
    if (width > 0 && width + left > parent.width + parent.left) {
        width -= (width + left) - (parent.width + parent.left);
    }
    // top & height
    if (top < 0) {
        height += top;
        top = 0;
    }
    if (height > 0 && top < parent.top) {
        height -= parent.top - top;
        top = parent.top;
    }
    if (height > 0 && height + top > parent.height + parent.top) {
        height -= (height + top) - (parent.height + parent.top);
    }
    return {
        left,
        top,
        width,
        height,
    };
};
exports.calculateShownPart = calculateShownPart;
/**
 * Checks if an element can be rendered in the React portal.
 */
const canBeRenderedInPortal = () => !dom_1.isServer && process.env.NODE_ENV !== 'test';
exports.canBeRenderedInPortal = canBeRenderedInPortal;
/**
 * Gets scroll parent of the given element.
 *
 * @param el
 */
const getScrollParent = (el) => {
    for (let parent = el; (parent = parent.parentElement);) {
        if ((0, exports.isElementScrollable)(parent)) {
            return parent;
        }
    }
    return null;
};
exports.getScrollParent = getScrollParent;
/**
 * Checks if the given element is scrollable.
 */
const isElementScrollable = (el) => {
    const style = window.getComputedStyle(el, null);
    return /(auto|scroll|hidden)/.test(style.overflow + style.overflowX + style.overflowY);
};
exports.isElementScrollable = isElementScrollable;
/**
 * Checks if target is a clickable element.
 */
const isTargetClickable = (target, container) => {
    while (container.contains(target)) {
        if (target.hasAttribute('data-src-not-clickable')) {
            return false;
        }
        target = target.parentNode;
    }
    return true;
};
exports.isTargetClickable = isTargetClickable;