Expand Class Name Selection

Adds useful inner-to-outer selection ranges for utility class names to VS Code's existing Expand Selection and Shrink Selection hierarchy.

Place the cursor anywhere inside a class. Repeatedly run Expand Selection to move outward through the meaningful pieces of that class:

<div className="dark:hover:bg-(--brand)" />
                  │
                  ▼
--brand
→ bg-(--brand)
→ hover:bg-(--brand)
→ dark:hover:bg-(--brand)
→ the complete class token
→ larger syntax ranges

This improves the default VS Code behavior by exposing the nested structure inside a class token before jumping to the whole class string.

What expands

The provider builds the smallest useful range first, then expands outward.

• Tailwind variants: gray-50 → bg-gray-50 → hover:bg-gray-50
• Arbitrary values: 16px → h-[16px]
• CSS-variable shorthand: --space-xs → gap-(--space-xs)
• Nested variants: bg-gray-50 → hover:bg-gray-50 → dark:hover:bg-gray-50

For a normal class list, the final contributed range is the complete class token. VS Code then continues with its usual syntax-level ranges.

Supported attributes

• class
• className

Double-quoted, single-quoted, and template-literal values are supported.

Class functions

Strings nested in these function calls are supported by default:

• cn
• clsx
• cva
• classNames
• twMerge

Add or replace function names with the expandClassNameSelection.classFunctions setting:

{
  "expandClassNameSelection.classFunctions": ["cn", "styles"]
}

Supported language modes

All language modes are supported. The provider contributes a range only when the cursor is in a quoted class or className value, or in a configured class-function string.

The extension contributes selection ranges only. It does not add commands or keybindings.

Releasing

Releases are automated by .github/workflows/release.yml. The workflow tests and packages the extension, publishes it to the VS Code Marketplace, then creates a GitHub release containing the VSIX.

One-time setup:

1. Create the brumm publisher in the Visual Studio Marketplace publisher portal, or replace publisher in package.json with your existing publisher ID.
2. Create an Azure DevOps PAT with All accessible organizations and only the Marketplace (Manage) scope.
3. In the GitHub repository, create an environment named marketplace and add the PAT as an environment secret named VSCE_PAT.

To release, update version in package.json and CHANGELOG.md, commit the changes, then push a matching tag:

git tag v0.0.2
git push origin v0.0.2

The tag must exactly equal v plus the package version. Global Azure DevOps PATs retire on December 1, 2026; migrate this workflow to VS Marketplace trusted publishing as soon as stable vsce supports GitHub OIDC.