I have a component that imports: import LogoutIcon from "@mui/icons-material/Logout"; import useLogout from "@/hooks/auth/useLogout"; const { trigger: logoutTrigger } = useLogout(); But where I use this component is here: <LogoutIcon type="button" onClick={logoutTrigger} sx={LogoutIconSx} cursor="pointer" /> And it all gets highlighted…
I am trying to dynamically add pairs of buttons and text fields and have the button perform some action on its corresponding text field. My specific use case is creating a 'User Settings' page where users can change a specific…
Recently, a new error started showing in my React application: ResizeObserver loop limit exceeded Seems that the general consensus is that the error is benign and there is nothing to worry about. However, I am not sure how to ignore…
I want to edit the grid only the number fields and when done editing all use the save button to send the array to the backend to get stored. I currenlty can´t exit the edit mode, when on the handleEditCellChange…
I'm trying to add a help icon inside a Select component, and would like to do something like this: <Select onChange={event => { ... }} value={mode} variant='outlined' > {modes.map(m => ( <MenuItem key={m.key} value={m.value} > {m.label} <IconButton onClick={() => {…
The map function in TextField does not work if it is located in the component material-ui I have two TextFields in the first one the radio button works, in the second one the radio button does not work. How to…
I want to achieve something like this, when I click on 20 numbered block, everything before that changes to light orange. I have this attached sandbox code, if anyone can guide what to add in the handleClick function would be…
i would like to design a component like this im using a material ui pop menu in my project here is the jsx code <div className="navMenu" style={{ position: "relative" }}> <Tooltip title="Menu"> <div className="navMenuIconContainer" style={{ boxShadow: anchorMenu === null ?…
I currently have a Material UI Modal component added to my react/typescript project but I'm having some issues that I can't figure out. So on my current site, if you click on one of the card elements, it should open…
I've been trying to create a date picker field that can allow for certain invalid date ranges i.e. 00 if the DD or MM for a date of birth is of an unknown value. The base UI components that I…