From 11b41a93263f439520335ca1ac5995e77adb1e3b Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Tu=C4=9F=C3=A7e=20K=C3=BC=C3=A7=C3=BCko=C4=9Flu?= Date: Wed, 8 Mar 2023 14:28:36 +0300 Subject: [PATCH] Locale paths fixes --- doc/calendar/AccessibilityDoc.vue | 4 ++-- doc/calendar/LocaleDoc.vue | 2 +- doc/carousel/AccessibilityDoc.vue | 12 +++++++----- doc/datatable/AccessibilityDoc.vue | 4 ++-- doc/dataview/AccessibilityDoc.vue | 2 +- doc/dialog/AccessibilityDoc.vue | 4 ++-- doc/galleria/AccessibilityDoc.vue | 15 +++++++++------ doc/image/AccessibilityDoc.vue | 4 ++-- doc/inlinemessage/AccessibilityDoc.vue | 4 ++-- doc/menubar/AccessibilityDoc.vue | 4 ++-- doc/message/AccessibilityDoc.vue | 4 ++-- doc/multiselect/AccessibilityDoc.vue | 4 ++-- doc/orderlist/AccessibilityDoc.vue | 4 ++-- doc/paginator/AccessibilityDoc.vue | 11 +++++++---- doc/picklist/AccessibilityDoc.vue | 6 +++--- doc/rating/AccessibilityDoc.vue | 2 +- doc/scrolltop/AccessibilityDoc.vue | 4 ++-- doc/toast/AccessibilityDoc.vue | 4 ++-- doc/tristatecheckbox/AccessibilityDoc.vue | 2 +- 19 files changed, 52 insertions(+), 44 deletions(-) diff --git a/doc/calendar/AccessibilityDoc.vue b/doc/calendar/AccessibilityDoc.vue index cff031a6b..0ce8c9ca4 100644 --- a/doc/calendar/AccessibilityDoc.vue +++ b/doc/calendar/AccessibilityDoc.vue @@ -7,8 +7,8 @@

The optional calendar button requires includes aria-haspopup, aria-expanded for states along with aria-controls to define the relation between the popup and the button. The value to read is retrieved from the - chooseDate key of the aria property from the locale API. This label is also used for the aria-label of the popup as well. When there is a value selected, it is formatted and appended to the - label to be able to notify users about the current value. + chooseDate key of the aria property from the locale API. This label is also used for the aria-label of the popup as well. When there is a value selected, it is formatted and + appended to the label to be able to notify users about the current value.

diff --git a/doc/calendar/LocaleDoc.vue b/doc/calendar/LocaleDoc.vue index 5cb769b41..1bf69abe9 100644 --- a/doc/calendar/LocaleDoc.vue +++ b/doc/calendar/LocaleDoc.vue @@ -1,5 +1,5 @@ diff --git a/doc/carousel/AccessibilityDoc.vue b/doc/carousel/AccessibilityDoc.vue index 23f061c77..e6c3973af 100644 --- a/doc/carousel/AccessibilityDoc.vue +++ b/doc/carousel/AccessibilityDoc.vue @@ -7,16 +7,18 @@

- A slide has a group role with an aria-label that refers to the aria.slideNumber property of the locale API. Similarly aria.slide is used as the aria-roledescription of the - item. Inactive slides are hidden from the readers with aria-hidden. + A slide has a group role with an aria-label that refers to the aria.slideNumber property of the locale API. Similarly aria.slide is used as the + aria-roledescription of the item. Inactive slides are hidden from the readers with aria-hidden.

- Next and Previous navigators are button elements with aria-label attributes referring to the aria.prevPageLabel and aria.nextPageLabel properties of the locale API by default - respectively, you may still use your own aria roles and attributes as any valid attribute is passed to the button elements implicitly by using nextButtonProps and prevButtonProps. + Next and Previous navigators are button elements with aria-label attributes referring to the aria.prevPageLabel and aria.nextPageLabel properties of the locale API by + default respectively, you may still use your own aria roles and attributes as any valid attribute is passed to the button elements implicitly by using nextButtonProps and prevButtonProps.

