packages/heml-styles/src/plugins/postcss-element-expander/expanders.js
function replaceElementPseudoMentions (element, selector) {
  const processor = selectorParser((selectors) => {
    let nodesToReplace = []

    /**
     * looping breaks if we replace dynamically
     * so instead collect an array of nodes to swap and do it at the end
     */
    selectors.each((selector) => {
      let onElementTag = false

      selector.each((node) => {
        if (node.type === 'tag' && node.value === element.tag) {
          onElementTag = true
        } else if (node.type === 'combinator') {
          onElementTag = false
        } else if (node.type === 'pseudo' && onElementTag) {
          const matchedPseudos = Object.entries(element.pseudos).filter(([ pseudo ]) => {
            return node.value.replace(/::?/, '') === pseudo
          })

          if (matchedPseudos.length > 0) {
            const [, value] = matchedPseudos[0]
            nodesToReplace.push({ node, value })
          }
        }
      })
    })

    nodesToReplace.forEach(({ node, value }) => node.replaceWith(` ${value}`))
  })

  return processor.process(selector).result
}
function replaceElementPseudoMentions (element, selector) {
  const processor = selectorParser((selectors) => {
    let nodesToReplace = []

    /**
     * looping breaks if we replace dynamically
     * so instead collect an array of nodes to swap and do it at the end
     */
    selectors.each((selector) => {
      let onElementTag = false

      selector.each((node) => {
        if (node.type === 'tag' && node.value === element.tag) {
          onElementTag = true
        } else if (node.type === 'combinator') {
          onElementTag = false
        } else if (node.type === 'pseudo' && onElementTag) {
          const matchedPseudos = Object.entries(element.pseudos).filter(([ pseudo ]) => {
            return node.value.replace(/::?/, '') === pseudo
          })

          if (matchedPseudos.length > 0) {
            const [, value] = matchedPseudos[0]
            nodesToReplace.push({ node, value })
          }
        }
      })
    })

    nodesToReplace.forEach(({ node, value }) => node.replaceWith(` ${value}`))
  })

  return processor.process(selector).result
}
function replaceElementPseudoMentions ( element , selector ) { const processor = selectorParser ( ( selectors ) => { let nodesToReplace = [ ] /**
     * looping breaks if we replace dynamically
     * so instead collect an array of nodes to swap and do it at the end
     */ selectors . each ( ( selector ) => { let onElementTag = false selector . each ( ( node ) => { if ( node . type === 'tag' && node . value === element . tag ) { onElementTag = true } else if ( node . type === 'combinator' ) { onElementTag = false } else if ( node . type === 'pseudo' && onElementTag ) { const matchedPseudos = Object . entries ( element . pseudos ) . filter ( ( [ pseudo ] ) => { return node . value . replace ( / ::? / , '' ) === pseudo } ) if ( matchedPseudos . length > 0 ) { const [ , value ] = matchedPseudos [ 0 ] nodesToReplace . push ( { node , value } ) } } } ) } ) nodesToReplace . forEach ( ( { node , value } ) => node . replaceWith ( ` ${ value } ` ) ) } ) return processor . process ( selector ) . result }
replace all custom element pseudo selectors
@param  {Object} element  the element definiton
@param  {String} selector the selector
@return {String}          the replaced selector
replace all custom element pseudo selectors