Textarea

Textarea is a component that allows user to write text over multiple lines.

<tw-textarea label="Song lyrics"></tw-textarea>

<tw-textarea
  label="Song lyrics"
  placeholder="e.g. High on a snow-covered mountain"
></tw-textarea>

<tw-textarea
  label="Song lyrics"
  placeholder="e.g. High on a snow-covered mountain"
  value="High on a snow-covered mountain. From her throne she looks down at the clowns. Who think youth can be found in a fountain. High on the wings of her rhythms. She will smile at the guys who come on with their eyes. But she'll never dance with them. And in smoke-filled rooms of electric sound. A legend is built around. The Snow Queen."
></tw-textarea>

<tw-textarea
  label="Song lyrics"
  placeholder="e.g. High on a snow-covered mountain"
  required
></tw-textarea>

<tw-textarea
  label="Song lyrics"
  placeholder="e.g. High on a snow-covered mountain"
  expand
></tw-textarea>

<tw-textarea
label="Song lyrics"
placeholder="e.g. High on a snow-covered mountain"
value="High on a snow-covered mountain. From her throne she looks down at the clowns. Who think youth can be found in a fountain. High on the wings of her rhythms. She will smile at the guys who come on with their eyes. But she'll never dance with them. And in smoke-filled rooms of electric sound. A legend is built around. The Snow Queen."
error="This field is incorrect."
></tw-textarea>

<tw-textarea
  label="Song lyrics"
  placeholder="e.g. High on a snow-covered mountain"
  value="High on a snow-covered mountain. From her throne she looks down at the clowns. Who think youth can be found in a fountain. High on the wings of her rhythms. She will smile at the guys who come on with their eyes. But she'll never dance with them. And in smoke-filled rooms of electric sound. A legend is built around. The Snow Queen."
  disabled
></tw-textarea>

Properties

Property	Attribute	Description	Type	Default
`type`	`type`	The type of the input.	`"text" \| "email" \| "password" \| "tel" \| "url" \| "search" \| "number"`	`"text"`
`placeholder`	`placeholder`	Placeholder text to display within the control.	`string`	`" "`
`expand`	`expand`	Controls whether the input expands to fill the width of its container.	`boolean`	`false`
`textAlign`	`text-align`	Aligns the value, label and placeholder	`"start" \| "center" \| "end"`	`"start"`
`min`	`min`	The minimum value of the input. Applicable when type is number.	`number \| undefined`
`max`	`max`	The maximum value of the input. Applicable when type is number.	`number \| undefined`
`step`	`step`	The step of the input. Applicable when type is number.	`number \| undefined`
`readonly`	`readonly`	Makes the control readonly.	`boolean`	`false`
`autocomplete`	`autocomplete`	Controls the autocompletion of the input.	`string \| undefined`
`controlName`	`name`	The name of the form component.	`string \| undefined`	`undefined`
`value`	`value`	The control value.	`string \| undefined`	`undefined`
`label`	`label`	The label of the control.	`string \| undefined`	`undefined`
`required`	`required`	Makes the control required.	`boolean`	`false`
`disabled`	`disabled`	Makes the control disabled.	`boolean`	`false`
`error`	`error`	Error to be shown with the input. Styles the input as incorrect when present.	`string \| undefined`	`undefined`

Events

Name	Description
`input`
`change`

Twikit

Twikit

Textarea

Properties

Events