Accessibility (접근성)

import { CheckCircle, Clock, Calendar, XCircle } from "lucide-react";
import { Badge } from "@vortex/ui-cals";
 
export default function AccessibleBookingStatus() {
  return (
    <div>
      {/* ✅ Good: 색상 + 아이콘 + 텍스트 */}
      <Badge variant="booking-available">
        <CheckCircle size={16} className="mr-xs" aria-hidden="true" />
        <span>예약 가능</span>
      </Badge>
 
      {/* Screen reader only 텍스트 추가 */}
      <div className="relative">
        <span className="sr-only">예약 상태: 예약 가능</span>
        <Badge variant="booking-available">예약 가능</Badge>
      </div>
    </div>
  );
}