Component registry

Thread composer

A multiline message field with Options, attachments and send or stop.

All components · Kit documents · Definition as JSON

Live web demo

Options

Model

Web source: openvibe-shared/thread · thread.composer({ action, placeholder, attach })

Anatomy

  • fieldmessage text
  • optionsmodel and attachment choices
  • sendsubmit or stop

Props

action
url
placeholder
string
options
action[]
attach
boolean
busy
boolean

Behavior and accessibility

States
empty · composing · uploading · busy
Tokens
color.bg.raised · color.text.primary · size.tap
Keyboard
Keeps the focused control in view
Outside tap
No dismissal
Scroll lock
Page remains scrollable
Reduced motion
Remove movement; keep the state change.
Accessibility
Thread composer. Enter sends when the field permits; Shift+Enter adds a line; Options has a spoken label. At least 44 × 44 dp or pt for every touch action.

Android · Jetpack Compose

Use an OutlinedTextField, Options icon button and send or stop button; imePadding on the dock.

Material 3 container: SurfaceContainerHigh

iOS · SwiftUI

Use TextEditor with an Options Menu and send or stop Button above the keyboard.

Example definition

{
  "schema": "design.component@1",
  "name": "thread-composer",
  "props": {
    "placeholder": "Ask anything",
    "attach": true
  }
}

Other components