Fix type error with modifier

[timhwang21]

Closes #268.

[cscheffauer]

Looks solid to me!

[quantizor]

Why are you trying to put a tagged template literal into the modifier field?

[timhwang21]

Because that's what the README suggests for this use case.

If a rule is nested within another styled-component, the modifier option can be used with the css helper to target the nested rule.

const Button = styled.button`
  color: red;
`

const ButtonList = styled.div`
  display: flex;

  ${Button} {
    flex: 1 0 auto;
  }
`

import { css } from 'styled-components';

test('nested buttons are flexed', () => {
  const tree = renderer.create(<ButtonList><Button /></ButtonList>).toJSON()
  expect(tree).toHaveStyleRule('flex', '1 0 auto', {
    modifier: css`${Button}`,
  })
})

[quantizor]

@timhwang21 ok cool, could you merge from main and run yarn to clear the lockfile merge conflict?

[timhwang21]

Will do -- looks like @types/styled-components has been updated since then so I updated that to latest as well.