[Rate] component not working properly on mobile

[Davidwalser]

What version of rsuite are you using?

5.17.1

What version of React are you using?

18.2.0

What version of TypeScript are you using (if any)?

4.8.2

What browser are you using?

Chrome, Firefox

Describe the Bug

Chrome Desktop

Working with Rate on Desktop (Chrome) is working fine!

Chrome Mobile

When clicking the rate (in this case smileys, but also tested with default stars), the rate component is not working as expected:
When you click on the rate on the UI (e.g. first) it displays the right state, but not actually firing the onChange event.
On the second click on the same rate (e.g. first), it still displays the same state on the UI but this time also firing the onChange event.

So tl:dr the rate component only updates on the second click, but somehow still displays some state on the UI.

Firefox (Desktop & Mobile)

On firefox it seems like it is generally broken, only updating the state after clicking more than just twice.

Expected Behavior

Rate component should display the right state and handling the onChange at the same time, not just at the second click.
It should work the same as on Chrome desktop view.

To Reproduce

• first click on first smiley -> component displays right state, but is not firing onChange (display ok, onChange not ok)

• second click on first smiley -> component still displaying the right state and is firing onChange (display ok, onChnage ok)

• click on second smiley -> component displaying wrong state (no smiley) and is firing onChange (set to 0) (display wrong, onClick wrong)

• click on second smiley -> component displays right state, but is not firing onChange (display ok, onChange wrong)

• another click on second smiley -> component displays right state and firing onChange (display ok, onChange wrong)

[Davidwalser]

With onChangeActive it is working on mobile, but that is not what is needed on Desktop