IntelliSense does not show class suggestions with selectors using square brackets

[kaisergeX]

What version of VS Code are you using?

v1.87.2 (Universal)

What version of Tailwind CSS IntelliSense are you using?

v0.11.60 (pre-release)

What version of Tailwind CSS are you using?

v4.0.0-alpha.11

What package manager are you using?

pnpm

What operating system are you using?

macOS

Tailwind config

None - using @tailwindcss/vite@4.0.0-alpha.11 plugin.

VS Code settings

{
  "editor.defaultFormatter": "esbenp.prettier-vscode",
  "files.associations": {
    "*.css": "tailwindcss"
  },
  "typescript.format.insertSpaceAfterOpeningAndBeforeClosingNonemptyBraces": false,
  "typescript.tsdk": "node_modules\\typescript\\lib"
}

Reproduction

<div class="[&.active]:">
  <a href="/" class="active">Home</a>
  <a href="/about">About</a>
  ...
</div>

Describe your issue

The IntelliSense does not show suggestions for classes that have custom selectors using square brackets.
eg: [&.active]:, data-[active=true]:.

The hover description:

It works fine with selectors that do not have square brackets, btw.

[AugustoTI]

I'm suffering from the same obstacle

[nanxiaobei]

same issue with tailwindcss@4.0.8 & webstorm 2024.3.3

[thecrypticace]

Gonna get a release out soon with this fix 👍