[Bug]: Limited to only using "span" in MessageBarTitle

[k-ebanks]

Component

MessageBar

Package version

^9.55.0

React version

^18.2.0

Environment

OS: Linux 6.5 Ubuntu 22.04.5 LTS 22.04.5 LTS (Jammy Jellyfish)
CPU: (16) x64 AMD EPYC 7763 64-Core Processor
Memory: 53.76 GB / 62.78 GB
Container: Yes
Shell: 5.1.16 - /bin/bash

Current Behavior

The MessageBarTitle can only be displayed as a , other components allow me to customise the tag. Additionally, there is an "as" field on it that only accepts "span", or undefined (which then just defaults to span), this is misleading.

Expected Behavior

MessageBarTitle should allow us to display as different html tags. Other components give us a choice of may different values (h1, h2, h3, p, etc). However, for this component we are limited to span. I would like to use different values to be consistent with the rest of my app.

Reproduction

Repro provided below

Steps to reproduce

1. Create a component
2. Try to set the "as" value to anything other than span
3. Observe a type error

Are you reporting an Accessibility issue?

None

Suggested severity

High - No workaround

Products/sites affected

No response

Are you willing to submit a PR to fix?

no

Validations

• [x] Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• [x] The provided reproduction is a minimal reproducible example of the bug.

[spmonahan]

This can be handled by entirely replacing slots.

Here's an example with MessageBarTitle: https://stackblitz.com/edit/zyktgd?file=src%2Fexample.tsx

Note that caveats apply when replacing the entire slot 🙂

If you replace the entire slot, verify accessibility, layout, and styling still work properly.