Styleint Treats Multiple Components As Same Component

[Undistraction]

The following two components defined in the same file results in an error:

Components

const Layout = styled(HSpreadLayout)`
  > *:first-child {
    padding: 1.25rem;
  }
`

const NavList = styled(HList)`
  > * + * {
    border-left: 1px solid #bbb;
  }
`

Error

Expected selector ".selector6 > * + *" to come before selector ".selector5 > *:first-child" no-descending-specificity

Expected Each component should be evaluated separately.

• Node 8.11.3
• "stylelint": "^9.5.0",
• "stylelint-config-recommended": "^2.1.0",
• "stylelint-config-styled-components": "^0.1.1",
• "stylelint-processor-styled-components": "^1.3.2"

[chinesedfan]

@Undistraction You're right. But I am afraid that stylelint doesn't give a processor the possibility to do that. Because a processor can only extract codes from user's input file and ask stylelint to lint together, which is a string, instead of array.

[Undistraction]

@chinesedfan That seems like a pretty big issue to me because it forces you to define your components in an order just to satisfy the processor. It could also potentially lead to cases that cannot be satisfied by changing component order.

[sergio-toro]

We have the same issue, turning off no-descending-specificity linting rule until this gets fixed. Big issue :(