UNPKG

@nish1896/rhf-mui-components

Version:

A suite of 20+ reusable Material UI components for React Hook Form to minimize your time and effort in creating and styling forms

20 lines (19 loc) 1.57 kB
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime"; import { Controller } from 'react-hook-form'; import MuiRating from '@mui/material/Rating'; import { FormControl, FormLabel, FormHelperText } from '../../mui/common'; import { fieldNameToLabel } from '../../utils'; const RHFRating = ({ fieldName, control, registerOptions, required, onValueChange, label, showLabelAboveFormField, formLabelProps, helperText, errorMessage, hideErrorMessage, formHelperTextProps, ...rest }) => { const fieldLabel = label ?? fieldNameToLabel(fieldName); const isError = Boolean(errorMessage); return (_jsxs(FormControl, { error: isError, children: [_jsx(FormLabel, { label: fieldLabel, isVisible: showLabelAboveFormField ?? true, required: required, error: isError, formLabelProps: formLabelProps }), _jsx(Controller, { name: fieldName, control: control, rules: registerOptions, render: ({ field }) => { const { value, onChange, ...otherFieldParams } = field; return (_jsx(MuiRating, { ...rest, ...otherFieldParams, value: value ?? 0, onChange: (event, newValue) => { onChange(Number(newValue)); if (onValueChange) { onValueChange(newValue, event); } } })); } }), _jsx(FormHelperText, { error: isError, errorMessage: errorMessage, hideErrorMessage: hideErrorMessage, helperText: helperText, formHelperTextProps: formHelperTextProps })] })); }; export default RHFRating;