From f5242611a3acec0fdb4271276d29727dce3ced99 Mon Sep 17 00:00:00 2001 From: saptaksengupta Date: Fri, 26 Jun 2020 21:27:32 +0530 Subject: [PATCH 1/3] docs: accessibility info added for clink component accessibility.md file added to brief the basic introductions on accessibility of CLink component --- .../chakra-ui-core/src/CLink/accessibility.md | 24 +++++++++++++++++++ 1 file changed, 24 insertions(+) create mode 100644 packages/chakra-ui-core/src/CLink/accessibility.md diff --git a/packages/chakra-ui-core/src/CLink/accessibility.md b/packages/chakra-ui-core/src/CLink/accessibility.md new file mode 100644 index 00000000..ddcdcab8 --- /dev/null +++ b/packages/chakra-ui-core/src/CLink/accessibility.md @@ -0,0 +1,24 @@ +# Link | Accessibility ♿️ + +This report is adapted to list the [WAI-ARIA Authoring practices for alert dialogs](https://www.w3.org/TR/wai-aria-practices-1.2/#link) supported by Chakra UI for the `CLink` component. + +### Description +A link widget provides an interactive reference to a resource. The target resource can be either external or local, i.e., either outside or within the current page or application. + +#### Components +`@chakra-ui/vue` exports 1 checkbox related components: +- `CLink` + +### `CLink` Keyboard Interaction +- [x] **`Enter`**: Executes the link and moves focus to the link target. +- [x] **`Shift + F10 (Optional)`**: Opens a context menu for the link. + + +### `CLink` WAI-ARIA compliance +The element containing the link text or graphic has role of link. +Links are accessible elements used primarily for navigation. This component is styled to resemble a hyperlink and semantically renders an . + +The `CLink` component composes `CPseudoBox`, so you can pass all `CPseudoBox` props + + +Noticed a bug or inconsistency with this component? [Open an issue](https://github.com/chakra-ui/chakra-ui-vue/issues/new/choose) \ No newline at end of file From c276296bdaa639045994426fbed3ab3bd5ae9a4a Mon Sep 17 00:00:00 2001 From: Saptak Sengupta Date: Sat, 27 Jun 2020 15:03:16 +0530 Subject: [PATCH 2/3] update accessibility.md added quotes to render an '' tag in WAI-ARIA compliance --- packages/chakra-ui-core/src/CLink/accessibility.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/chakra-ui-core/src/CLink/accessibility.md b/packages/chakra-ui-core/src/CLink/accessibility.md index ddcdcab8..8b008550 100644 --- a/packages/chakra-ui-core/src/CLink/accessibility.md +++ b/packages/chakra-ui-core/src/CLink/accessibility.md @@ -16,9 +16,9 @@ A link widget provides an interactive reference to a resource. The target resour ### `CLink` WAI-ARIA compliance The element containing the link text or graphic has role of link. -Links are accessible elements used primarily for navigation. This component is styled to resemble a hyperlink and semantically renders an . +Links are accessible elements used primarily for navigation. This component is styled to resemble a hyperlink and semantically renders an ``. The `CLink` component composes `CPseudoBox`, so you can pass all `CPseudoBox` props -Noticed a bug or inconsistency with this component? [Open an issue](https://github.com/chakra-ui/chakra-ui-vue/issues/new/choose) \ No newline at end of file +Noticed a bug or inconsistency with this component? [Open an issue](https://github.com/chakra-ui/chakra-ui-vue/issues/new/choose) From 9e2eeb1ceb5fa2e840ba878e686b73edf588d7bc Mon Sep 17 00:00:00 2001 From: Saptak Sengupta Date: Sat, 27 Jun 2020 16:30:43 +0530 Subject: [PATCH 3/3] update accessibility.md keyboard interaction removed as that was optional in nature. --- packages/chakra-ui-core/src/CLink/accessibility.md | 2 -- 1 file changed, 2 deletions(-) diff --git a/packages/chakra-ui-core/src/CLink/accessibility.md b/packages/chakra-ui-core/src/CLink/accessibility.md index 8b008550..29e53f3f 100644 --- a/packages/chakra-ui-core/src/CLink/accessibility.md +++ b/packages/chakra-ui-core/src/CLink/accessibility.md @@ -11,8 +11,6 @@ A link widget provides an interactive reference to a resource. The target resour ### `CLink` Keyboard Interaction - [x] **`Enter`**: Executes the link and moves focus to the link target. -- [x] **`Shift + F10 (Optional)`**: Opens a context menu for the link. - ### `CLink` WAI-ARIA compliance The element containing the link text or graphic has role of link.