"Unclosed bracket" when using template literals inside template literals

[hudochenkov]

"Unclosed bracket" error is thrown when interpolation has template literals inside.

I'm using the latest stylelint@9.9.0:

> stylelint "**/*.styled.js" --syntax styled

Table.styled.js
 6:31  ✖  Unclosed bracket   CssSyntaxError

import styled from 'styled-components';

const color = '#ddd';

export const Row = styled.div`
  border-bottom: ${(props) => (props.border ? `1px solid ${color}` : '0')};
`;

When removing nested template literals no error it thrown:

import styled from 'styled-components';

const color = '#ddd';

export const Row = styled.div`
  border-bottom: ${(props) => (props.border ? '1px solid ' + color : '0')};
`;

Test repository: https://github.com/hudochenkov/styled-component-stylelint-bugs/tree/master/template-literal-within-template-literal