Properties
Property | Type | Description |
---|---|---|
value | string | (optional) The content value of the Textarea. |
align | string | (optional) Defines the text-align of the Textarea. Defaults to left . |
stretch | boolean | (optional) If set to true , then the Textarea field will be 100% in width . |
placeholder | string | (optional) The placeholder which shows up once the Textarea value is empty. |
keepPlaceholder | boolean | (optional) Use true to keep the placeholder visible even when the Textarea has focus. Defaults to false . |
label | string | (optional) Prepends the Form Label component. If no ID is provided, a random ID is created. |
label_direction | string | (optional) Use label_direction="vertical" to change the label layout direction. Defaults to horizontal . |
suffix | string | (optional) Text describing the content of the Textarea more than the label. You can also send in a React component, so it gets wrapped inside the Textarea component. |
label_sr_only | boolean | (optional) Use true to make the label only readable by screen readers. |
autoresize | boolean | (optional) Use true to make the Textarea grow and shrink depending on how many lines the user has filled. |
autoresize_max_rows | number | (optional) Set a number to define how many rows the Textarea can auto grow. |
characterCounter | number object | (optional) Use a number to define the displayed max length. You can also use an object defining the TextCounter variant or properties. Please avoid using maxLength for accessibility reasons. |
size | string | (optional) The sizes you can choose for 1 row is small (2rem), medium (2.5rem) and large (3rem). Defaults to small . |
status | string boolean | (optional) Text with a status message. The style defaults to an error message. You can use true to only get the status color, without a message. |
status_state | string | (optional) Defines the state of the status. Currently, there are two statuses [error, info] . Defaults to error . |
status_props | object | (optional) Use an object to define additional FormStatus properties. |
globalStatus | object | (optional) The configuration used for the target GlobalStatus. |
textarea_state | string | (optional) To control the visual focus state as a prop, like focus or blur . |
inner_ref | React.Ref | (optional) By providing a React.Ref we can get the internally used Textarea element (DOM). E.g. inner_ref={myRef} by using React.createRef() or React.useRef() . |
skeleton | boolean | (optional) If set to true , an overlaying skeleton with animation will be shown. |
Space | string object | (optional) Spacing properties like top or bottom are supported. |
Set Textarea height
You can set the height of a Textarea by both CSS styles or the rows
attribute.