Banner: Fix types to restrict leadingVisual to variants info and upsell

[siddharthkp]

• Blocked on https://github.com/github/github-ui/pull/27576

Summary

The leadingVisual and deprecated icon props on Banner are only rendered when variant is info or upsell. For every other variant (critical, success, warning), the Banner ignores a custom visual and always renders its built-in variant icon.

Until now the types allowed leadingVisual/icon to be passed alongside any variant, so this compiled even though it does nothing at runtime:

<Banner variant="critical" leadingVisual={<SomeIcon />} title="Critical" />

This PR narrows BannerProps into a discriminated union so custom visuals are only accepted for the variants that actually render them. The type surface now matches the runtime behavior.

Rollout strategy

• Patch release (debatable but this is a type-only narrowing; runtime behavior is unchanged)
• Minor release
• Major release; if selected, include a written rollout or migration plan
• None; if selected, include a brief description as to why

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

[changeset-bot]

🦋 Changeset detected

Latest commit: df7bea5

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/mcp	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. If this doesn't work, you can also use the original workflow here. 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

This PR aligns @primer/react’s Banner TypeScript API with its existing runtime behavior by restricting custom visuals (leadingVisual and deprecated icon) to the info and upsell variants.

Changes:

• Refactored BannerProps into a discriminated union so leadingVisual/icon are only accepted for info/upsell.
• Updated unit tests and Storybook/Figma examples to comply with the new type restrictions (including @ts-expect-error cases to validate runtime fallback).
• Added a changeset documenting the breaking type change.

Show a summary per file

File	Description
packages/react/src/Banner/Banner.tsx	Converts BannerProps to a discriminated union restricting custom visuals to info/upsell.
packages/react/src/Banner/Banner.test.tsx	Adds @ts-expect-error coverage for disallowed prop combinations while asserting runtime fallback behavior.
packages/react/src/Banner/Banner.stories.tsx	Adjusts Playground rendering to only pass leadingVisual for info/upsell to satisfy the new types.
packages/react/src/Banner/Banner.figma.tsx	Updates Figma code-connect example to conditionally pass icon only for supported variants.
.changeset/banner-leading-visual-types.md	Adds a changeset for the type-surface change (currently marked as major).

Review details

• Files reviewed: 5/5 changed files
• Comments generated: 1
• Review effort level: Low

[primer-integration]

Integration test results from github/github-ui PR:

  CI Failed
  VRT Running
  Projects Waiting

CI check runs linting, type checking, and unit tests. Check the workflow logs for specific failures.

Need help? If you believe this failure is unrelated to your changes, please reach out to the Primer team for assistance.