[List] Remove background inheritance of ListSubheader

[tanmoyopenroot]

• Add check for breakpoint use sticky background from paper
• Filter out onClick

• I have followed (at least) the PR section of the contributing guide.

Related to #18200

[mui-pr-bot]

Details of bundle changes

Generated by 🚫 dangerJS against 65ee439

[oliviertassinari]

I have reduced the scope of the changes. Here, the objective is now to remove the background inheritance color approach to the dedicated background color. This is what we do with the Autocomplete component. It simplifies one of our demos and fixes an issue with the Select. IMHO, these are signals that the new approach performs better.

[oliviertassinari]

Regarding the onclick event of #18200. The proposed fix looked completely wrong, leaking outside of the scope (this is a select issue, not a list subheader issue). I have reverted it.

[tanmoyopenroot]

Regarding the onclick event of #18200. The proposed fix looked completely wrong, leaking outside of the scope (this is a select issue, not a list subheader issue). I have reverted it.

Ok, How about this way?
In SelectInput component (line), If value prop is undefined the we won't pass the onClick prop

[oliviertassinari]

@tanmoyopenroot This path seems to have potential.

I would like to raise that #18200 is related to #14943. It's in the same order of how to handle composability well.

There is something else that caught my attention. The keyboard logic is already able to differentiate valid option from wrong ones. We should be able to leverage it. This rely on tabIndex={-1} coming from the MenuItem.
So, the alternative is, in the click event handler, skip it of the event.currentTarget doesn't have a tab index attribute.

[tanmoyopenroot]

@tanmoyopenroot This path seems to have potential.

I would like to raise that #18200 is related to #14943. It's in the same order of how to handle composability well.

There is something else that caught my attention. The keyboard logic is already able to differentiate valid option from wrong ones. We should be able to leverage it. This rely on tabIndex={-1} coming from the MenuItem.
So, the alternative is, in the click event handler, skip it of the event.currentTarget doesn't have a tab index attribute.

Will try to fix this