How to override the TextInput from React-Admin

Solution 1:

As explained in the docs, className only allows to override the style of the root component. To override the inner styles, you must use the classes prop:

const useStyles = makeStyles({
    MuiInputBase: {
        root: {
            width: "800px"
        }
    }
});

const MyInput = () => {
   const classes = useStyles();
   return <TextInput classes={classes} variant="outlined" label="Search" source="search" alwaysOn />;
};

More details at https://marmelab.com/react-admin/Theming.html#overriding-a-component-style