feat(Header): remove support for sx prop

[joshblack]

Closes#6763

Changelog

New

Changed

Removed

• Remove support for sx from the Header component

Rollout strategy

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

This component has no sx usage in github-ui and can be rolled out. We also introduced this component to @primer/styled-react to help out with usage outside of github-ui

[changeset-bot]

🦋 Changeset detected

Latest commit: f810e3b

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 support for the sx prop from the Header component as part of a major version release, migrating from styled-components to CSS modules for styling.

• Removes sx prop support from Header, Header.Item, and Header.Link components
• Replaces BoxWithFallback with native HTML elements and direct component rendering
• Migrates Storybook examples from sx props to CSS modules for styling

Reviewed Changes

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

Show a summary per file

File	Description
packages/react/src/Header/Header.tsx	Removes sx prop types and BoxWithFallback usage, implements direct element rendering
packages/react/src/Header/Header.stories.tsx	Migrates sx props to CSS modules in default and playground stories
packages/react/src/Header/Header.stories.module.css	Adds CSS classes to replace sx styling in stories
packages/react/src/Header/Header.features.stories.tsx	Updates feature stories to use CSS modules instead of sx props
packages/react/src/Header/Header.features.stories.module.css	Provides CSS classes for feature story styling
packages/react/src/Header/Header.docs.json	Removes sx prop documentation from component and subcomponents
packages/react/src/Header/Header.dev.stories.tsx	Removes sx-based dev stories, keeps CSS-only examples
packages/styled-react/src/index.tsx	Adds sx-enabled Header wrapper for backward compatibility in styled-react package
.changeset/twelve-sloths-flow.md	Documents the breaking change for version release

[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	88.68 KB (+0.05% 🔺)
packages/react/dist/browser.umd.js	88.7 KB (-0.04% 🔽)

[primer-integration]

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

[primer-integration]

🟢 ci completed with status success.

[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!

[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!

[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!