Skip to content

MultiSelect - Keyboard Control Not Working Properly #8102

@Luko248

Description

@Luko248

Describe the bug

There is a bug with the keyboard control of the MultiSelect component. The keyboard navigation only partially works, as shown in the attached GIF. When the "chips" variant is enabled, I am unable to focus on individual checkboxes using the keyboard. I can select the parent checkbox that selects all options, but I cannot select individual options. The focus only highlights the parent element that wraps the individual checkboxes.

Reproducer

Image

System Information

Environment

primereact: 10.9.6
react: 18.3.1
react-dom: 18.3.1

System Informations 

OS: macOS Sequoia 15.5 
Processor:  M3 Pro 
Memory: 18 GB
Node.js: v22.16.0

Steps to reproduce the behavior

Enable the "chips" variant on the MultiSelect component.
Attempt to navigate through the checkboxes using the keyboard.
Observe that the focus only reaches the parent checkbox and not the individual checkboxes.

Expected behavior

Using the keyboard, I should be able to control the entire component, not just a part of it. I should be able to focus on and select individual checkboxes.

Metadata

Metadata

Assignees

Labels

Component: AccessibilityIssue or pull request is related to WCAG or ARIA

Type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions