Files
Sportstime/SportsTime/Features/Trip/Views/Wizard/Steps/RoutePreferenceStep.swift
Trey t d63d311cab feat: add WCAG AA accessibility app-wide, fix CloudKit container config, remove debug logs
- Add VoiceOver labels, hints, and element grouping across all 60+ views
- Add Reduce Motion support (Theme.Animation.prefersReducedMotion) to all animations
- Replace fixed font sizes with semantic Dynamic Type styles
- Hide decorative elements from VoiceOver with .accessibilityHidden(true)
- Add .minimumHitTarget() modifier ensuring 44pt touch targets
- Add AccessibilityAnnouncer utility for VoiceOver announcements
- Improve color contrast values in Theme.swift for WCAG AA compliance
- Extract CloudKitContainerConfig for explicit container identity
- Remove PostHog debug console log from AnalyticsManager

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-02-11 09:27:23 -06:00

133 lines
4.3 KiB
Swift

//
// RoutePreferenceStep.swift
// SportsTime
//
// Step 5 of the trip wizard - select route preference.
//
import SwiftUI
struct RoutePreferenceStep: View {
@Environment(\.colorScheme) private var colorScheme
@Binding var routePreference: RoutePreference
@Binding var hasSetRoutePreference: Bool
var body: some View {
VStack(alignment: .leading, spacing: Theme.Spacing.md) {
StepHeader(
title: "What's your route preference?",
subtitle: "Balance efficiency vs. exploration"
)
VStack(spacing: Theme.Spacing.sm) {
ForEach(RoutePreference.allCases) { preference in
RoutePreferenceCard(
preference: preference,
isSelected: hasSetRoutePreference && routePreference == preference,
onTap: {
routePreference = preference
hasSetRoutePreference = true
}
)
}
}
}
.padding(Theme.Spacing.lg)
.background(Theme.cardBackground(colorScheme))
.clipShape(RoundedRectangle(cornerRadius: Theme.CornerRadius.large))
.overlay {
RoundedRectangle(cornerRadius: Theme.CornerRadius.large)
.stroke(Theme.surfaceGlow(colorScheme), lineWidth: 1)
}
.onAppear {
// Auto-select the default if not already set (enables button with defaults)
if !hasSetRoutePreference {
hasSetRoutePreference = true
}
}
}
}
// MARK: - Route Preference Card
private struct RoutePreferenceCard: View {
@Environment(\.colorScheme) private var colorScheme
let preference: RoutePreference
let isSelected: Bool
let onTap: () -> Void
var body: some View {
Button(action: onTap) {
HStack(spacing: Theme.Spacing.md) {
Image(systemName: preference.iconName)
.font(.title2)
.foregroundStyle(isSelected ? Theme.warmOrange : Theme.textSecondary(colorScheme))
.frame(width: 32)
.accessibilityHidden(true)
VStack(alignment: .leading, spacing: 2) {
Text(preference.displayName)
.font(.headline)
.foregroundStyle(Theme.textPrimary(colorScheme))
Text(preference.descriptionText)
.font(.caption)
.foregroundStyle(Theme.textMuted(colorScheme))
}
Spacer()
if isSelected {
Image(systemName: "checkmark.circle.fill")
.foregroundStyle(Theme.warmOrange)
.accessibilityHidden(true)
}
}
.padding(Theme.Spacing.md)
.background(isSelected ? Theme.warmOrange.opacity(0.1) : Color.clear)
.clipShape(RoundedRectangle(cornerRadius: Theme.CornerRadius.medium))
.contentShape(Rectangle())
.overlay(
RoundedRectangle(cornerRadius: Theme.CornerRadius.medium)
.stroke(isSelected ? Theme.warmOrange : Theme.textMuted(colorScheme).opacity(0.3), lineWidth: isSelected ? 2 : 1)
)
.accessibilityElement(children: .combine)
}
.accessibilityLabel(preference.displayName)
.accessibilityValue(isSelected ? "Selected" : "Not selected")
.accessibilityAddTraits(isSelected ? .isSelected : [])
.buttonStyle(.plain)
}
}
// MARK: - RoutePreference Extensions
extension RoutePreference {
var iconName: String {
switch self {
case .direct: return "bolt.fill"
case .scenic: return "binoculars.fill"
case .balanced: return "scale.3d"
}
}
var descriptionText: String {
switch self {
case .direct: return "Minimize driving time between games"
case .scenic: return "Prioritize interesting stops and routes"
case .balanced: return "Mix of efficiency and exploration"
}
}
}
// MARK: - Preview
#Preview {
RoutePreferenceStep(
routePreference: .constant(.balanced),
hasSetRoutePreference: .constant(true)
)
.padding()
.themedBackground()
}