Banner: Deprecate icon prop in favor of leadingVisual, fix SecondaryAction styling and playground story

[liuliu-dev]

Closes #5286

This PR deprecates the icon prop in the Banner component in favor of leadingVisual. It also fixes the SecondaryAction styling and improves the Storybook Playground selecting leadingVisual.

Changelog

1. Deprecate icon prop and add leadingVisual instead
2. BannerSecondaryAction uses variant="invisible" instead of variant="link"
3. Fixed Storybook Playground control for leadingVisual

Rollout strategy

• Minor release

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]

🦋 Changeset detected

Latest commit: 36b160e

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	Minor

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]

👋 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. Or, apply the integration-tests: skipped manually label to skip these checks.

[primer-integration]

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

[github-actions]

👋 Hi, there are new commits since the last successful integration test. If you are GitHub staff, test these changes with github/github-ui using the integration workflow. Or, apply the integration-tests: skipped manually label to skip these checks.

[primer-integration]

🟢 ci completed with status success.

[github-actions]

👋 Hi, there are new commits since the last successful integration test. If you are GitHub staff, test these changes with github/github-ui using the integration workflow. Or, apply the integration-tests: skipped manually label to skip these checks.

[Copilot]

Pull Request Overview

This PR deprecates the icon prop in the Banner component in favor of leadingVisual to align with naming conventions across Primer React. It also updates the BannerSecondaryAction to use variant="invisible" instead of variant="link" and improves the Storybook Playground story.

Key Changes

• Deprecated icon prop with @deprecated JSDoc annotation and added new leadingVisual prop
• Changed BannerSecondaryAction from variant="link" to variant="invisible"
• Added comprehensive test coverage for the new leadingVisual prop and fallback behavior

Reviewed Changes

Copilot reviewed 6 out of 108 changed files in this pull request and generated 2 comments.

Show a summary per file

File	Description
packages/react/src/Banner/Banner.tsx	Deprecated icon prop, added leadingVisual prop, updated SecondaryAction button variant, and implemented fallback logic
packages/react/src/Banner/Banner.test.tsx	Added tests for leadingVisual prop support and precedence over deprecated icon prop
packages/react/src/Banner/Banner.stories.tsx	Updated Playground story to support leadingVisual selection with icon mapping
packages/react/src/Banner/Banner.features.stories.tsx	Updated CustomIcon story to use leadingVisual instead of deprecated icon
packages/react/src/Banner/Banner.docs.json	Updated documentation metadata to mark icon as deprecated and add leadingVisual
.playwright/snapshots/components/Banner.test.ts-snapshots/*.png	Updated visual regression test snapshots reflecting the SecondaryAction styling changes
.changeset/open-mails-prove.md	Added changeset documenting the deprecation and styling fix