-
Notifications
You must be signed in to change notification settings - Fork 1.6k
Description
When using <ngb-rating> in an RTL layout (e.g., with dir="rtl" on the container or the HTML tag), the keyboard navigation still uses LTR logic --- ArrowRight increases the rating, and ArrowLeft decreases it.
Expected behavior:
In RTL mode, ArrowLeft should increase the rating (i.e., move forward visually), and ArrowRight should decrease it.
Steps to reproduce:
-
Wrap
<ngb-rating>in a container withdir="rtl"(or set the document direction). -
Use the keyboard to interact with the rating using left/right arrow keys.
-
Observe that the keys do not respect RTL expectations.
Why this matters:
This affects usability and accessibility for RTL users, and breaks intuitive keyboard navigation.
Suggested fix:
The rating component should check the computed text direction (e.g., via getComputedStyle(element).direction) and reverse the arrow logic accordingly.
Version:
ng-bootstrap version: 15.0.1Angular version:16.1.2`