search

jpmorganchase / salt-ds

React UI components built with a focus on accessibility, customization and ease-of-use
https://www.saltdesignsystem.com
Apache License 2.0
127 stars 89 forks source link

[Accessibility Request] Add up/down buttons to move row order for data-grid #2771

Open seanatrinh opened 10 months ago

seanatrinh commented 10 months ago

Area

UI Components

The problem

Currently, data-grid isn't an accessible component when it comes to row-reordering. Right now, you can drag and drop to re-order rows, but there isn't a feature in place to support row-reordering in an accessible manner.

The solution

Adding up/down arrows to re-order rows to make data-grid an accessible component.

Alternatives and examples

Example here: https://www.darins.page/articles/designing-a-reorderable-list-component#:~:text=Those%20button%20labels,to%20our%20users.

Are you a JPMorgan Chase & Co. employee?

joshwooding commented 10 months ago

Hi @seanatrinh, is the example you are talking about the "Drag Row Order" one on this page: https://www.saltdesignsystem.com/salt/components/ag-grid-theme/examples#drag-row-order ?

seanatrinh commented 10 months ago

Hi @joshwooding ! No, that's not the feature I'm requesting. The feature I'm requesting is: instead of dragging and dropping to re-order rows, I want an up & down arrow button to reorder rows.

Reason being drag & drop is not ADA compliant.

Something like this: https://www.darins.page/assets/articles/_1600xAUTO_fit_center-center_none/list-buttons-icons.jpg

joshwooding commented 10 months ago

Hi @joshwooding ! No, that's not the feature I'm requesting. The feature I'm requesting is: instead of dragging and dropping to re-order rows, I want an up & down arrow button to reorder rows.

Reason being drag & drop is not ADA compliant.

Something like this:

https://www.darins.page/assets/articles/_1600xAUTO_fit_center-center_none/list-buttons-icons.jpg

Sorry, I'm trying to figure out what data grid with row drag and drop you're referring to. Was it the one in the link?

seanatrinh commented 10 months ago

Oh my bad, yeah that's the data grid with drag and drop I'm referring to! Sorry, I thought it was called data grid since the package is @salt-ds/data-grid

seanatrinh commented 10 months ago

@joshwooding Just checking in on this request!

Does your team have a SLA on requests like this? Or might a request like this not be taken at all? Trying to figure this out since my team is building a customer facing application that may use this component and since some of the customers are in the US this needs to be ADA compliant. Thanks!