Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[docs] Small changes to standardize acessibility section for Data Grid and Tree View #13224

Closed
wants to merge 10 commits into from
Closed

[docs] Small changes to standardize acessibility section for Data Grid and Tree View #13224

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
10 commits
Select commit Hold shift + click to select a range
62eb110
Adds complementary info about macOS key replacement
May 23, 2024
b835802
removes mentions on keys that MIGHT not be available on MacOS
May 23, 2024
6bdd326
[TreeView] Allow to define indentation at the item level (#13126)
flaviendelangle May 23, 2024
3d0b3e8
Adds complementary info about macOS key replacement
May 23, 2024
201fe19
removes mentions on keys that MIGHT not be available on MacOS
May 23, 2024
bc4f075
Merge branch 'docs/tree-view-data-grid-a11y-nitpicks' of github.com:a…
May 23, 2024
05c8546
Adds complementary info about macOS key replacement
May 23, 2024
2999b22
Merge branch 'docs/tree-view-data-grid-a11y-nitpicks' of github.com:a…
May 23, 2024
1b65e37
Merge remote-tracking branch 'upstream/master' into docs/tree-view-da…
May 24, 2024
a1c320f
Revert "Adds complementary info about macOS key replacement"
May 24, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
14 changes: 10 additions & 4 deletions docs/data/data-grid/accessibility/accessibility.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -106,17 +106,23 @@ renderCell: (params) => (

### Navigation

:::info
The following key assignments apply to Windows and Linux users.

On macOS:
On macOS replace:

- replace <kbd class="key">Ctrl</kbd> with <kbd class="key">⌘ Command</kbd>
- replace <kbd class="key">Alt</kbd> with <kbd class="key">⌥ Option</kbd>
- <kbd class="key">Ctrl</kbd> with <kbd class="key">⌘ Command</kbd>
- <kbd class="key">Alt</kbd> with <kbd class="key">⌥ Option</kbd>
- <kbd class="key">Home</kbd> with <kbd class="key">fn</kbd>+<kbd class="key">Arrow Left</kbd>
- <kbd class="key">End</kbd> with <kbd class="key">fn</kbd>+<kbd class="key">Arrow Right</kbd>
- <kbd class="key">Page Up</kbd> with <kbd class="key">fn</kbd>+<kbd class="key">Arrow Up</kbd>
- <kbd class="key">Page Down</kbd> with <kbd class="key">fn</kbd>+<kbd class="key">Arrow Down</kbd>
:::

| Keys | Description |
| -----------------------------------------------------------------: | :---------------------------------------------------------- |
| <kbd class="key">Arrow Left</kbd> | Navigate between cell elements |
| <kbd class="key">Arrow Bottom</kbd> | Navigate between cell elements |
| <kbd class="key">Arrow Down</kbd> | Navigate between cell elements |
Copy link
Member

@flaviendelangle flaviendelangle May 23, 2024 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The famous "Arrow Bottom" 😆

| <kbd class="key">Arrow Right</kbd> | Navigate between cell elements |
| <kbd class="key">Arrow Up</kbd> | Navigate between cell elements |
| <kbd class="key">Home</kbd> | Navigate to the first cell of the current row |
Expand Down
6 changes: 4 additions & 2 deletions docs/data/tree-view/accessibility/accessibility.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -31,8 +31,10 @@ The [WAI-ARIA Authoring Practices](https://www.w3.org/WAI/ARIA/apg/patterns/tree
:::info
The following key assignments apply to Windows and Linux users.

On macOS replace <kbd class="key">Ctrl</kbd> with <kbd class="key">⌘ Command</kbd>.

On macOS replace:
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm not sure how correct we are here. 🤔
Those keys definitely exist on MacOS and their keyboards:
https://store.storeimages.cdn-apple.com/4982/as-images.apple.com/is/MQ052?wid=2000&hei=2000&fmt=jpeg&qlt=95&.v=1495129815011
It's only MacBooks with their limited amount of keys or any other keyboard with less keys, which remove less often used keys. 🤔
So, technically, with this we are educating users about MacOS shortcuts for keys that they MIGHT not have on their keyboard.
I'm not saying that we can't do it. Just questioning if maybe we could put a bit less emphasis on it and instead only link to a MacOS keyboard shortcut page? 🤔

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Makes total sense for me, I confess I had the idea to add it based on my personal experience with the macbook and didn't consider other MacOS devices.
Maybe we could divide it into 2 info dialogs:

  • for keys that are necessarily different, like command
  • for keys that might be different, like pageUp
    The second one could have a sentence briefly mentioning that some devices might demand the usage of equivalent key combinations, WDYT ?

Anyways, we can split the PR: I will remove those mentions on this PR and let only the small corrections that don't rely on it, while we continue the discussion :)

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It makes sense, we can definitely put those additions as improvements that would have less emphasis than actually different buttons. 👍

- <kbd class="key">Ctrl</kbd> with <kbd class="key">⌘ Command</kbd>.
- <kbd class="key">Home</kbd> with <kbd class="key">fn</kbd>+<kbd class="key">Arrow Left</kbd>
- <kbd class="key">End</kbd> with <kbd class="key">fn</kbd>+<kbd class="key">Arrow Right</kbd>
:::

| Keys | Description |
Expand Down