diff --git a/src/css_composer/index.ts b/src/css_composer/index.ts index 991a0bfcf..f09134030 100644 --- a/src/css_composer/index.ts +++ b/src/css_composer/index.ts @@ -370,7 +370,7 @@ export default class CssComposer extends ItemManagerModule { ); }; +export interface FullNameOptions { + combination?: boolean; + array?: boolean; +} + export default class Selectors extends Collection { modelId(attr: any) { return `${attr.name}_${attr.type || Selector.TYPE_CLASS}`; @@ -32,7 +37,7 @@ export default class Selectors extends Collection { return result.join('').trim(); } - getFullName(opts: any = {}) { + getFullName(opts: T = {} as T) { const { combination, array } = opts; let result: string[] = []; const sels = this.map(s => s.getFullName(opts)).sort(); @@ -45,7 +50,9 @@ export default class Selectors extends Collection { result = sels; } - return array ? result : combination ? result.join(',') : result.join(''); + return (array ? result : combination ? result.join(',') : result.join('')) as T['array'] extends true + ? string[] + : string; } } diff --git a/src/style_manager/index.ts b/src/style_manager/index.ts index 932255876..1abb2e329 100644 --- a/src/style_manager/index.ts +++ b/src/style_manager/index.ts @@ -594,19 +594,26 @@ export default class StyleManager extends ItemManagerModule< const cssGen = em.CodeManager.getGenerator('css'); // @ts-ignore const cmp = target.toHTML ? target : target.getComponent(); - const optsSel = { combination: true, array: true }; - let cmpRules = []; - let otherRules = []; - let rules = []; + const optsSel = { array: true } as const; + let cmpRules: CssRule[] = []; + let otherRules: CssRule[] = []; + let rules: CssRule[] = []; + + const rulesBySelectors = (values: string[]) => { + return cssC.getRules().filter(rule => { + const rSels = rule.getSelectors().map(s => s.getFullName()); + return rSels.every(rSel => values.indexOf(rSel) >= 0); + }); + }; // Componente related rule if (cmp) { cmpRules = cssC.getRules(`#${cmp.getId()}`); - otherRules = sel ? cssC.getRules(sel.getSelectors().getFullName(optsSel) as string) : []; + otherRules = sel ? rulesBySelectors(sel.getSelectors().getFullName(optsSel)) : []; rules = otherRules.concat(cmpRules); } else { cmpRules = sel ? cssC.getRules(`#${sel.getId()}`) : []; - otherRules = cssC.getRules(target.getSelectors().getFullName(optsSel) as string); + otherRules = rulesBySelectors(target.getSelectors().getFullName(optsSel)); rules = cmpRules.concat(otherRules); }