Add leadingVisual to InlineMessage

[liuliu-dev]

Closes #6044

Changelog

Add leadingVisual to InlineMessage.

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: 07f5eee

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.

[Copilot]

Pull request overview

This pull request adds a new leadingVisual prop to the InlineMessage component, allowing users to provide custom icons or visual elements instead of the default variant-based icons. This enhances the component's flexibility and aligns with similar patterns used in other Primer React components like TextInput and ActionList.Item.

Key changes:

• Added leadingVisual prop that accepts React.ElementType | React.ReactNode
• Implementation uses isValidElementType to determine whether to render as a component or node
• Added comprehensive tests for various component types (icon, memo, forwardRef)
• Updated Storybook playground with a selector for different icon options

Reviewed changes

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

File	Description
packages/react/src/InlineMessage/InlineMessage.tsx	Added leadingVisual prop type definition and implementation logic to conditionally render custom visual or default icon
packages/react/src/InlineMessage/InlineMessage.test.tsx	Added tests for custom leading visual with different React component types and default icon behavior
packages/react/src/InlineMessage/InlineMessage.stories.tsx	Updated Playground story with icon selector control to demonstrate custom leadingVisual options
.changeset/giant-loops-send.md	Added changeset for minor version bump documenting the new feature

[primer-integration]

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

[primer-integration]

🟢 ci completed with status success.

[llastflowers]

looks great! 🚀