Introduction Foundations Components Directives Pipes Motion Brand

Ai

Ai button Ai modal Ai text editor Ai textarea

Cards

Controls

Freelancer domain

Loading

Modals

Structure

Text & links

Patterns Ai Ai textarea

Ai textarea

AI textarea with a toolbar that includes a send button and optional attachments and voice input buttons.

Contents

Default Button text Hint Keep keyboard open on submit Max lines Toolbar variants Validation

A hint can be provided to give additional context to the user. It appears below the textarea when it is focused, and disappears when the user blurs the field. When the field is submitted with an invalid value, the hint is replaced by a validation error, if validators are provided.

Inputs
control : FormControl<string>
autoFocus ?: any = AutoFocusOption.NONE
buttonText ?: string = ''

When set, the submit button expands into a labelled pill once minCharacters is reached.

hint ?: string
keepKeyboardOpenOnSubmit ?: boolean = false

Keep the virtual keyboard open when the submit button is tapped to prevent the button from stealing focus from the textarea. This lets validation errors/shake show in place instead of after the keyboard closes.

label ?: string
maxLines ?: number = 12

Line count at which the textarea becomes scrollable on desktop/tablet.

maxLinesMobile ?: number = 10

Line count at which the textarea becomes scrollable on mobile (>= 400px).

maxLinesMobileSmall ?: number = 7

Line count at which the textarea becomes scrollable on small mobile (<400px).

minCharacters ?: number = 6

Character threshold at which the submit button expands (requires buttonText).

placeholder ?: string = ''
showAttachmentsButton ?: boolean = false
showVoiceInputButton ?: boolean = false
Outputs
onAttachmentsClick ?: any = new EventEmitter<void>()
onBlur ?: any = new EventEmitter<void>()
onFocus ?: any = new EventEmitter<void>()
onInputHandled ?: any = new EventEmitter<void>()
onSubmit ?: any = new EventEmitter<void>()
onVoiceInputClick ?: any = new EventEmitter<void>()