-

Quick navigation elements are button elements with an aria-label attribute referring to the aria.pageLabel of the locale API. Current page is marked with aria-current.

+

+ Quick navigation elements are button elements with an aria-label attribute referring to the aria.pageLabel of the locale API. Current page is marked with aria-current. +

Next/Prev Keyboard Support

diff --git a/doc/datatable/AccessibilityDoc.vue b/doc/datatable/AccessibilityDoc.vue index db2d8d732..3f520ef4b 100644 --- a/doc/datatable/AccessibilityDoc.vue +++ b/doc/datatable/AccessibilityDoc.vue @@ -9,12 +9,12 @@

Built-in checkbox and radiobutton components for row selection use checkbox and radiobutton. The label to describe them is retrieved from the aria.selectRow and aria.unselectRow properties of the - locale API. Similarly header checkbox uses selectAll and unselectAll keys. When a row is selected, aria-selected is set to true on a row. + locale API. Similarly header checkbox uses selectAll and unselectAll keys. When a row is selected, aria-selected is set to true on a row.

The element to expand or collapse a row is a button with aria-expanded and aria-controls properties. Value to describe the buttons is derived from aria.expandRow and aria.collapseRow properties of the - locale API. + locale API.

diff --git a/doc/dataview/AccessibilityDoc.vue b/doc/dataview/AccessibilityDoc.vue index 2add35c54..d3d64263a 100644 --- a/doc/dataview/AccessibilityDoc.vue +++ b/doc/dataview/AccessibilityDoc.vue @@ -3,7 +3,7 @@

Screen Reader

The container element that wraps the layout options buttons has a group role whereas each button element uses button role and aria-pressed is updated depending on selection state. Values to describe the buttons are - derived from the aria.listView and aria.gridView properties of the locale API respectively. + derived from the aria.listView and aria.gridView properties of the locale API respectively.

Refer to paginator accessibility documentation for the paginator of the component.

diff --git a/doc/dialog/AccessibilityDoc.vue b/doc/dialog/AccessibilityDoc.vue index ae95f7906..4b5d9a99d 100644 --- a/doc/dialog/AccessibilityDoc.vue +++ b/doc/dialog/AccessibilityDoc.vue @@ -7,8 +7,8 @@

Trigger element also requires aria-expanded and aria-controls to be handled explicitly.

- Close element is a button with an aria-label that refers to the aria.close property of the locale API by default, you may use closeButtonProps to customize the element and - override the default aria-label. + Close element is a button with an aria-label that refers to the aria.close property of the locale API by default, you may use closeButtonProps to customize the + element and override the default aria-label.

diff --git a/doc/galleria/AccessibilityDoc.vue b/doc/galleria/AccessibilityDoc.vue index eea565c1e..8794bbeab 100644 --- a/doc/galleria/AccessibilityDoc.vue +++ b/doc/galleria/AccessibilityDoc.vue @@ -7,21 +7,24 @@

- A slide has a group role with an aria-label that refers to the aria.slideNumber property of the locale API. Similarly aria.slide is used as the aria-roledescription of the - item. Inactive slides are hidden from the readers with aria-hidden. + A slide has a group role with an aria-label that refers to the aria.slideNumber property of the locale API. Similarly aria.slide is used as the + aria-roledescription of the item. Inactive slides are hidden from the readers with aria-hidden.

- Next and Previous navigators are button elements with aria-label attributes referring to the aria.prevPageLabel and aria.nextPageLabel properties of the locale API by default - respectively, you may still use your own aria roles and attributes as any valid attribute is passed to the button elements implicitly by using nextButtonProps and prevButtonProps. + Next and Previous navigators are button elements with aria-label attributes referring to the aria.prevPageLabel and aria.nextPageLabel properties of the locale API by + default respectively, you may still use your own aria roles and attributes as any valid attribute is passed to the button elements implicitly by using nextButtonProps and prevButtonProps.

