Keyboard support for palette entries

[pinussilvestrus]

This makes the palette entries actual buttons so they can be controlled via keyboard. Additionally, this adds an Enter shortcut to the entries so one can add new form fields to the bottom of the form.

Closes #536

• This PR adds a new form-js element or visually changes an existing component.
  • => In that case, we need to ensure we follow up on this, e.g. by creating an issue in Tasklist

[pinussilvestrus]

The screencast is a bit misleading (focus border), seems like my screencast app is having some graphic troubles. It should work as expected in the demo.

[vsgoulart]

works well for me

does it maybe make sense to add support in this PR to delete items from the form when focuses and the user presses delete?

[pinussilvestrus]

For the delete via keyboard we had another PR that was blocked by a core issue: #438. I have to double-check whether this affects this PR as well. I will test this one with the Desktop Modeler.

[vsgoulart]

@pinussilvestrus the visual regression tests failed, were the changes intentional?

[pinussilvestrus]

Should not, I will have a look

[pinussilvestrus]

For the delete via keyboard we had another PR that was blocked by a core issue: #438. I have to double-check whether this affects this PR as well. I will test this one with the Desktop Modeler.

Works as expected 👍 I will handle the deletion shortcut separately still, as the PR is already open. Good candidate for spring cleaning as well.

[pinussilvestrus]

@volodymyr-melnykc @vsgoulart The failing visual regression test is because the icons are 1px moved compared to the previous version.

I tried a few things to mitigate that, but it didn't work for all browsers reliably. I could take more time to fix this, but honestly, I'm not sure whether it's worth the time, as it doesn't look better or worse the other way around, in my opinion.

Let me know what you think; if we are fine with the 1px change, I will update the screenshots to make the tests green.

For comparison the new state (moving the diff-line from Playwright to the right). For me it even seems like the new state looks more centered.

[volodymyr-melnykc]

@pinussilvestrus It's ok for me! And yes, the new state (when the diff-line is moved to the right) looks more centered.