Back to components

AI Interfaces

Model Route Simulator

A routing sandbox for projecting model selection, quality, and cost across different request classes.

routingmodelssimulation

Installation

Copy and paste the code into your project.

Accessibility notes

Every route names its condition, selected model, and projected cost in text.

Routing sandbox

Model route simulator

1,000 runs
  • Simple lookup

    → Fast

    $0.002
  • Multi-step reasoning

    → Deep

    $0.041
  • Sensitive action

    → Deep + review

    $0.058

Projected cost

$18.70

Quality target

92.4%

Preview accent

TypeScript
const routes = [{ condition: "Simple lookup", model: "Fast", cost: "$0.002" }, { condition: "Multi-step reasoning", model: "Deep", cost: "$0.041" }, { condition: "Sensitive action", model: "Deep + review", cost: "$0.058" }]; export function ModelRouteSimulator() { return <ul>{routes.map((route) => <li key={route.condition}>{route.condition}: {route.model} · {route.cost}</li>)}</ul>; }
Usage
<ModelRouteSimulator />

Related components

Speculative race

Parallel response routing

310ms saved
  1. 1

    Fast draft

    Quality 91

    380ms

    Accepted

  2. 2

    Deep verify

    Quality 96

    1.2s

    Checking

  3. 3

    Fallback

    Quality pending

    —

    Standby

The first valid draft streams while a deeper model verifies the answer.

AI Interfaces

Speculative Model Race

Advanced

A parallel routing view where a fast draft streams while a deeper model verifies response quality.

routinglatencymodels
View component

Agent handoff

ready
CSBL

Billing specialist

Confidence 96%

Context attached

  • Customer intent
  • Billing history
  • Draft response

AI Interfaces

Agent Handoff Card

Intermediate

A transparent transfer surface for routing conversations between specialized agents with shared context.

agenthandoffrouting
View component

Model availability

Regional endpoints

  • Reasoning

    US East

    620ms

    Available

  • Realtime

    Europe

    94ms

    Available

  • Vision

    Asia Pacific

    —

    Degraded

AI Interfaces

Model Availability Grid

Beginner

A regional model status grid showing endpoint health and observed latency.

modelsavailabilitystatus
View component