All files / src/material/theme colors.js

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
import ModuleUrl from "../../custom-element/module-url.js";
 
function cssRule2Obj( parent, /* CSSRule | CSSStyleSheet | CSSStyleRUle | CSSKeyframesRule | CSSNestedDeclarations */ s, j )
{
    const childrenRules =  (s instanceof CSSNestedDeclarations) ? parent: {};
    if( s.cssRules)
        [...s.cssRules].forEach( (r, i) => cssRule2Obj( childrenRules, r, i ) );
 
    if( s.style )
        {   [...s.style].forEach( s1=>{ childrenRules[s1] = s.style.getPropertyValue(s1) }) }
 
    if( s.styleSheet )
        cssRule2Obj( childrenRules, s.styleSheet, 0 );
 
    let key = s.selectorText ||s.keyText || s.href|| s.ownerNode?.id|| s.ownerNode?.tagName;
    switch( s.type ){
        case 0: key = undefined; break; //CSSNestedDeclarations
        case CSSRule.KEYFRAMES_RULE: key = `@keyframes ${s.name}`; break;
        case CSSRule.FONT_FACE_RULE: key = `@font-face`; break;
        case CSSRule.IMPORT_RULE: key = s.cssText; break;
        case CSSRule.MEDIA_RULE: key = `@media ${s.conditionText}`; break;
    }
 
    if(key)
    {   if( parent[key] )
            key = key+'-'+j;
        parent[key] = childrenRules;
    }
    return parent;
}
 
export class CssRulesElement extends HTMLElement
{
    connectedCallback()
    {
        const allRules = {};
        [ ...document.styleSheets ].forEach( ((s,i) => { try{
            cssRule2Obj( allRules, s,i) }catch(_){}}));
 
        this.value = allRules;
        this.dispatchEvent( new Event('change') );
    }
}
window.customElements.define( 'cem-css-rules', CssRulesElement );