trying to use "@material-tailwind/react": "^2.1.9" in "next": "14.1.4" "use client"; import { Button } from "@material-tailwind/react"; ...

In React, Autocomplete Chrome values don't trigger onChange event immediately. Thus it causes a collision of MUI TextField Label and actual values, during initial loading of page. How can I resolve...

I'm trying to achieve autofocus functionality when fields are empty .. but in this situation autoFocus always works <Controller name="sum" control={control} render={({ field: { valu...

I am building an application using react and material-ui. Material-ui components comes with its custom classical blue-grey google style colors and I want to modify all of them with my custom ones. ...

How can I override a rule of a class which has high specificity? For example, the .MuiAccordionSummary-content.Mui-expanded class in the AccordionSummary const useStyles = makeStyles(() => ({ e...

I am creating a DataGrid where I want to show the values of ready_by and name that you can see in this picture: In the code, I have configured it in this way: (focus on the last two) const columns...

I have a problem using MUI with react-router-dom v6. import ListItem from '@mui/material/ListItem'; import { NavLink } from 'react-router-dom'; <List key={index}> <ListItem component={N...

How can I just change the icon for the open/close dropdown list? I want to functionality to stay the same. As I tried to add them as endAdornment, the functionality is gone for both remove and open...

I'm creating a file list with MUI DataGrid. The user able to check the checkbox in DataGrid to make their selection. I want the checkbox to reset after the user perform some action such as delete t...

I want to disable the animation of Material UI expansion panel in React. How can I disable all the animations applied to the expansion panel? Tried overwriting the transitions but it didn't help. ...

I am using @material-ui autocomplete for search and I want to add search icon next to autocomplete component I tried something like this but after changing ---- option fields is not displaying impo...

When a value is entered in the input of the autocomplete component I get this warning that I can't remove... This is what my input looks like <Autocomplete id="cboAdresse" sx={{ wi...

I have a Material UI Card component that I'd like to have contain a video (webm) that autoplays. (It's a mute video) The documentation for the CardMedia component indicates to list any HTML element...

IconButton in @material-ui/core/IconButton is showing a weird elliptical background when I hover the cursor over it. I thought it is a mistake by me, so I just copied the code from material-ui ...

I want to change the design of Mui Datagrid outline from to I can't upload the code for some reason, is there any reference material or example code?

I am trying to implement a home page for my react.js website. My layout is fine and my code compiles without problems. However when I click my button I am getting the following error on the website...

I'm trying to display a grid of Avatar images. While in a transition state I would like for a skeleton representation of the Image to appear. For that I'm using @material-ui/lab/Skeleton. The pro...

<Input id="image" type="file" accept="image/*" onChange={(event) => getBase64(event.target.files[0]) .then((file) => this.setState({ image: file }) )} ...

I have a MUIRadioGroup (options = Low, Medium and High) and a multi-select MUIAutocomplete component on my form. <MUIRadioGroup name="requestDetail.riskAssesmentDetail.riskClassification&q...

This is my first post so sorry if i forget anything ... For my work i have to use Material UI and i need an IconButton with some contained style like the real Button! I managed to do it with a full...

In my project, I am using custom svg files as part of the requirement. I am using [email protected] to achieve this. I looked at the example that is available on the official documentation -> ...

I am trying to learn material ui. I am trying to change the css of the loading bar. I referred to the documentation and used colorPrimary classes but its not changing. can you tell me how to fix i...

I've tried all methods for vanilla HTML, JS and CSS but it don't seem to work and when it does its not responsive for instance when I reduce the screen it hides but if its Maximized it shows up Pl...

The scroll is blocked with Popover according to the new material-ui version doc. When i open the popover, the scroll-bar of the web page suddenly disappeared and it's not the part of user experien...

I have a react component with a material-ui Slider. Each time this component renders I get this warning : "Added non-passive event listener to a scroll-blocking 'touchstart' event. Consider marking...