blue
View on GitHub

Textarea

A textarea provides a larger input field for users to enter multi-line text.

Usage

Light
Blue
Zoho Puvi 
<script>
	import { Textarea } from 'deskblocks';
</script>

<Textarea placeholder="Enter some message here" />

Help message

Light
Blue
Zoho Puvi
Above all, never fool yourself, and remember that you are the easiest person to fool. 
<div>
	<Textarea value={message}>
		<span slot="help-msg">
			Above all, never fool yourself, and remember that you are the easiest person to fool.
		</span>
	</Textarea>
</div>

Rows

Light
Blue
Zoho Puvi 
<!-- 4 Rows -->
<Textarea rows="4" value={message} />

Resizing

Light
Blue
Zoho Puvi 
<Textarea resize="both" value={message} />

Disabled state

Light
Blue
Zoho Puvi 
<Textarea disabled value={message} />

Props

id string undefined Specifies a unique identifier for the textarea field.
value string undefined Sets the current value of the textarea field.
placeholder string undefined Provides placeholder text that appears when the textarea is empty.
resize ‘horizontal’ | ‘vertical’ | ‘none’ | ‘both’ ‘none’ Controls the resizing behavior of the textarea.
minlength string undefined Specifies the minimum number of characters required in the textarea.
maxlength string undefined Specifies the maximum number of characters allowed in the textarea.
rows number 2 Sets the number of visible text lines for the textarea.
name string undefined Assigns a name to the textarea field, useful for form submissions.
spellcheck boolean false Enables or disables spellchecking for the textarea field.
disabled boolean false Disables the textarea field, preventing user interaction.
required boolean false Indicates that the textarea field is required before form submission.
readonly boolean false Makes the textarea field read-only, preventing user modifications.
class string undefined Custom CSS class name for additional styling.

Events