angular / angular/components

feat(cdk/drag-drop): Proposal for Keyboard and Screenreader Accessibility

オープン
#25,468 コメント 7 件 リアクション 19 件 担当者 0 名 GitHub で見る
area: cdk/drag-drop feature P3
主要言語
TypeScript
スター
25k
フォーク
6.8k
平均マージ
1日 8時間
マージ済み PR(30日)
91

説明

### Feature Description

Hello everyone,

Accessibility is nowadays a very important topic and therefore I think it is essential to get as much work as possible done directly in the framework. Therefore is my proposal to make the Angular CDK Drag and Drop accessible to everyone! My ideas so far

- Reusing as much code as possible (maybe renaming the functions if selected)
- Adding aria roles if necessary
- tabindex to all grabbable items
- Space to activate moving by keyboard (then activly moving by arrow keys with small movement). Further ideas/improvement: movement to fix containers or movement by bigger (user defined) steps!
- Escape to quit movement
- Implementation according to https://www.w3.org/wiki/PF/ARIA/BestPractices/DragDrop

First Code proposal (Please don't look to specific, is my first proposal, Improvements needed):
https://github.com/angular/components/commit/1c50475095a7ecf3c1f142c820d3f5a71f0070b8

Is is meaningful to do more work on it? Please be so kind and share your meanings with me!

Best regards,

Martin

### Use Case

Drag and Drop Accessibility!

コントリビューションガイド

コントリビューションガイドを開く

調査の方向性

Angular CDK Drag and Drop のエントリーポイントから始め、リンクされたコード提案を W3C ARIA DragDrop のベストプラクティスと併せて確認します。実装とテストの範囲を特定する前に、キーボード、スクリーンリーダー、フォーカス、移動について受け入れる動作を明確にします。完了とは、合意されたアクセシビリティ設計と、提案されたインタラクションの動作検証が済んでいることを意味します。

索引モデルが issue の本文から書いたものです。

評価

技術スタック
angular, typescript
領域
accessibility, frontend
issue の種類
機能追加
難易度
5/5
見積もり時間
1週間以上
活発さ
静か
明瞭さ
説明が足りない
初心者へのやさしさ
30/100

新しい issue をメールで受け取る

初心者向けの GitHub issue を短くまとめたダイジェスト。