'Issue with TextField from Mateial ui once app was moved from Material UI 4 to 5

I'm moving React App components from Material Ui4 to 5 and I face some issues with few components. One of them is that for TextField component I'm getting below comment from Typescript once I hover over : const classes = outlinedPadding(props);

const outlinedPadding: never This expression is not callable. Type 'never' has no call signatures.ts(2349)

import { TextField } from '@mui/material';
import { TextFieldBackgroundProps } from '../../textfield/text-field';
import { FC } from 'react';
import { makeStyles } from '@mui/material/styles';

const outlinedPadding = makeStyles({
    root: {
        '& label.MuiFormLabel-root': {
            backgroundColor: (
                props: React.PropsWithChildren<TextFieldBackgroundProps>
            ) => props.backgroundcolor ?? '#ffff',
            paddingRight: '5px',
            fontSize: '11px',
        },
    },
});

type PropsModelType = TextFieldBackgroundProps;
export const BaseInput: FC<PropsModelType> = (props) => {
    const classes = outlinedPadding(props);
    return (
        <TextField
            {...props}
            variant="outlined"
            inputProps={{
                'aria-label':
                    props.inputProps?.['aria-label'] ?? (props.label as string),
                ...props.inputProps,
            }}
            fullWidth
            className={classes.root}
        />
    );
};

Appreciate Your replies



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source