Skip to content

Handle pagination as one tab key group #7641

Open
@hein-obox

Description

@hein-obox

Clear and concise description of the problem

As a website developer, I expect all my components to be accessibility friendly, but I don't like how the tab key logic has been implemented in the current pagination of the SwiperJS carousels.

When I use the tab key on the page, each and every pagination bullet counts as a separate button and needs to be clicked through separately with the the key.

I would prefer the whole group to be listed as one tab key event, and that the separate bullets can be triggered with the left and right arrow keys.

Suggested solution

For an example, see how this has been handled on the W3 pattern for carousels.

https://www.w3.org/WAI/ARIA/apg/patterns/carousel/examples/carousel-2-tablist/

Alternative

No response

Additional context

No response

Validations

  • Follow our Code of Conduct
  • Read the docs.
  • Check that there isn't already an issue that request the same feature to avoid creating a duplicate.

Would you like to open a PR for this feature?

  • I'm willing to open a PR

Metadata

Metadata

Assignees

No one assigned

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions