fix(mui): render Breadcrumb links as MUI Link so styling applies

[adem-loghmari]

PR Checklist

• The commit message follows our guidelines
• Related issue(s) linked
• Tests for the changes have been added
• Docs have been added / updated (not needed, no public API change)
• Changesets have been added

What is the current behavior?

In @refinedev/mui's Breadcrumb, the internal LinkRouter helper is typed to accept MUI LinkProps (sx, underline, color, variant) but renders them onto a bare native <span>:

const LinkRouter = (props: LinkProps & { to?: string }) => {
  const { to, children, ...restProps } = props;
  return (
    <Link to={to || ""}>
      <span {...restProps}>{children}</span>
    </Link>
  );
};

Because <span> is a plain DOM element, none of the MUI styling props do anything, they just get dumped onto the node as invalid HTML attributes. Visible impact: breadcrumb links aren't flex-aligned with their icons, get no hover underline, don't inherit color, and don't get the intended typography size.

This is a regression from the v5 migration (#6945), commit 5d63adac08. Before that, LinkRouter rendered MUI's actual Link. When the legacy-router plumbing was removed in favor of useLink(), the component was rewritten to wrap a <span> but the props were never re-wired to a MUI component. The file still carried an unused import { Link as MuiLink } from "@mui/material" from that incomplete change.

fixes #7462

What is the new behavior?

LinkRouter now renders a real MUI Link, using the router's link component as the underlying element:

<MuiLink component={Link} to={to || ""} {...restProps}>
  {children}
</MuiLink>

This matches the existing pattern used by refine's MUI buttons (component={LinkComponent}), so the styling props (sx, underline, color, variant) are consumed by MUI while client-side routing through to is preserved. The previously-dead MuiLink import is now used.

Notes for reviewers

The shared breadcrumbTests suite (packages/ui-tests) only checks structure (text, href, icon), so this slipped through untested. I added a MUI-specific test in packages/mui/src/components/breadcrumb/index.spec.tsx asserting the rendered link carries the MuiLink-root class and that no styling props leak into the DOM. Verified the test fails on the old <span> implementation and passes with the fix.

[changeset-bot]

🦋 Changeset detected

Latest commit: 95c3efb

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package

Name	Type
@refinedev/mui	Patch

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

[stale]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

[adem-loghmari]

Not stale. Rebased onto the latest main (clean, no conflicts) and re-ran the package suite: all 8 tests in packages/mui/src/components/breadcrumb pass, including the styling test added here.

The bug is still reproducible on current main: LinkRouter still spreads the MUI Link props onto a plain <span>, so sx, underline, color and variant are silently dropped on every breadcrumb link. The MuiLink import on line 12 is still unused, which is the clearest sign this was an accident in the v5 migration (5d63ada) rather than intent.

Happy to rebase again or split the test out if that helps review. Closes #7462.