Quick navigation elements and thumnbails follow the tab pattern. They are placed inside an element with a tablist role whereas each item has a tab role with aria-selected and aria-controls attributes. The - aria-label attribute of a quick navigation item refers to the aria.pageLabel of the locale API. Current page is marked with aria-current. + aria-label attribute of a quick navigation item refers to the aria.pageLabel of the locale API. Current page is marked with aria-current.

-

In full screen mode, modal element uses dialog role with aria-modal enabled. The close button retrieves aria-label from the aria.close property of the locale API.

+

+ In full screen mode, modal element uses dialog role with aria-modal enabled. The close button retrieves aria-label from the aria.close property of the + locale API. +

Next/Prev Keyboard Support

diff --git a/doc/image/AccessibilityDoc.vue b/doc/image/AccessibilityDoc.vue index 03a6d45a0..b75a2a806 100644 --- a/doc/image/AccessibilityDoc.vue +++ b/doc/image/AccessibilityDoc.vue @@ -2,13 +2,13 @@

Screen Reader

- The preview button is a native button element with an aria-label that refers to the aria.zoomImage property of the locale API by default, with previewButtonProps + The preview button is a native button element with an aria-label that refers to the aria.zoomImage property of the locale API by default, with previewButtonProps you may use your own aria roles and attributes as any valid attribute is passed to the button element implicitly.

When preview is active, dialog role with aria-modal is applied to the overlay image container.

-

Button controls use aria.rotateRight, aria.rotateLeft, aria.zoomIn, aria.zoomOut and aria.close from the locale API as aria-label.

+

Button controls use aria.rotateRight, aria.rotateLeft, aria.zoomIn, aria.zoomOut and aria.close from the locale API as aria-label.

ButtonBar Keyboard Support

When preview is activated, close button receives the initial focus.

diff --git a/doc/inlinemessage/AccessibilityDoc.vue b/doc/inlinemessage/AccessibilityDoc.vue index 9c5d648cb..74c7bfdf6 100644 --- a/doc/inlinemessage/AccessibilityDoc.vue +++ b/doc/inlinemessage/AccessibilityDoc.vue @@ -7,8 +7,8 @@

- Close element is a button with an aria-label that refers to the aria.close property of the locale API by default, you may use closeButtonProps to customize the element and - override the default aria-label. + Close element is a button with an aria-label that refers to the aria.close property of the locale API by default, you may use closeButtonProps to customize the + element and override the default aria-label.

Close Button Keyboard Support

diff --git a/doc/menubar/AccessibilityDoc.vue b/doc/menubar/AccessibilityDoc.vue index 7158ea21b..8c16b8f01 100644 --- a/doc/menubar/AccessibilityDoc.vue +++ b/doc/menubar/AccessibilityDoc.vue @@ -9,8 +9,8 @@

In mobile viewports, a menu icon appears with a button role along with aria-haspopup, aria-expanded and aria-controls to manage the relation between the overlay menubar and the button. The value to describe the - button can be defined aria-label or aria-labelledby specified using buttonProps, by default navigation key of the aria property from the locale API as the - aria-label. + button can be defined aria-label or aria-labelledby specified using buttonProps, by default navigation key of the aria property from the locale API + as the aria-label.

Keyboard Support

diff --git a/doc/message/AccessibilityDoc.vue b/doc/message/AccessibilityDoc.vue index 9c5d648cb..74c7bfdf6 100644 --- a/doc/message/AccessibilityDoc.vue +++ b/doc/message/AccessibilityDoc.vue @@ -7,8 +7,8 @@

