MonthPicker API
API documentation for the React MonthPicker component. Learn about the available props and the CSS API.
Import
import MonthPicker from '@mui/x-date-pickers/MonthPicker';
// or
import { MonthPicker } from '@mui/x-date-pickers';
Component name
The nameMuiMonthPicker
can be used when providing default props or style overrides in the theme.Props
Name | Type | Default | Description |
---|---|---|---|
date* | any | Date value for the MonthPicker | |
maxDate* | any | Maximal selectable date. | |
minDate* | any | Minimal selectable date. | |
onChange* | func | Callback fired on date change. | |
classes | object | Override or extend the styles applied to the component. See CSS API below for more details. | |
className | string | className applied to the root element. | |
disabled | bool | false | If true picker is disabled |
disableFuture | bool | false | If true future days are disabled. |
disablePast | bool | false | If true past days are disabled. |
onMonthChange | func | Callback firing on month change @DateIOType. Signature: function(month: TDate) => void | Promise month: The new year. returns (void | Promise): - | |
readOnly | bool | false | If true picker is readonly |
shouldDisableMonth | func | Disable specific months dynamically. Works like shouldDisableDate but for month selection view @DateIOType.Signature: function(month: TDate) => boolean month: The month to check. returns (boolean): If true the month will be disabled. | |
sx | Array<func | object | bool> | func | object | The system prop that allows defining system overrides as well as additional CSS styles. See the `sx` page for more details. |
The
ref
is forwarded to the root element.CSS
Rule name | Global class | Description |
---|---|---|
root | .MuiMonthPicker-root | Styles applied to the root element. |
You can override the style of the component using one of these customization options:
- With a global class name.
- With a rule name as part of the component's
styleOverrides
property in a custom theme.