twentyhq / twenty

Building a modern alternative to Salesforce, powered by the community.
https://twenty.com
Other
19.83k stars 2.21k forks source link

Add Keyboard Navigation for Custom Field Selection #6954

Closed Bonapara closed 1 month ago

Bonapara commented 1 month ago

Current behavior

When creating a new custom field, the "Text field type" is selected by default on step one (displayed in a darker gray).

image

Desired Behavior

We want to introduce keyboard navigation to clarify why the "Text field" is pre-selected but most importantly to improve the navigation feeling!

Press ⇥ to switch to the next field type Press ⇧⇥ to switch to the previous field type Press ⏎ to select a field type and navigate to step 2

image

Hover should be Background Tertiary and Selected Background Quarternary

https://www.figma.com/design/xt8O9mFeLl46C5InWwoMrN/Twenty?node-id=36855-127361&node-type=FRAME&t=q1mVGIcAsAXgtU4g-11

Bonapara commented 1 month ago

@ehconitin, please comment so I can assign you! (If you still want to handle it🙏)

ehconitin commented 1 month ago

:)