devextreme/cjs/__internal/core/utils/m_shadow_dom.js

JavaScript/TypeScript Component Suite for Responsive Web Development

/**
 * DevExtreme (cjs/__internal/core/utils/m_shadow_dom.js)
 * Version: 25.2.7
 * Build date: Tue May 05 2026
 *
 * Copyright (c) 2012 - 2026 Developer Express Inc. ALL RIGHTS RESERVED
 * Read about DevExtreme licensing here: https://js.devexpress.com/Licensing/
 */
"use strict";
Object.defineProperty(exports, "__esModule", {
    value: true
});
exports.addShadowDomStyles = addShadowDomStyles;
exports.computeStyleSheetsHash = computeStyleSheetsHash;
exports.getShadowElementsFromPoint = getShadowElementsFromPoint;
var _config = _interopRequireDefault(require("../../../core/config"));

function _interopRequireDefault(e) {
    return e && e.__esModule ? e : {
        default: e
    }
}
const DX_RULE_PREFIX = "dx-";
let ownerDocumentStyleSheet = null;

function createConstructedStyleSheet(rootNode) {
    try {
        return new CSSStyleSheet
    } catch (err) {
        const styleElement = rootNode.ownerDocument.createElement("style");
        rootNode.appendChild(styleElement);
        return styleElement.sheet
    }
}

function processRules(targetStyleSheet, styleSheets, needApplyAllStyles) {
    for (let i = 0; i < styleSheets.length; i++) {
        const sheet = styleSheets[i];
        try {
            for (let j = 0; j < sheet.cssRules.length; j++) {
                insertRule(targetStyleSheet, sheet.cssRules[j], needApplyAllStyles)
            }
        } catch (err) {}
    }
}

function insertRule(targetStyleSheet, rule, needApplyAllStyles) {
    var _rule$selectorText, _rule$cssRules, _rule$name, _rule$style;
    const isDxRule = needApplyAllStyles || (null === (_rule$selectorText = rule.selectorText) || void 0 === _rule$selectorText ? void 0 : _rule$selectorText.includes("dx-")) || (null === (_rule$cssRules = rule.cssRules) || void 0 === _rule$cssRules || null === (_rule$cssRules = _rule$cssRules[0]) || void 0 === _rule$cssRules || null === (_rule$cssRules = _rule$cssRules.selectorText) || void 0 === _rule$cssRules ? void 0 : _rule$cssRules.includes("dx-")) || (null === (_rule$name = rule.name) || void 0 === _rule$name ? void 0 : _rule$name.startsWith("dx-")) || "DXIcons" === (null === (_rule$style = rule.style) || void 0 === _rule$style ? void 0 : _rule$style.fontFamily);
    if (isDxRule) {
        targetStyleSheet.insertRule(rule.cssText, targetStyleSheet.cssRules.length)
    }
}
const FNV_OFFSET_BASIS = 2166136261;
const sheetHashes = new WeakMap;

function computeStyleSheetsHash(styleSheets) {
    let hash = FNV_OFFSET_BASIS;
    for (const sheet of styleSheets) {
        if (sheetHashes.has(sheet)) {
            hash ^= sheetHashes.get(sheet);
            continue
        }
        let localHash = FNV_OFFSET_BASIS;
        try {
            for (const rule of sheet.cssRules) {
                const text = rule.cssText;
                for (let i = 0; i < text.length; i++) {
                    localHash ^= text.charCodeAt(i);
                    localHash += (localHash << 1) + (localHash << 4) + (localHash << 7) + (localHash << 8) + (localHash << 24)
                }
            }
        } catch (_) {}
        localHash >>>= 0;
        sheetHashes.set(sheet, localHash);
        hash ^= localHash
    }
    return hash >>> 0
}
const styleSheetHashes = new WeakMap;

function addShadowDomStyles($element) {
    var _el$getRootNode;
    if (!(0, _config.default)().copyStylesToShadowDom) {
        return
    }
    const el = $element.get(0);
    const root = null === (_el$getRootNode = el.getRootNode) || void 0 === _el$getRootNode ? void 0 : _el$getRootNode.call(el);
    if (!(null !== root && void 0 !== root && root.host)) {
        return
    }
    if (!ownerDocumentStyleSheet) {
        ownerDocumentStyleSheet = createConstructedStyleSheet(root);
        processRules(ownerDocumentStyleSheet, el.ownerDocument.styleSheets, false)
    }
    const localHash = computeStyleSheetsHash(root.styleSheets);
    if (styleSheetHashes.get(root) === localHash) {
        return
    }
    styleSheetHashes.set(root, localHash);
    const currentShadowDomStyleSheet = createConstructedStyleSheet(root);
    processRules(currentShadowDomStyleSheet, root.styleSheets, true);
    root.adoptedStyleSheets = [ownerDocumentStyleSheet, currentShadowDomStyleSheet]
}

function isPositionInElementRectangle(element, x, y) {
    var _element$getBoundingC;
    const rect = null === (_element$getBoundingC = element.getBoundingClientRect) || void 0 === _element$getBoundingC ? void 0 : _element$getBoundingC.call(element);
    return rect && x >= rect.left && x < rect.right && y >= rect.top && y < rect.bottom
}

function createQueue() {
    let shiftIndex = 0;
    const items = [];
    return {
        push(item) {
            items.push(item);
            return this
        },
        shift() {
            shiftIndex++;
            return items[shiftIndex - 1]
        },
        get length() {
            return items.length - shiftIndex
        },
        get items() {
            return items
        }
    }
}

function getShadowElementsFromPoint(x, y, root) {
    const elementQueue = createQueue().push(root);
    while (elementQueue.length) {
        const el = elementQueue.shift();
        for (let i = 0; i < el.childNodes.length; i++) {
            const childNode = el.childNodes[i];
            if (childNode.nodeType === Node.ELEMENT_NODE && isPositionInElementRectangle(childNode, x, y) && "none" !== getComputedStyle(childNode).pointerEvents) {
                elementQueue.push(childNode)
            }
        }
    }
    const result = elementQueue.items.reverse();
    result.pop();
    return result
}