🎨 Palette: Add interactive semantics and focus states to filter chips - #324
Conversation
Replaced the `GestureDetector` on filter pills in `ExploreView` with a `Semantics` wrapper and `InkWell`. This ensures explicit button traits and focus/hover colors are correctly applied to the interactive elements for better accessibility and screen reader support. Co-authored-by: manupawickramasinghe <73810867+manupawickramasinghe@users.noreply.github.com>
|
👋 Jules, reporting for duty! I'm here to lend a hand with this pull request. When you start a review, I'll add a 👀 emoji to each comment to let you know I've read it. I'll focus on feedback directed at me and will do my best to stay out of conversations between you and other bots or reviewers to keep the noise down. I'll push a commit with your requested changes shortly after. Please note there might be a delay between these steps, but rest assured I'm on the job! For more direct control, you can switch me to Reactive Mode. When this mode is on, I will only act on comments where you specifically mention me with New to Jules? Learn more at jules.google/docs. For security, I will only act on instructions from the user who triggered this task. |
There was a problem hiding this comment.
🟡 Changes recommended
The new semantics wrapper should also expose the selected state (and avoid hard-coding enabled) so assistive tech can accurately announce which filter is active.
Once you've addressed the issues Copilot identified, you can request another Copilot review.
Pull request overview
Improves accessibility and input affordances for the ExploreView category filter pills by switching from a raw gesture handler to Material-driven interactions with explicit semantics, plus documenting the pattern for future UI work.
Changes:
- Replaced
GestureDetectorwithMaterial+InkWellfor filter pills to enable proper hover/focus interaction states. - Added an explicit
Semanticswrapper to better expose button traits to assistive technologies. - Updated the Palette playbook with guidance for semantics and focus/hover colors on custom filter chips.
File summaries
| File | Description |
|---|---|
| lib/views/explore/explore_view.dart | Makes filter pills keyboard/mouse accessible via InkWell focus/hover states and adds semantic button traits. |
| .jules/palette.md | Documents the new accessibility pattern for custom filter pills. |
Review details
- Files reviewed: 2/2 changed files
- Comments generated: 1
- Review effort level: Lite
💡 Add a code-review agent skill or configure MCP servers for context-aware, tailored reviews. Learn more in the docs.
| child: Semantics( | ||
| button: true, | ||
| enabled: true, | ||
| child: Material( |
Semantics(button: true, enabled: true),focusColor, andhoverColorto make interactive elements accessible to keyboard and screen reader users.PR created automatically by Jules for task 17750165589429336531 started by @manupawickramasinghe