- Close element is a button with an aria-label that refers to the aria.close property of the locale API by default, you may use closeButtonProps to customize the element and - override the default aria-label. + Close element is a button with an aria-label that refers to the aria.close property of the locale API by default, you may use closeButtonProps to customize the + element and override the default aria-label.

Close Button Keyboard Support

diff --git a/doc/multiselect/AccessibilityDoc.vue b/doc/multiselect/AccessibilityDoc.vue index 76b864138..9f3f5b1ed 100644 --- a/doc/multiselect/AccessibilityDoc.vue +++ b/doc/multiselect/AccessibilityDoc.vue @@ -9,12 +9,12 @@

Checkbox component at the header uses a hidden native checkbox element internally that is only visible to screen readers. Value to read is defined with the selectAll and unselectAll keys of the aria property from the - locale API. + locale API.

If filtering is enabled, filterInputProps can be defined to give aria-* props to the input element.

-

Close button uses close key of the aria property from the locale API as the aria-label by default, this can be overriden with the closeButtonProps.

+

Close button uses close key of the aria property from the locale API as the aria-label by default, this can be overriden with the closeButtonProps.

diff --git a/doc/orderlist/AccessibilityDoc.vue b/doc/orderlist/AccessibilityDoc.vue index 178b8eca7..814dd84e4 100644 --- a/doc/orderlist/AccessibilityDoc.vue +++ b/doc/orderlist/AccessibilityDoc.vue @@ -7,8 +7,8 @@

Controls buttons are button elements with an aria-label that refers to the aria.moveTop, aria.moveUp, aria.moveDown and aria.moveBottom properties of the - locale API by default, alternatively you may use moveTopButtonProps, moveUpButtonProps, moveDownButtonProps and moveBottomButtonProps to customize the buttons like overriding - the default aria-label attributes. + locale API by default, alternatively you may use moveTopButtonProps, moveUpButtonProps, moveDownButtonProps and moveBottomButtonProps to customize the buttons + like overriding the default aria-label attributes.

diff --git a/doc/paginator/AccessibilityDoc.vue b/doc/paginator/AccessibilityDoc.vue index cb6fd7a07..c063dcaac 100644 --- a/doc/paginator/AccessibilityDoc.vue +++ b/doc/paginator/AccessibilityDoc.vue @@ -5,21 +5,24 @@

First, previous, next and last page navigators elements with aria-label attributes referring to the aria.firstPageLabel, aria.prevPageLabel, aria.nextPageLabel and aria.lastPageLabel properties of the - locale API respectively. + locale API respectively.

-

Page links are also button elements with an aria-label attribute derived from the aria.pageLabel of the locale API. Current page is marked with aria-current set to "page" as well.

+

+ Page links are also button elements with an aria-label attribute derived from the aria.pageLabel of the locale API. Current page is marked with aria-current set to + "page" as well. +

Current page report uses aria-live="polite" to instruct screen reader about the changes to the pagination state.

Rows per page dropdown internally uses a dropdown component, refer to the dropdown documentation for accessibility details. Additionally, the dropdown uses an aria-label from the - aria.rowsPerPageLabel property of the locale API. + aria.rowsPerPageLabel property of the locale API.

Jump to page input is an input element with an aria-label that refers to the aria.jumpToPageInputLabel property and jump to page dropdown internally uses a dropdown component, with an aria-label that refers to - the aria.jumpToPageDropdownLabel property of the locale API. + the aria.jumpToPageDropdownLabel property of the locale API.

Keyboard Support

diff --git a/doc/picklist/AccessibilityDoc.vue b/doc/picklist/AccessibilityDoc.vue index 34fcdbb5d..59bc9d2d4 100644 --- a/doc/picklist/AccessibilityDoc.vue +++ b/doc/picklist/AccessibilityDoc.vue @@ -7,9 +7,9 @@

