Hi,

on a new project I have this warning :

"Support for defaultProps will be removed from function components in a future major release. Use JavaScript default parameters instead."

But I can't figure out how should I do to declare the default value ?

Here is one of my component that have nested props :

const TextInput = ({ options, label, input }: TextInputProps) => {// logic here}

And I typed it like this :

export type TextInputProps = {
  options?: {
    withLabel?: boolean
    defaultLabelClass?: boolean
    defaultInputClass?: boolean
  }
  label: {
    label: string
    className?: string
  }
  input: {
    type: string
    name: string
    for: string
    id: string
    className?: string
    placeholder?: string
    required?: boolean
    onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void
  }
}

export const TextInputDefaultProps = {
  options: {
    withLabel: true,
    defaultLabelClass: true,
    defaultInputClass: true,
  },
  label: {
    className: undefined,
  },
  input: {
    className: undefined,
    placeholder: undefined,
    required: false,
    onChange: undefined,
  },
}

I did try something like this but it does not work:

const TextInput = ({
  options: { withLabel = true, defaultLabelClass = true, defaultInputClass = true },
  label: { label = 'Label', className = undefined },
  input: { type = 'text', name = 'input', id = 'input', placeholder = 'Placeholder', className = undefined , onChange = undefined},
}) => {

So how are we suppose to deal with nested props ?

Thanks :)