diff --git a/packages/ra-ui-materialui/src/detail/Create.stories.tsx b/packages/ra-ui-materialui/src/detail/Create.stories.tsx index e725efdf7fa..6285d68b774 100644 --- a/packages/ra-ui-materialui/src/detail/Create.stories.tsx +++ b/packages/ra-ui-materialui/src/detail/Create.stories.tsx @@ -283,6 +283,13 @@ export const Themed = () => ( defaultProps: { className: 'custom-class', }, + styleOverrides: { + root: { + ['& .RaCreate-card']: { + color: 'red', + }, + }, + }, }, }, } as ThemeOptions)} diff --git a/packages/ra-ui-materialui/src/detail/CreateView.tsx b/packages/ra-ui-materialui/src/detail/CreateView.tsx index c8adbe49f15..d0ca5b126b1 100644 --- a/packages/ra-ui-materialui/src/detail/CreateView.tsx +++ b/packages/ra-ui-materialui/src/detail/CreateView.tsx @@ -6,7 +6,6 @@ import { styled, type SxProps, type Theme, - useThemeProps, } from '@mui/material'; import { useCreateContext } from 'ra-core'; import clsx from 'clsx'; @@ -14,11 +13,7 @@ import clsx from 'clsx'; import { Title } from '../layout'; import { CreateProps } from './Create'; -export const CreateView = (inProps: CreateViewProps) => { - const props = useThemeProps({ - props: inProps, - name: PREFIX, - }); +export const CreateView = (props: CreateViewProps) => { const { actions, aside, diff --git a/packages/ra-ui-materialui/src/detail/Edit.stories.tsx b/packages/ra-ui-materialui/src/detail/Edit.stories.tsx index 3ff2c151d0a..7b891b6d3b4 100644 --- a/packages/ra-ui-materialui/src/detail/Edit.stories.tsx +++ b/packages/ra-ui-materialui/src/detail/Edit.stories.tsx @@ -375,6 +375,13 @@ export const Themed = () => ( defaultProps: { className: 'custom-class', }, + styleOverrides: { + root: { + ['& .RaEdit-card']: { + color: 'red', + }, + }, + }, }, }, } as ThemeOptions)} diff --git a/packages/ra-ui-materialui/src/detail/EditView.tsx b/packages/ra-ui-materialui/src/detail/EditView.tsx index 67d8b7dd314..26cbbae0eec 100644 --- a/packages/ra-ui-materialui/src/detail/EditView.tsx +++ b/packages/ra-ui-materialui/src/detail/EditView.tsx @@ -7,7 +7,6 @@ import { styled, type SxProps, type Theme, - useThemeProps, } from '@mui/material'; import clsx from 'clsx'; import { useEditContext, useResourceDefinition } from 'ra-core'; @@ -18,11 +17,7 @@ import { EditProps } from './Edit'; const defaultActions = ; -export const EditView = (inProps: EditViewProps) => { - const props = useThemeProps({ - props: inProps, - name: PREFIX, - }); +export const EditView = (props: EditViewProps) => { const { actions, aside, diff --git a/packages/ra-ui-materialui/src/detail/Show.stories.tsx b/packages/ra-ui-materialui/src/detail/Show.stories.tsx index bf9d9b166ec..46a545f3a74 100644 --- a/packages/ra-ui-materialui/src/detail/Show.stories.tsx +++ b/packages/ra-ui-materialui/src/detail/Show.stories.tsx @@ -258,6 +258,13 @@ export const Themed = () => ( defaultProps: { className: 'custom-class', }, + styleOverrides: { + root: { + ['& .RaShow-card']: { + color: 'red', + }, + }, + }, }, }, } as ThemeOptions)} diff --git a/packages/ra-ui-materialui/src/detail/ShowView.tsx b/packages/ra-ui-materialui/src/detail/ShowView.tsx index 4fb840a8019..844f6a1e7cc 100644 --- a/packages/ra-ui-materialui/src/detail/ShowView.tsx +++ b/packages/ra-ui-materialui/src/detail/ShowView.tsx @@ -6,7 +6,6 @@ import { styled, type SxProps, type Theme, - useThemeProps, } from '@mui/material'; import clsx from 'clsx'; import { useShowContext, useResourceDefinition } from 'ra-core'; @@ -16,11 +15,7 @@ import { ShowProps } from './Show'; const defaultActions = ; -export const ShowView = (inProps: ShowViewProps) => { - const props = useThemeProps({ - props: inProps, - name: PREFIX, - }); +export const ShowView = (props: ShowViewProps) => { const { actions, aside, diff --git a/packages/ra-ui-materialui/src/list/InfiniteList.spec.tsx b/packages/ra-ui-materialui/src/list/InfiniteList.spec.tsx index 9fecc9facf5..acece3dd609 100644 --- a/packages/ra-ui-materialui/src/list/InfiniteList.spec.tsx +++ b/packages/ra-ui-materialui/src/list/InfiniteList.spec.tsx @@ -2,7 +2,7 @@ import * as React from 'react'; import expect from 'expect'; import { render, screen } from '@testing-library/react'; -import { Themed } from './List.stories'; +import { Themed } from './InfiniteList.stories'; describe('', () => { it('should be customized by a theme', async () => { diff --git a/packages/ra-ui-materialui/src/list/InfiniteList.stories.tsx b/packages/ra-ui-materialui/src/list/InfiniteList.stories.tsx index 0be4e22c6a5..cb56af6510f 100644 --- a/packages/ra-ui-materialui/src/list/InfiniteList.stories.tsx +++ b/packages/ra-ui-materialui/src/list/InfiniteList.stories.tsx @@ -452,6 +452,18 @@ export const Themed = () => ( perPage: 5, }, }, + RaList: { + styleOverrides: { + root: { + background: 'pink', + + ['& .MuiListItemText-primary']: { + color: 'hotpink', + fontWeight: 'bold', + }, + }, + }, + }, }, } as ThemeOptions)} > diff --git a/packages/ra-ui-materialui/src/list/ListView.tsx b/packages/ra-ui-materialui/src/list/ListView.tsx index 1838795287d..e6cd323b79f 100644 --- a/packages/ra-ui-materialui/src/list/ListView.tsx +++ b/packages/ra-ui-materialui/src/list/ListView.tsx @@ -4,7 +4,6 @@ import { styled, type SxProps, type Theme, - useThemeProps, } from '@mui/material/styles'; import type { ReactElement, ReactNode, ElementType } from 'react'; import Card from '@mui/material/Card'; @@ -24,12 +23,8 @@ const defaultEmpty = ; const DefaultComponent = Card; export const ListView = ( - inProps: ListViewProps + props: ListViewProps ) => { - const props = useThemeProps({ - props: inProps, - name: PREFIX, - }); const { actions = defaultActions, aside,