Component registry

Model chip

The selected AI model as a compact choice that opens the model picker.

All components · Kit documents · Definition as JSON

Live web demo

Choose a model

Model

Web source: openvibe-shared/ov-ai-choice · .ov-ai-choice model chip

Anatomy

  • iconmodel glyph
  • nameselected model
  • chevronchange affordance

Props

model
string
options
choice[]
disabled
boolean

Behavior and accessibility

States
default · open · disabled
Tokens
color.bg.raised · color.accent.strong · size.tap
Keyboard
Keeps the focused control in view
Outside tap
Closes the surface
Scroll lock
Page remains scrollable
Reduced motion
Remove movement; keep the state change.
Accessibility
Announce selected model and that it opens choices. Visible keyboard focus; follow reading order. At least 44 × 44 dp or pt for every touch action.

Android · Jetpack Compose

Use an AssistChip that opens a ModalBottomSheet with model choices.

Material 3 container: SecondaryContainer

iOS · SwiftUI

Use a Menu with a Label and selected model checkmark.

Example definition

{
  "schema": "design.component@1",
  "name": "ai-choice",
  "props": {
    "model": "Auto"
  }
}

Other components