I’m using the Dialog and Select components from Material-UI and React. Just an example: After clicking on the select, i’m getting this error from Modal.js: “Uncaught RangeError: Maximum call stack size exceeded. at HTMLDocument.Modal._this.enforceFocus (Modal.js?86a5:197)” Any ideas? Answer Add the prop disableEnforceFocus to the Dialog component. Reference: issues/10341
Tag: material-ui
Close Persistent MUI Drawer on clicking outside
I am trying to use Drawer component in MUI React. I want that state inside the Drawer component should not lost on closing of Drawer component, hence I’m passing variant=”persistent” in Drawer component. Now, the problem is that the Persistent Drawer does not provide backdrop functionality by default unlike temporary drawers hence I’m unable to close it on outside click.
trying to remove padding from the ul tag of the popup
when I click chip chipName=”button test IPA” a popup opens. I am trying to remove padding from the ul tag of that popup. but the problem is I am not able to find the ul tag in my html of jsx. I gave className in the react code but still I am not able to target can you please help
How to make a Material UI react Button act as a react-router-dom Link?
How can I make a Material UI react Button component act as a Link component from react-router-dom without losing it’s original style? Like changing the route on click. To something like this, but maintaining the original Button style: Answer Okay, this is very easy, I don’t know why it was not working with me: Just do like this: You can
How to change MUI Radio button checked color?
The color prop can only take three values (default, primary, secondary) but what if I want my radio to be green for example ? So I tried overriding with classes prop like so : And then inside the component : But this is not working. Answer Found a solution : And inside the component: You must add the root key.
Material-ui drawer width issue
I’m facing an issue with material-ui drawer. I’ve changed the width of the drawer container which causes a a problem . The drawer remains a little inside the page and visible but I don’t want to make it visible on the page while I haven’t clicked the button. It might be having an issue with the transform attribute now. So
MUI – How to animate Card depth on hover?
I want to animate the depth of the whole Card when the mouse is over it. I try this (so-so I’m new in React) but I have no idea how to do it: Thanks in advance. Answer Updated #1 Full example . UPDATED #2 With HOC .
How do you re-render DatePicker with updated defaultValue?
I’m using DatePicker in the following scenario: Render the form that used DatePicker on componentDidMount, fetch form’s saved information (if it was saved previously) set DatePicker’s prop defaultValue from undefined to the fetched value Seems pretty simple. But, since DatePicker’s behaviour is to render defaultValue only on the first render, it obviously is empty when the value is fetched (second