How to make textarea autosize?

[ngocdaothanh]

Thank you for this great library.

I have a question about setting the number of rows for textare:

By default, there are only 5 rows:
https://github.com/vip-git/react-jsonschema-form-material-ui/blob/master/src/fields/components/Input/utils/get-text-area-props.js

I can increase it to 15 like this:
https://react-jsonschema-form.readthedocs.io/en/v1.8.1/form-customization/#textarea-rows-option

const uiSchema = {
  "ui:widget": "textarea",
  "ui:options": {
    rows: 15
  }
}

But how to make it autosize?

Material UI supports this feature:
https://material-ui.com/components/textarea-autosize/
https://material-ui.com/components/text-fields/

[github-actions]

Hey 👋 Thanks for creating your first issue - Someone will get back to you on this shortly.

[vip-git]

Hi @ngocdaothanh

Thanks for your issue. have your tried adding this to your uiSchema

const uiSchema = {
  "mui:multiline": true
}

Let me know if this solves the issue ?

[vip-git]

Hi @ngocdaothanh

I have updated the playground so you can see this is actually working with

{
  "mui:multiline": true
}

• https://react-jsonschema-form-material-ui-github56.vercel.app/#single

How can you benefit from such features in future ? - by default this library supports all props updated by material ui for Input component as seen here :

• https://material-ui.com/api/input/#props

you can prefix mui: followed by the prop name and value to use them in your uiSchema

I hope this resolves your issue - feel free reopen incase it does not.

Thanks - Vipin