Convert flat selectors to nested

[jedwards1211]

Note

Comma-separated selectors should be left as is, because otherwise we would have to split up the CSS properties, resulting in duplicated code:

.foo:active, .bar:active { color: 'green' }

{
  foo: {
    '&:active': { color: 'green' },
  },
  bar: {
    '&:active': { color: 'green' }, // now foo:active and bar:active no longer share a single source of truth for this...
  }
}

Theoretically we could extract variables in cases like this, but right now the CSS-to-JSS transform is only designed to modify text within the selection (which is expected to be inside the braces of some const styles = { ... })

Basic Testcase

Input

.foo {}
.foo.bar {}

Expected Output

{
  bar: {},
  foo: {
    '&$bar': {},
  },
}