Controls buttons are button elements with an aria-label that refers to the aria.moveTop, aria.moveUp, aria.moveDown, aria.moveBottom,aria.moveToTarget, aria.moveAllToTarget, - aria.moveToSource and aria.moveAllToSource properties of the locale API by default, alternatively you may use moveTopButtonProps, moveUpButtonProps, moveDownButtonProps, - moveToButtonProps, moveAllToButtonProps, moveFromButtonProps, moveFromButtonProps moveAllFromButtonProps moveToTargetProps, moveAllToTargetProps, moveToSourceProps and - moveAllToSourceProps to customize the buttons like overriding the default aria-label attributes. + aria.moveToSource and aria.moveAllToSource properties of the locale API by default, alternatively you may use moveTopButtonProps, moveUpButtonProps, + moveDownButtonProps, moveToButtonProps, moveAllToButtonProps, moveFromButtonProps, moveFromButtonProps moveAllFromButtonProps moveToTargetProps, moveAllToTargetProps, + moveToSourceProps and moveAllToSourceProps to customize the buttons like overriding the default aria-label attributes.

diff --git a/doc/rating/AccessibilityDoc.vue b/doc/rating/AccessibilityDoc.vue index 17fdc4031..9f14ff082 100644 --- a/doc/rating/AccessibilityDoc.vue +++ b/doc/rating/AccessibilityDoc.vue @@ -2,7 +2,7 @@

Screen Reader

- Rating component internally uses radio buttons that are only visible to screen readers. The value to read for item is retrieved from the locale API via star and stars of the + Rating component internally uses radio buttons that are only visible to screen readers. The value to read for item is retrieved from the locale API via star and stars of the aria property.

diff --git a/doc/scrolltop/AccessibilityDoc.vue b/doc/scrolltop/AccessibilityDoc.vue index ce120aa71..400be6a6e 100644 --- a/doc/scrolltop/AccessibilityDoc.vue +++ b/doc/scrolltop/AccessibilityDoc.vue @@ -2,8 +2,8 @@

Screen Reader

- ScrollTop uses a button element with an aria-label that refers to the aria.scrollTop property of the locale API by default, you may use your own aria roles and attributes as any valid - attribute is passed to the button element implicitly. + ScrollTop uses a button element with an aria-label that refers to the aria.scrollTop property of the locale API by default, you may use your own aria roles and attributes as + any valid attribute is passed to the button element implicitly.

Keyboard Support

diff --git a/doc/toast/AccessibilityDoc.vue b/doc/toast/AccessibilityDoc.vue index 7c4fa4d4c..8f0ccab7b 100644 --- a/doc/toast/AccessibilityDoc.vue +++ b/doc/toast/AccessibilityDoc.vue @@ -4,8 +4,8 @@

Toast component use alert role that implicitly defines aria-live as "assertive" and aria-atomic as "true".

- Close element is a button with an aria-label that refers to the aria.close property of the locale API by default, you may use closeButtonProps to customize the element and - override the default aria-label. + Close element is a button with an aria-label that refers to the aria.close property of the locale API by default, you may use closeButtonProps to customize the + element and override the default aria-label.

Close Button Keyboard Support

diff --git a/doc/tristatecheckbox/AccessibilityDoc.vue b/doc/tristatecheckbox/AccessibilityDoc.vue index 7b80e8d81..e9fe89c12 100644 --- a/doc/tristatecheckbox/AccessibilityDoc.vue +++ b/doc/tristatecheckbox/AccessibilityDoc.vue @@ -4,7 +4,7 @@

TriStateCheckbox component uses an element with checkbox role. Value to describe the component can either be provided with aria-labelledby or aria-label props. Component adds an element with aria-live attribute that is only visible to screen readers to read the value displayed. Values to read are defined with the trueLabel, falseLabel and nullLabel keys of the aria property from the - locale API. This is an example of a custom accessibility implementation as there is no one to one mapping between the component design and the WCAG specification. + locale API. This is an example of a custom accessibility implementation as there is no one to one mapping between the component design and the WCAG specification.