@finastra/textarea

Textarea

Text areas let users enter and edit text.

It extends Material web's mwc-textarea-base.

Usage

Import

npm i @finastra/textarea

import '@finastra/textarea';
...
<fds-textarea label="description"></fds-textarea>

API

Properties

Property	Attribute	Modifiers	Type	Default	Description
autoValidate			boolean
autocapitalize			string
charCounter	charCounter		boolean | "external" | "internal"	false	Requires maxLengthto be set. Display character counter with max length. Textareas may display an "external" or "internal" charCounter. When true, textareas display an external character counter by default.
cols			number
disabled	disabled		boolean	false	Disabled state for the component. When disabled is set to true, the component will not be added to form submission.
endAligned			boolean
helper	helper		string	"helper"	Helper text to display below the input. Display default only when focused.
helperPersistent			boolean
icon			string
iconTrailing			string
inputMode			TextFieldInputMode
label	label		string	"textarea"	Sets floating label value.
max			string | number
maxLength	maxLength		number	0	Maximum length input to accept.
min			string | number
minLength			number
name			string
outlined			boolean	true
pattern			string
placeholder			string
prefix			string
readOnly			boolean
required	required		boolean	false	Displays error state if value is empty and input is blurred.
ripple		readonly	Promise<RippleInterface | null> | undefined		Implement ripple getter for Ripple integration with mwc-formfield
rows			number
selectionEnd		readonly	number | null
selectionStart		readonly	number | null
size			number | null
step			number | "any" | null		step can be a number or the keyword "any". Use String typing to pass down the value as a string and let the native input cast internally as needed.
suffix			string
type			TextFieldType
validateOnInitialRender			boolean
validationMessage			string
validity		readonly	ValidityState
validityTransform			((value: string, nativeValidity: ValidityState) => Partial<ValidityState>) | null
value			string
willValidate		readonly	boolean

Methods

Method	Type
blur	(): void
checkValidity	(): boolean
click	(): void
focus	(): void
layout	(): Promise<void>
reportValidity	(): boolean
select	(): void
setCustomValidity	(message: string): void
setSelectionRange	(selectionStart: number, selectionEnd: number, selectionDirection?: "forward" | "backward" | "none" | undefined): void

CSS Custom Properties

Property	Type	Default	Description
--fds-primary	color	"#694ED6"	Textarea color.