feat: add CSS Layer support to Avatar

[joshblack]

Part of https://github.com/github/primer/issues/6275

Adds the initial CSS layer migration test setup and migrates Avatar styles into a named Primer component layer.

Changelog

New

• Adds CSS layer coverage for migrated runtime CSS modules.
• Adds Avatar to the CSS layer migration set.

Changed

• Wraps Avatar CSS module styles in @layer primer.components.Avatar.

Removed

• None

Rollout strategy

• Patch release
• Minor release
• Major release; if selected, include a written rollout or migration plan
• None; if selected, include a brief description as to why

Testing & Reviewing

• Run cd packages/react && npx vitest run src/__tests__/css-layers.test.ts --config vitest.config.mts.
• Review this PR as part of the CSS layers stack; this entry covers Avatar.

Merge checklist

• Added/updated tests
• Added/updated documentation
• Added/updated previews (Storybook)
• Changes are SSR compatible
• Tested in Chrome
• Tested in Firefox
• Tested in Safari
• Tested in Edge
• (GitHub staff only) Integration tests pass at github/github-ui (Learn more about how to run integration tests)

[changeset-bot]

🦋 Changeset detected

Latest commit: 11a730c

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package

Name	Type
@primer/react	Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[github-actions]

⚠️ Action required

👋 Hi, this pull request contains changes to the source code that github/github-ui depends on. If you are GitHub staff, test these changes with github/github-ui using the integration workflow. Check the integration testing docs for step-by-step instructions. Or, apply the integration-tests: skipped manually label to skip these checks.

To publish a canary release for integration testing, apply the Canary Release label to this PR.

[Copilot]

Pull request overview

Adds initial automated coverage for CSS layer migrations and migrates Avatar’s CSS Module into a named Primer component layer to improve style override behavior and ensure consistent layering as more components migrate.

Changes:

• Added a new css-layers.test.ts and wired it into Vitest so CSS layer migrations can be validated in CI.
• Wrapped Avatar.module.css rules in @layer primer.components.Avatar.
• Added css-tree (+ typings) as a dev dependency to parse CSS for the new test.

Show a summary per file

File	Description
packages/react/vitest.config.mts	Includes the new CSS layers test in the node Vitest run.
packages/react/vitest.config.browser.mts	Excludes the CSS layers test from browser-mode Vitest runs.
packages/react/src/Avatar/Avatar.module.css	Wraps Avatar styles in a named @layer for cascade layer migration.
packages/react/src/__tests__/css-layers.test.ts	New test to enforce presence/naming of CSS layers for allowlisted CSS Modules.
packages/react/package.json	Adds css-tree and @types/css-tree for parsing CSS in tests.
package-lock.json	Lockfile updates for the new dependencies.
.changeset/avatar-css-layer.md	Patch changeset describing the Avatar override behavior improvement.

Copilot's findings

• Files reviewed: 6/7 changed files
• Comments generated: 3