InputNumber: Pressing Enter Key should also take CSS just like Spacebar Key does.

[Sumeet-2023]

Describe the bug

While Pressing on increment or decrement button in InputNumber using Keys like Enter should also take CSS just like Spacebar. CSS should look uniform if user uses Spacebar/Enter Key on Keyboard based navigation.

Reproducer

https://stackblitz.com/edit/vitejs-vite-pcimsn?file=src%2FApp.tsx

System Information

PrimeReact: 10.8.2
React: 18.2.0
Browser: Chrome

Steps to reproduce the behavior

1. Open the Stackblitz link.
2. Try to increment using mouse so that button gets focus.
3. Move the cursor away from buttons so that its not in hover state.
4. Try to increment/decrement using Enter Key and later try with Spacebar.

Expected behavior

Same CSS styles should take place on using both Keys.

[melloware]

I think there might be a different way to approach this. The Hover style should definitely not be applied if you are not hovering as that is a mouse only style. The "active" style could be applied.

Also all theme changes should be submitted here: https://github.com/primefaces/primereact-sass-theme and not made directly in the CSS files.

[Sumeet-2023]

Sorry if i couldn't describe my issue properly. I mentioned :hover because mouse was used to ':focus' on button. Once button gets focused one should remove hover effect so that :active state can be easily distinguished and later user pressing on Enter Key can see CSS is not been applied. I meant to say if user clicks on increment or decrement using Enter key then :active CSS should take place but it doesn't happens cause Enter Key is treated as click event which is not same as Spacebar(Considered as press-and-hold behavior).