igniteui-webcomponents/theming/utils.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 { isServer } from 'lit';
import { isDefined } from '../components/common/util.js';
function isStyleRule(rule) {
    return !!rule && 'style' in rule;
}
function cssKeyToJsKey(key) {
    return key.replace('--', '').replace(/-./g, (x) => x.toUpperCase()[1]);
}
function getAllCssVariableNames() {
    const cssVars = new Set();
    if (isServer || !isDefined(globalThis.document)) {
        return cssVars;
    }
    const styleSheets = Array.from(globalThis.document.styleSheets).filter((sheet) => {
        try {
            return sheet.cssRules;
        }
        catch {
            return false;
        }
    });
    for (const sheet of styleSheets) {
        const rules = Array.from(sheet.cssRules).filter(isStyleRule);
        for (const rule of rules) {
            Array.from(rule.style).forEach((style) => {
                if (style.startsWith('--')) {
                    cssVars.add(style);
                }
            });
        }
    }
    return cssVars;
}
function getElementCssVariables(allCssVars, element, pseudo) {
    const cssVars = {};
    if (!isDefined(globalThis.getComputedStyle)) {
        return cssVars;
    }
    const styles = globalThis.getComputedStyle(element, pseudo);
    for (const key of allCssVars) {
        const value = styles.getPropertyValue(key);
        if (value) {
            cssVars[cssKeyToJsKey(key)] = value.trim();
        }
    }
    return cssVars;
}
export function getAllCssVariables() {
    return isServer || !isDefined(globalThis.document)
        ? {}
        : getElementCssVariables(getAllCssVariableNames(), globalThis.document.documentElement);
}
//# sourceMappingURL=utils.js.map