I'm using ReactJS and the components library called MaterialUI. I'm having an issue with the Typography component. What happens is that if I write a long text it exceed its container and doesn't g...

I'm looking at this example of Autocomplete provided by MaterialUI https://codesandbox.io/s/81qc1 I was wondering how I can display a "No options found" message if no results are found.

I have migrated MUI-4 to MUI-5 and facing this error. Any Help?

I would like to add a 'clear' button to a DatePicker from @mui/lab (5.0.0-alpha.55). What I am attempting: Store a date field in state, passed as the value prop to DatePicker Change the date to nu...

I am trying to use the Drawer component and I have noticed that when the drawer is fed the prop open={true}, there is a default dimmed overlay on the underlying page / div. Is there a best-practice...

I have created a project using vite and react. I create a theme to set my project into right to left. Everything was ok and the project was running properly. const theme = createTheme({ direction:...

I am trying to wrap a page in a React project in a Material UI container but it squeezes in all my content with these weird margins. Here is what it looks like: But I want it to look like this wit...

In the docs of Material-UI, in the section Grid: white-space: nowrap; there is an exemple of the text wrapped in codesandbox. In this exemple I replace const message ="" by a long text without spa...

I have Autocomplete where I pass an array of fetched and predefined options... https://codesandbox.io/s/geocoding-demo-forked-2f189?file=/src/App.js When I type e.g. "Diestsestraat Leuven&quot...

Using material-ui in my react app, is there a way I can change the position when the dialog is opened? now it's always centered. Thanks in advance!

In my MUI form I'm using DatePicker to select dates for departure and return of users. But when I used .toLocaleDateString() it set my dates in mm-dd-yyyy format. But I wanted to set them as dd-mm-...

I have three buttons in a Dialog like so: The JSX is <DialogActions classes={{ root: this.props.classes.dialogActionsRoot }} > <Button classes={{ root: this.props.classes.button...

I'm using DatePicker from MUI v6 (https://mui.com/x/react-date-pickers/date-picker/). And currently I've noticed that weeks in the calendar start with Sunday but I need them to start with Monday. A...

I am trying to do some pagination, which in theory is working but the colour of the outline and number are coming out black and my background is very dark so it took me a while to even realised it ...

After upgrading from @mui/material 5.5.0 to 5.6.4 my vite react-ts app doesn't run, throwing an error: styled_default is not a function by Popper.js, the popper component is being used by an autoco...

I just started using Material UI version 5. Originally to use my custom theme's styles, I would use makestyles, but it seems that does not work in v.5. My themes are on their own component, and to ...

Description I am trying to use Material-UI's theme.spacing function in a React application but the spacing function is not recognized. The Javascript error message is: TypeError: theme.spacing is n...

I have an application where a user needs to press and hold a button to record audio. However, when a user holds the button on mobile, the browser tries to select nearby text (since the user is hold...

The colour of a disabled input text field created using material UI is light grey by default and it is not very visible against a white background. Is there any way to change the font colour of a d...

I'm searching a MUI function " MaterialUIGiveMeCurrentBreakPointName" that allows me to performe an action in a component like this: const currentBreakPointName = MaterialUIGiveMeCurrentB...

I am struggling to modify button colors in Material UI (v1). How would I set the theme to behave similarly to Bootstrap, so I could just use "btn-danger" for red, "btn-success" ...

I am using Material UI in my project, and I have a Checkbox within a div with a black background. But it doesn't look good because the Checkbox is black too. How can I change the color of the Check...

I'm creating a form which has a date field. I'm using MUI and react-hook-form for validation. I've tried to render the field in two different ways, but when submitting my form I'm not getting the e...

I would like to extend the props of the Button component from Material-UI using typescript to be able pass additional props to it's children. import { NavLink } from 'react-router-dom'; import { B...

I am trying to change the border of a select component from Material-UI. So far I've tried: const styles = theme => ({ root: { display: "flex", flexWrap: "wrap", backgroundColor: "lightgrey...