Skip to main content

Options

A single chip is one tappable follow-up; SuggestionList groups a capped set of chips (design caps at 3, ~40 characters each) beneath an agent response.

List of Suggestions

SuggestionList renders one chip per entry in suggestions and exposes the set to assistive tech as one labelled group — “Suggested replies” by default. Selecting a chip fires onSelect with that suggestion’s text and index; clearing the list and inserting the text into the message input is the consumer’s job.

Disabled

isDisabled dims the chip and blocks press and hover, but keeps it focusable for keyboard users.

Behavior

The chip responds to hover, press, and keyboard focus, and a list of chips wraps to fit its container.

Visual States

Hover and press both deepen the chip’s translucent fill; keyboard focus adds a ring without changing the fill.

Wrapping

SuggestionList wraps chips onto new lines once a row runs out of width, rather than overflowing or shrinking the chips.

Keyboard Interaction

Users can navigate and select a Suggestion using standard keyboard controls.
Last modified on July 24, 2026