refactor(Avatar): remove support for sx prop

[joshblack]

Closeshttps://github.com/github/primer/issues/5726

Changelog

New

Changed

Removed

• Remove support for sx from the Avatar component

Rollout strategy

• Major release; if selected, include a written rollout or migration plan

We are using the @primer/styled-react component to mitigate removing sx usage. We will make sure usage is updated upstream before merging.

[changeset-bot]

🦋 Changeset detected

Latest commit: 2afa27d

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

This PR includes changesets to release 2 packages

Name	Type
@primer/react	Major
@primer/styled-react	Major

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

[Copilot]

Pull Request Overview

This PR removes the sx prop support from the Avatar component as part of a major refactoring effort. The change migrates styling capabilities to the @primer/styled-react package to maintain backward compatibility while modernizing the core component.

• Removes sx prop from Avatar component interface and implementation
• Adds a styled wrapper version of Avatar to @primer/styled-react package
• Updates tests and stories to reflect the removed functionality

Reviewed Changes

Copilot reviewed 5 out of 5 changed files in this pull request and generated no comments.

Show a summary per file

File	Description
packages/styled-react/src/index.ts	Adds Avatar component with sx support via styled wrapper
packages/react/src/Avatar/Avatar.tsx	Removes sx prop support and simplifies component implementation
packages/react/src/Avatar/Avatar.test.tsx	Removes test case for sx prop functionality
packages/react/src/Avatar/Avatar.stories.tsx	Removes sx prop from Storybook controls
.changeset/seven-cameras-act.md	Documents breaking change and migration strategy

---

_{You can also share your feedback on Copilot code review for a chance to win a $100 gift card. Take the survey.}

[github-actions]

👋 Hi, this pull request contains changes to the source code that github/github depends on. If you are GitHub staff, we recommend testing these changes with github/github using the integration workflow. Thanks!

[github-actions]

size-limit report 📦

Path	Size
packages/react/dist/browser.esm.js	90.29 KB (+0.02% 🔺)
packages/react/dist/browser.umd.js	90.49 KB (+0.04% 🔺)

[joshblack]

Waiting for: https://github.com/github/github-ui/pull/2823 to merge

[primer-integration]

👋 Hi from github/github-ui! Your integration PR is ready: https://github.com/github/github-ui/pull/3350

[primer-integration]

🟢 ci completed with status success.

[francinelucca]

Will need https://github.com/github/github-ui/pull/3350/commits/f808218745a51be868b7ebece7a1861bbabcf5c2, https://github.com/github/github-ui/pull/3350/commits/dd982208c8dae40735b56c760edb742e7ee9efa2

[github-actions]

👋 Hi, there are new commits since the last successful integration test. We recommend running the integration workflow once more, unless you are sure the new changes do not affect github/github. Thanks!

[francinelucca]

https://github.com/github/github-ui/pull/3350/commits/f808218745a51be868b7ebece7a1861bbabcf5c2, https://github.com/github/github-ui/pull/3350/commits/dd982208c8dae40735b56c760edb742e7ee9efa2
needed