import { Badge } from '../ui/Badge'

export default function BadgesDemo() {
  return (
    <div className="space-y-4">
      <div className="flex flex-wrap gap-2">
        <Badge tone="success" dot>Running</Badge>
        <Badge tone="info" dot>Scaling</Badge>
        <Badge tone="warning" dot>Degraded</Badge>
        <Badge tone="error" dot>Failed</Badge>
        <Badge tone="neutral" dot>Stopped</Badge>
      </div>
      <div className="flex flex-wrap gap-2">
        <Badge tone="gradient">Pilot</Badge>
        <Badge>GDPR</Badge>
        <Badge>NIS2</Badge>
        <Badge>ISO27001</Badge>
      </div>
    </div>
  )
}