function increaseSpecifityOfRule()

in packages/core/kernal/src/misc/postcssWrap.ts [17:47]


function increaseSpecifityOfRule(rule: postcss.Rule, opts: IOptions) {
  rule.selectors = rule.selectors.map((selector: string) => {
    // Apply it to the selector itself if the selector is a `root` level component
    // `html:not(#\\9):not(#\\9):not(#\\9)`
    if (
      selector === 'html' ||
      selector === ':root' ||
      selector === ':host' ||
      selector === opts.stackableRoot
    ) {
      return selector + opts.stackableRoot.repeat(opts.repeat);
    }

    // Otherwise just make it a descendant (this is what will happen most of the time)
    // `:not(#\\9):not(#\\9):not(#\\9) .foo`
    return `${opts.stackableRoot.repeat(opts.repeat) } ${ selector}`;
  });

  if (opts.overrideIds) {
    if (
      // If an id is in there somewhere
      (new RegExp(`#(?!${ escapeStringRegexp(CSS_ESCAPED_TAB) })`)).test(rule.selector) ||
      // Or it is an attribute selector with an id
      (/\[id/).test(rule.selector)
    ) {
      rule.walkDecls((decl) => {
        decl.important = true;
      });
    }
  }
}