i am having issues while trying to build my storybook with rollup.js, in my react components i am using @mui/material and in their installation page its asked t
In createTheme function on MUI, in the palette section there is a "type" option. I have created two different palettes with type options dark and light as you c
I am trying to align the items in a div (that is within an MUI Select styled component): const SelectStyle = styled(Select)(({ theme }) => ({ width: WIDT
I've just started migrating from enzyme to react testing library on my project that uses material-ui. From what I understand, RTL queries the dom and the recomm
I'm new in React and a new dev in general; I know that there are many ways to style elements in React itself: importing CSS, locally scoped CSS modules, CSS-in-
I am trying to test a dialog with react testing library. This dialog contains a form I render with react hook form. This form has a single field with some valid
There are some issues I'm having while using the react-xarrows with mui. I'm trying to achieve: The line should be connected in the same position after toggling
I have this file and I'm trying to have a "group batten", and when I click on it, I have a list with ["Confirm Review", "Reject Invoice", "Assign to User"] and
I have a bottom navigation that contains 5 elements. When you resize the window lower than 400px, the bottom navigation doesn't "squeeze", so to say; it remains
I understand that ideally should be placed at the top of the page. However, Assume they are place in the middle of the page. When changing from a tab with a l
I have an e-commerce website and I added a cart icon in the navbar. When clicked, a MUI modal should open (and it does) but it doesn't close anymore. I also add
We have a legacy application that we're slowly migrating to React and MUI. In order to prevent overlap in styling between the different parts of our applicatio
I am trying to use an editing API from "@mui/x-data-grid" and simply have editing on the cell and retrieve the new value. When I use onCellEditStop={(params: Gr
how to hide this block on mobile version mui datepicker?
how to hide this block on mobile version mui datepicker?
in below grid container , there is an image on the left , with a bunch of text on the right , there is a huge gap between the image and the text which tried to
My problem is that when I change a value in a dropdown I want to disable two radio buttons and change to the correct radio button. I am able to disable the radi
Give style like this: const style = { overflow: "auto", backgroundColor: "#292929", color: "blue", height: 650, width: 1, flexGrow: 1, fontFamily:
Attempting to create a higher-order component with two components that scale together. The higher-order component is set up as so: <> <Component 1/
I have a theme switch (light to dark) on my page, using Material UI switch. I get an error from lighthouse stating that it needs a label, but