🎨 Palette: Make category rows fully clickable and accessible

.jules/palette.md

@@ -0,0 +1,3 @@
+## 2024-05-30 - Make SwiftUI List Rows Fully Clickable
+**Learning:** In SwiftUI, just having a button in an HStack restricts the clickable area. Furthermore, wrapping an HStack in a button requires `.contentShape(Rectangle())` to make whitespace clickable and specific `.accessibilityElement(children: .combine)` and `.accessibilityAddTraits` to ensure proper VoiceOver behavior.
+**Action:** Always wrap the entire row contents in a Button, apply `.contentShape(Rectangle())`, and apply proper accessibility traits when building custom list rows.

Sources/Cacheout/Views/CategoryRow.swift

@@ -24,15 +24,12 @@ struct CategoryRow: View {
     let onToggle: () -> Void
 
     var body: some View {
-        HStack(spacing: 12) {
-            // Checkbox
-            Button(action: onToggle) {
+        Button(action: onToggle) {
+            HStack(spacing: 12) {
+                // Checkbox
                 Image(systemName: result.isSelected ? "checkmark.circle.fill" : "circle")
                     .font(.title3)
                     .foregroundStyle(result.isSelected ? .blue : .secondary)
-            }
-            .buttonStyle(.plain)
-            .disabled(result.isEmpty)
 
             // Icon
             Image(systemName: result.category.icon)
@@ -70,6 +67,12 @@ struct CategoryRow: View {
                 RiskBadge(level: result.category.riskLevel)
             }
         }
+        .contentShape(Rectangle())
+        }
+        .buttonStyle(.plain)
+        .disabled(result.isEmpty)
+        .accessibilityElement(children: .combine)
+        .accessibilityAddTraits(result.isSelected ? [.isSelected] : [])
         .padding(.vertical, 6)
         .padding(.horizontal, 10)
         .opacity(result.isEmpty ? 0.5 : 1)