Questions tagged [mui-x]

This tag should be used for questions regarding the MUI X library: a collection of advanced React components including a data grid and date and time pickers. This project is maintained by MUI.

Related tags

  • for questions that are React-related.
  • for questions that are MUI X Data Grid related.
  • for questions that are MUI X Date Pickers related.
  • for questions that are Material UI related, another open-source UI library by MUI.
  • for questions that are Joy UI related, another open-source UI library by MUI.
  • for questions that are Base UI related, another open-source UI library by MUI.
136 questions
1
vote
0 answers

how to set default date in MUI X MobileDatePicker

in our system we migrate from using { DatePicker, DatePickerProps } from "material-ui-pickers-mui5" to use { MobileDatePicker, MobileDatePickerProps } from "@mui/x-date-pickers" we have a property called initialFocusedDate, I tried to use it and…
1
vote
1 answer

MUI - Data grid - Aggregation - can we show aggregation result (sum) in the table header?

I'm a designer and I'm desiging a dashboard that will be coded using MUI library for React. I have a question regarding Data aggregation. I found these resources in the official documentation:https://mui.com/x/react-data-grid/aggregation/ My…
Helga
  • 11
  • 1
1
vote
0 answers

Material UI ClockPicker - implement autoclose on minute selection

The default behaviour of the ClockPicker when using the TimePicker component from Material-ui is: ClockPicker display the hours view. User clicks on an hour number. On mouseup the ClockPicker captures that value and send it through its onChange…
GhostOrder
  • 586
  • 7
  • 21
1
vote
1 answer

Use Material UI styled for MUI X datepicker

I wanted to customize the date picker and tried to remove the padding from the input in the MUI X date picker but nothing was working. Am I doing something wrong here or is styled not supported by MUI X? import { styled } from…
Felix
  • 55
  • 1
  • 1
  • 5
1
vote
2 answers

Where should I define my MUI X license key on a storybook?

Where should I define my license key on a storybook? Where to install the key? You must call setLicenseKey before React renders the first component. You only need to install the key once in your application. - MUI Docs But this case is more…
Fulashd
  • 51
  • 4
1
vote
0 answers

How do I partially update a Date / Time picker value?

I'm trying to allow partial updates to a date/time picker: https://mui.com/x/react-date-pickers/getting-started/ The scenario is as follows.. I have a date/time set. And I just want to update the time from AM to PM. Let's say the starting state…
magician11
  • 4,234
  • 6
  • 24
  • 39
1
vote
0 answers

How to change default selected minutes in Material UI picker-KeyboardTimePicker?

I wonder if there's a way to modify whatever is the selected default minutes once I open the Clock in my KeyboardTimePicker. As you can see I managed to change the disabled minutes into bullets by modifying this…
quielfala
  • 361
  • 4
  • 18
1
vote
1 answer

Clicking component inside renderHeader prop for MUI Data Grid Pro changes the sortModel

I'm using Material UI DataGridPro component to build a React Js app. I want to create a custom filtering. The red box in the image below is an IconButton for the filtering view and the blue box is for the column showing/hiding view. I want to…
Jabal Logian
  • 1,666
  • 4
  • 24
  • 46
1
vote
0 answers

Problems with renderHeader prop MUI Data Grid Pro component

I'm using Material UI DataGridPro component to build a React Js app. I want to create a custom filtering and column showing/hiding views. The red box in the image below is an IconButton for the filtering view and the blue box is for the column…
Jabal Logian
  • 1,666
  • 4
  • 24
  • 46
1
vote
0 answers

KeyboardDatePicker's onError gets called every time we change a field

We are using KeyboardDatePicker from @material-ui/pickers with date-fns, on a website designed with material-ui. Everything works with the KeyboardDatePicker, except we wanted to prevent form submission if the date is invalid. After some trial and…
1
vote
2 answers

How do I make Material UI Datagrid NoRowsOverlay component clickable?

I would like to override the Datagrid's NoRowsOverlay component with my custom one, which uses react-dropzone:
sowizz
  • 175
  • 3
  • 11
1
vote
1 answer

How to commit changes to Checkbox inside a Datagrid (not row selection) upon click?

I have a Checkbox inside a cell on a table. When I click the checkbox, it changes, but only the first time. If I keep on clicking the same checkbox, nothing happens until I click outside that cell. I'm pretty sure that this has to do with Row…
I Stand With Israel
  • 1,971
  • 16
  • 30
1
vote
1 answer

How can I change color for the component

I want to change underline color of the DatePicker component. Here is my attempt of doing so import React from 'react' import PropTypes from 'prop-types' import { DatePicker as MuiDatePicker, MuiPickersUtilsProvider } from…
Matan Gubkin
  • 3,019
  • 6
  • 25
  • 44
1
vote
0 answers

Emotion - serializedStyles not in dom style

Sure I'm missing something about emotion. In a react/material-ui application I'm trying to add a classname that was generated by emotion (for each cell of my table I've different css styles). The idea is to convert the style I've for each cell of my…
ic3
  • 7,917
  • 14
  • 67
  • 115
0
votes
0 answers

Access schema rules within Controller

I use react-hook-forms with schema validation (Zod) and MUI. Now a try to access the validation rules of the corresponding field within the "" tag, to "forward" them to the MUI-Component. For example: I would like to set required option in the…
Dominic
  • 11
  • 4