Skip to content

fix(a11y): add visible keyboard focus ring and toggle semantics to QueryaIconButton #1370

Closed

Description

@ZhuchkaTriplesix

Summary

In Querya UI Kit QueryaIconButton and QueryaToolbarButton (lib/shared/widgets/querya_icon_button.dart, lines 97–132, 147–170):

QueryaIconButton is used across toolbars, header chrome, and data grid bars. It currently has two major accessibility (a11y) shortcomings:

  1. No visible focus indicator: The underlying material.InkWell handles keyboard focus, but no focus ring or border outline (colors.ring / 2px border) is drawn. Keyboard users navigating via Tab / Shift+Tab cannot see where focus is located.
  2. Missing toggle semantics: Many toolbar icon buttons represent toggles (isActive = true/false, e.g., Word Wrap, Line Numbers, Filter, PII Masking). However, the button does not declare Semantics(toggled: isActive) or Semantics(selected: isActive). Screen readers announce them only as generic buttons without state.

Scope & Implementation

Activity

  1. added
    bugSomething isn't working
    frontendTheme parser epic label: frontend
    accessibilityReduced motion, OS accessibility preferences
    uiUser interface components and widgets
    P2Medium priority / Parity & Refactoring
    on Oct 10, 2026
  2. ZhuchkaTriplesix commented on Oct 11, 2026

    @ZhuchkaTriplesix
    MemberAuthor

    Done in #1395 (merged into dev).

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    P2Medium priority / Parity & RefactoringaccessibilityReduced motion, OS accessibility preferencesbugSomething isn't workingfrontendTheme parser epic label: frontenduiUser interface components and widgets

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions