Skip to content

Dynamic Components

These fully AI/LLM selected and configured dynamic Data UI Blocks are now supported by UI Agent. UI Agent selects UI component which matches best the current user prompt and input data structure.

Optionally, this components can be mapped per InputData.type and pre-configured in this mapping, LLM is not used/necessary in this case.

See details about component selection and configuration process.

Components for one Object input data

Card

Component identification: one-card

Card is UI block that displays:

Facts are name-value pairs, where the name is AI generated and the value is gathered from agent's input data. Value can be simple text or number etc. List (array) of values is supported as well.

Example rendering by Red Hat Design System for user prompt Tell me details about Toy Story:

Card Data UI Block rendering by Red Hat Design System

Image

Component identification: image

Image is UI block to display a single image with a title, based on image url present in the input data.

Example rendering by Red Hat Design System for a prompt Show me poster of Toy Story movie:

Image Data UI Block rendering by Red Hat Design System

Image is found by agent from backend-data either by field value or by field name. See the spec/component/image.schema.json for more details.

Video Player

Component identification: video-player

Video player is UI block to play a single video from video URL provided in the input data.

Title is also generated, and link pointing to the video cover image for YouTube videos is provided.

Warning

Ability to play videos from video service url's (YouTube, Vimeo) or support for video file formats (avi, mpeg, mov, ...) can vary in individual UI renderers!

Example rendering by Red Hat Design System for a prompt Play trailer of Toy Story movie:

Video Player Data UI Block rendering by Red Hat Design System

Components for Array of objects input data

Set Of Cards

Status

Component identification: set-of-cards

Set of Card is UI block that displays:

  • Title
  • Set of multiple Card components, each showing the same list of facts

Facts are name-value pairs, where the name is AI generated and the value is gathered from agent's input data. Value can be simple text or number etc. List (array) of values is supported as well.

Layout for this set of cards has to be provided by frontend application.

Table

Status

Component identification: table

Table is UI block that displays:

  • Title
  • Table with AI selected Columns with AI generated names, and rows of values gathered from agent's input data.

Individual cell value can be simple text or number etc. List (array) of values is supported as well.