refactor: remove support for styled-components from Primer

[joshblack]

Closes #

This pull request removes support for the deprecated Box component and the sx prop from the main @primer/react package, along with all related dependencies and code. These features have been migrated to the new @primer/styled-react package, which now contains all styled-system and styled-components functionality. This change streamlines the main package, eliminates legacy styling APIs, and ensures that styled-system features are only available in the dedicated package.

Migration of styled-system and styled-components functionality to @primer/styled-react:

• All dependencies, devDependencies, and peerDependencies related to styled-system, styled-components, and their Babel plugins/types have been removed from packages/react/package.json, and added to packages/styled-react/package.json. [1] [2] [3] [4] [5] [6] [7] [8]
• Babel and Rollup configuration for styled-components has been removed from packages/react/babel.config.js and added to packages/styled-react/rollup.config.js. [1] [2]
• The Box component and all related exports, types, and stories have been removed from @primer/react and added to @primer/styled-react. This includes removal from src/index.ts, deletion of Box.docs.json, Box.stories.tsx, Box.features.stories.tsx, and internal fallback logic. [1] [2] [3] [4] [5] [6] [7] [8] [9] [10]
• The sx utility and its types have been removed from @primer/react and added to @primer/styled-react. [1] [2] [3] [4] [5]

Build and script changes:

• The color scheme precompilation script has been moved from @primer/react to @primer/styled-react, and related build scripts have been updated accordingly. [1] [2] [3] [4] [5]

Cleanup of deprecated documentation and stories:

• Deprecated documentation and stories for the Box component have been removed from the main package. [1] [2] [3]

Export changes:

• All exports related to Box, sx, and their types have been removed from @primer/react and added to @primer/styled-react. [1] [2] [3] [4] [5] [6]

This migration fully separates styled-system and styled-components usage into the new @primer/styled-react package, simplifying the main package and making future maintenance easier.

Changelog

New

Changed

Removed

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

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 (Learn more about how to run integration tests)

[changeset-bot]

⚠️ No Changeset found

Latest commit: 4db4869

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

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