Installation — @piplup/rhf-adapters (@mui/x-date-pickers)

@piplup/rhf-adapters/mui-x-date-pickers provides pre-integrated MUI X Date Picker components and adapter hooks for React Hook Form.

First, install the core packages, if not installed already:

npm install @piplup/rhf-core react-hook-form

Then install the adapters package together with the MUI Material and MUI X Date Pickers peer dependencies:

npm install @piplup/rhf-adapters @mui/material @emotion/react @emotion/styled @mui/x-date-pickers

Additionally, install the date library of your choice for MUI X Date Pickers

npm install dayjs

npm install date-fns

npm install luxon

npm install moment

Import

import {
  MuiXDatePickerElement,
  useMuiXDatePickerAdapter,
} from "@piplup/rhf-adapters/mui-x-date-pickers";

Use /mui-x-date-pickers subpath when you want MUI X Date Pickers components to participate in form state, validation, helper text composition, and react-hook-form controlled value handling without writing the wiring yourself.

See also

• Components
• Hooks
• MUI X Date Pickers - QuickStart