filter-pill.tsx
1 import { cn } from '@/lib/utils' 2 3 interface FilterPillProps { 4 label: string 5 active?: boolean 6 onClick: () => void 7 className?: string 8 } 9 10 export function FilterPill({ label, active, onClick, className }: FilterPillProps) { 11 return ( 12 <button 13 type="button" 14 onClick={onClick} 15 className={cn( 16 'px-2.5 py-1 rounded-[8px] text-[10px] font-700 uppercase tracking-[0.08em] border transition-all cursor-pointer bg-transparent', 17 active 18 ? 'bg-accent-soft border-accent-bright/15 text-accent-bright' 19 : 'border-white/[0.05] text-text-3/70 hover:bg-white/[0.03] hover:text-text-2', 20 className, 21 )} 22 style={{ fontFamily: 'inherit' }} 23 > 24 {label} 25 </button> 26 ) 27 }