import * as React from "react"
import { TopList, type DimensionPoint } from "@/registry/charts/top-list"

const data: DimensionPoint[] = [
  { value: "Chrome", users: 24180, sessions: 31240 },
  { value: "Safari", users: 12640, sessions: 15820 },
  { value: "Edge", users: 5310, sessions: 6740 },
  { value: "Firefox", users: 2870, sessions: 3410 },
  { value: "Samsung Internet", users: 1290, sessions: 1530 },
]

export default function TopListDemo() {
  return (
    <div className="w-full max-w-md">
      <TopList data={data} />
    </div>
  )
}

Chrome	24,180
Safari	12,640
Edge	5,310
Firefox	2,870
Samsung Internet	1,290