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

With keepKeyboardOpenOnSubmit, pressing the submit button does not steal focus from the textarea, so the textarea stays focused (and the virtual keyboard stays open on mobile) across submits.

By default the submit button takes focus on press, blurring the textarea and closing the keyboard on mobile.

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>()