1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
|
export const models = [
{
id: "gpt-5",
name: "GPT 5",
description: "OpenAI's latest model",
},
{
id: "claude-sonnet-4.5",
name: "Claude Sonnet 4.5",
description: "Anthropic's advanced model",
},
{
id: "gemini-2.5-pro",
name: "Gemini 2.5 Pro",
description: "Google's most capable model",
},
] as const
export type ModelId = (typeof models)[number]["id"]
export const modelNames: Record<ModelId, string> = {
"gpt-5": "GPT 5",
"claude-sonnet-4.5": "Claude Sonnet 4.5",
"gemini-2.5-pro": "Gemini 2.5 Pro",
}
interface ModelIconProps {
width?: number
height?: number
className?: string
}
export function ModelIcon({
width = 24,
height = 24,
className,
}: ModelIconProps) {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
width={width}
height={height}
fill="none"
viewBox="0 0 24 24"
className={className}
aria-label="Model icon"
>
<title>Model icon</title>
<g
stroke="currentColor"
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth="1.5"
clipPath="url(#clip0_4418_9868)"
>
<path d="m12.92 2.26 6.51 3.51c.76.41.76 1.58 0 1.99l-6.51 3.51c-.58.31-1.26.31-1.84 0L4.57 7.76c-.76-.41-.76-1.58 0-1.99l6.51-3.51c.58-.31 1.26-.31 1.84 0M3.61 10.13l6.05 3.03c.75.38 1.23 1.15 1.23 1.99v5.72c0 .83-.87 1.36-1.61.99l-6.05-3.03A2.24 2.24 0 0 1 2 16.84v-5.72c0-.83.87-1.36 1.61-.99M20.39 10.13l-6.05 3.03c-.75.38-1.23 1.15-1.23 1.99v5.72c0 .83.87 1.36 1.61.99l6.05-3.03c.75-.38 1.23-1.15 1.23-1.99v-5.72c0-.83.87-1.36-1.61-.99" />
</g>
<defs>
<clipPath id="clip0_4418_9868">
<path fill="#fff" d="M0 0h24v24H0z" />
</clipPath>
</defs>
</svg>
)
}
|