AI Components / Model Selector
Model Selector
Card grid for picking AI models with capability filters, cost tiers, and multi-select comparison.
ai-viz v0.3.0
Playground
Examples
Single select
<ai-model-selector selected="claude35"></ai-model-selector> Multi-select
<ai-model-selector multi></ai-model-selector> Import
import { AiModelSelector } from '@cognivo/components'; // Or tree-shake: import '@cognivo/components/ai-model-selector'; Per-component imports ship only that component (~8 kB gzip).
API Reference
| Prop | Type | Default | Description |
|---|---|---|---|
models | AIModel[] | — | Models — {id, name, provider, capabilities?, costTier?, description?, icon?} |
selected | string | — | Pre-selected model ID |
multi | boolean | false | Multi-select for comparison |
rounded | "none"|"sm"|"md"|"lg" | "lg" | Card border radius |
Events
| Event | Detail | Description |
|---|---|---|
ai-model-select | {selected, model} | Model selected |
ai-model-compare | {models} | When 2 models selected (multi mode) |