Fix <Link> cannot be styled through MUI theme

Fixes #10904

Author: djhi

packages/ra-ui-materialui/src/Link.stories.tsx

@@ -0,0 +1,53 @@
+import * as React from 'react';
+import { Paper, Stack } from '@mui/material';
+import { AdminContext } from './AdminContext';
+import { Link, LinkProps } from './Link';
+import { defaultDarkTheme, defaultLightTheme } from './theme';
+
+export default { title: 'ra-ui-materialui/Link' };
+
+export const Basic = ({
+    theme,
+    value,
+    ...props
+}: Partial<LinkProps> & { theme?: string; value?: string }) => {
+    return (
+        <AdminContext
+            theme={
+                theme === 'light'
+                    ? defaultLightTheme
+                    : theme === 'dark'
+                      ? defaultDarkTheme
+                      : {
+                            components: {
+                                RaLink: {
+                                    styleOverrides: {
+                                        root: {
+                                            color: 'purple',
+                                        },
+                                    },
+                                },
+                            },
+                        }
+            }
+        >
+            <Paper sx={{ p: 2 }}>
+                <Stack direction="row">
+                    <Link to="/" {...props}>
+                        Test
+                    </Link>
+                </Stack>
+            </Paper>
+        </AdminContext>
+    );
+};
+
+Basic.argTypes = {
+    theme: {
+        options: ['light', 'dark', 'custom'],
+        control: { type: 'select' },
+    },
+};
+Basic.args = {
+    theme: 'light',
+};

packages/ra-ui-materialui/src/Link.tsx

@@ -37,10 +37,10 @@ export const LinkClasses = {
     link: `${PREFIX}-link`,
 };
 
-const StyledMuiLink = styled(MuiLink)({
+const StyledMuiLink = styled(MuiLink, {
     name: PREFIX,
     overridesResolver: (props, styles) => styles.root,
-}) as typeof MuiLink; // @see https://mui.com/material-ui/guides/typescript/#complications-with-the-component-prop
+})({}) as typeof MuiLink; // @see https://mui.com/material-ui/guides/typescript/#complications-with-the-component-prop
 
 // @see https://mui.com/material-ui/guides/composition/#with-typescript
 export interface LinkProps
@@ -50,19 +50,19 @@ export interface LinkProps
 
 declare module '@mui/material/styles' {
     interface ComponentNameToClassKey {
-        RaLink: 'root' | 'link';
+        [PREFIX]: 'root' | 'link';
     }
 
     interface ComponentsPropsList {
-        RaLink: Partial<LinkProps>;
+        [PREFIX]: Partial<LinkProps>;
     }
 
     interface Components {
         RaLink?: {
-            defaultProps?: ComponentsPropsList['RaLink'];
+            defaultProps?: ComponentsPropsList[typeof PREFIX];
             styleOverrides?: ComponentsOverrides<
                 Omit<Theme, 'components'>
-            >['RaLink'];
+            >[typeof PREFIX];
         };
     }
 }