No color highlighting when using function that returns code

Describe the bug (including copyable syntax) No color highlighting when using function inside a styled component.

Example:

${({ $currentStep, theme }) => {
  if ($currentStep > 0) {
    return `
      padding: 10px 8px 10px 25px;

      @media (min-width: ${theme.breakpoints.md}) {
        padding: 10px 18px;
      }
    `;
  }
}}

Screenshot

To Reproduce To reproduce, simply add a function that returns some css code into a styled component and no color highlighting will be shown.

Expected behavior CSS code should be color highlighted.

Build environment (please complete the following information):

• OS: MacOS 12.2.1 (M1 chip)
• VSCode Version: 1.65.2
• Extension Version 1.7.3

Additional context Maybe related to this issue https://github.com/styled-components/vscode-styled-components/issues/358

[pzi]

it’s not even just the colour highlighting, it’s also lacking autocompletion and suggestions.

[GollyJer]

Yeah. Would be awesome not to have to use it.