Skip to content

Improve keyboard navigation for form controls #32

@thomasbecker

Description

@thomasbecker

Problem

Forms in the app are difficult or impossible to navigate using keyboard only. This is an accessibility barrier for users who rely on keyboard navigation.

Specific Issues

  • Select/dropdown components (like the brand selector on the "Add Gear Item" form) cannot be operated with keyboard alone
  • Users must use a mouse to select options from dropdown menus
  • This blocks keyboard-only users from completing core workflows

Expected Behavior

  • All form controls should be fully operable via keyboard
  • Select boxes should support:
    • Tab to focus the control
    • Enter or Space to open the dropdown
    • Arrow keys to navigate options
    • Enter to select an option
    • Escape to close without selecting
  • Focus should be clearly visible on all interactive elements

Impact

This affects users who:

  • Have motor impairments that make mouse use difficult
  • Prefer keyboard for efficiency
  • Use screen readers or other assistive technology

Technical Notes

This likely requires reviewing the shadcn-svelte Select component usage to ensure proper keyboard event handling and ARIA attributes are in place.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions