TextArea

The <TextArea> is a form component which allows user to enter text with a keyboard. It consists of a label, a textarea and a help text. The latter also contains error messages.

It is behaves similar to the <TextField>. The properties have the identical behavior as the ones in <TextField>.

You can also add all usual properties from the HTML textarea element.

Import


import { TextArea } from '@marigold/components';

Appearance

Property	Type	Description
`variant`	`-`	The available variants of this component.
`size`	`-`	The available sizes of this component.

Props

Property	Type	Default	Description
`label`	`ReactNode`	`none`	The label text.
`description`	`ReactNode`	`none`	A helpful text.
`errorMessage`	`ReactNode`	`none`	An error message.
`error`	`boolean`	`false`	If true, the is considered invalid and if set the errorMessage is shown instead of the description.
`value`	`string`	`none`	The value of the textarea.
`disabled`	`boolean`	`false`	If true, the textarea is disabled.
`required`	`boolean`	`false`	If true, the textarea is required.
`readOnly`	`boolean`	`false`	If true, the textarea is readOnly.
`onChange`	`function`	`none`	A callback function that is called with the textarea's current value when the input value changes.
`width`	`string \| number`	`full`	Sets the width of the field. You can see allowed tokens here: https://tailwindcss.com/docs/width
`rows`	`number`	`none`	Sets the number of rows from the textarea.
`...`		`-`	Yes you can use all regular attributes of textarea!