mi6
Provide a heading slot on the ic-step component
Summary
Raised on behalf of a customer
Provide a heading slot on ic-steps so that customers can replace the heading with any content they want (e.g. they could display an H2 or H3 etc. element if they need to)
💬 Description
This was mentioned in an accessibility review carried out on a customer's app; the heading on ic-steps appears to be a heading visually but screen reader users don't hear that it's a heading (as it's not an <h2> / <h3> etc. element), so the experience isn't the same.
Check the slot displays correctly when the ic-stepper is both on a large screen size or small (i.e. a compact stepper). Also check the styling is correct when the ic-step is disabled (plus any other possible states).
💰 User value
Providing a slot for the heading would allow customers to render the ic-step heading as an actual HTML heading element if they need to for accessibility purposes.
🚨 Urgency (low, medium or high)
For the customer, this is medium urgency; they need it to be sorted by 10th February at the very latest. But it should ideally be completed a while before then so the customer has time for testing etc.
One question might be whether we should change the ic-step to use a heading element (e.g. <h4>) by default.
It feels to me personally like it shouldn't default to being a heading element because it isn't a typical heading, i.e. it's not introducing a section on a page. You would have a heading elsewhere on the page for this (like can be seen in the screenshots in our guidance, e.g. it says "Take coffee order" as well as the heading on the stepper).
But I think it's fine to add a slot like what is mentioned on this ticket in case people think it is necessary for their app's layout.
It would also be a breaking change if we make it default to a certain heading element.
This would be resolved by #4060 but I wanted to create a separate ticket so that we could record that it's required by a customer and has medium urgency.
At triage we decided that using an <h4> in stepper headings would be undesirable. The thinking being that headings are the start of blocks of content and the stepper is more of a list.
Update from the customer: instead of slotting in an H element, they just want to change the styling of stepper headings
In particular, they want to style compact stepper headings to use subtitle-large styling - matching the normal / non-compact stepper - rather than H4 styling. This is so the compact stepper headings don't look like actual headings (i.e. H4 elements).
This doesn't really change the ticket much as I think they will still need to use a slot to be able to add their own styling. Thought to make a note anyway