[ButtonBase] Add focusableWhenDisabled prop

[siriwatknp]

closes #33182

Sandbox: https://stackblitz.com/edit/o5kyiyjo?file=src%2FDemo.tsx

Problem

The documented way to use Tooltip with a disabled element wraps it in a <span>:

<Tooltip title="Delete">
  <span>
    <IconButton disabled><DeleteIcon /></IconButton>
  </span>
</Tooltip>

Tooltip injects the accessible name onto the outermost cloned child — the span, not the button. This:

• puts an aria-label on a span (Axe/Lighthouse warn — a span has no nameable role),
• leaves the real <button> with no accessible name,
• and the usual workaround (duplicating aria-label on the button) produces two elements with the same name, which breaks getByLabelText and risks double announcement.

The wrapper is only needed because a disabled element doesn't fire the events Tooltip listens to — and ButtonBase additionally sets pointer-events: none on .Mui-disabled.

Solution

Make focusableWhenDisabled a public prop on ButtonBase (inherited by Button and IconButton). When set on a disabled element, it uses aria-disabled instead of the native disabled attribute and keeps pointer-events, so the element stays focusable and keeps firing events while remaining inert.

Tooltip then attaches directly to the element — works on hover and keyboard focus, and the accessible name lands on the element itself, no wrapper:

<Tooltip title="Delete">
  <IconButton aria-label="Delete" disabled focusableWhenDisabled>
    <DeleteIcon />
  </IconButton>
</Tooltip>

Changes

• ButtonBase: expose focusableWhenDisabled publicly (type + propType) and forward it to useButtonBase — it was previously destructured but never passed, so the disabled→aria-disabled swap was dead code for component consumers.
• ButtonBase: move .Mui-disabled { pointer-events: none } into a variant gated on !focusableWhenDisabled, so a focusable-disabled element still receives hover events.
• Docs: rewrite the Tooltip "Disabled elements" section to recommend focusableWhenDisabled; keep the span approach as the documented fallback for native / non-ButtonBase elements.

When focusableWhenDisabled is falsy, ButtonBase and useButtonBase behave exactly as before — only opt-in usage changes.

[code-infra-dashboard]

Deploy preview

• docs/data/material/components/tooltips/tooltips.md

Bundle size

Bundle	Parsed size	Gzip size
@mui/material	🔺+144B(+0.03%)	🔺+21B(+0.01%)
@mui/lab	0B(0.00%)	0B(0.00%)
@mui/private-theming	0B(0.00%)	0B(0.00%)
@mui/system	0B(0.00%)	0B(0.00%)
@mui/utils	0B(0.00%)	0B(0.00%)

Details of bundle changes

---

Check out the code infra dashboard for more information about this PR.

[siriwatknp]

@mj12albert Is this the plan when you added the nativeButton prop in #48680?

[mj12albert]

@siriwatknp I already have a PR open #48613 😬