From d19482118aac3fdee499f63bd0933fb7623236e7 Mon Sep 17 00:00:00 2001 From: Gabriel Donadel Dall'Agnol Date: Mon, 7 Nov 2022 00:41:36 -0300 Subject: [PATCH 1/4] feat: Add aria Web props to component docs --- docs/text.md | 58 +++++++++++++++++ docs/touchablewithoutfeedback.md | 92 +++++++++++++++++++++++++++ docs/view.md | 103 ++++++++++++++++++++++++++++++- 3 files changed, 250 insertions(+), 3 deletions(-) diff --git a/docs/text.md b/docs/text.md index 2fe4b519815..f461be822ea 100644 --- a/docs/text.md +++ b/docs/text.md @@ -376,6 +376,64 @@ Sets the frequency of automatic hyphenation to use when determining word breaks --- +### `aria-busy` + +Indicates an element is being modified and that assistive technologies may want to wait until the changes are complete before informing the user about the update. + +| Type | Default | +| ------- | ------- | +| boolean | false | + +--- + +### `aria-checked` + +Indicates the state of a checkable element. This field can either take a boolean or the "mixed" string to represent mixed checkboxes. + +| Type | Default | +| ---------------- | ------- | +| boolean, 'mixed' | false | + +--- + +### `aria-disabled` + +Indicates that the element is perceivable but disabled, so it is not editable or otherwise operable. + +| Type | Default | +| ------- | ------- | +| boolean | false | + +--- + +### `aria-expanded` + +Indicates whether an expandable element is currently expanded or collapsed. + +| Type | Default | +| ------- | ------- | +| boolean | false | + +--- + +### `aria-label` + +Defines a string value that labels an interactive element. + +| Type | +| ------ | +| string | + +--- + +### `aria-selected` + +Indicates whether a selectable element is currently selected or not. + +| Type | +| ------- | +| boolean | + ### `dataDetectorType`
Android
Determines the types of data converted to clickable URLs in the text element. By default, no data types are detected. diff --git a/docs/touchablewithoutfeedback.md b/docs/touchablewithoutfeedback.md index 9d021ed5bb2..f2326096c4e 100644 --- a/docs/touchablewithoutfeedback.md +++ b/docs/touchablewithoutfeedback.md @@ -195,6 +195,98 @@ See the [Accessibility guide](accessibility.md#accessibility-actions) for more i --- +'aria-selected'?: ?boolean, + +### `aria-busy` + +Indicates an element is being modified and that assistive technologies may want to wait until the changes are complete before informing the user about the update. + +| Type | Default | +| ------- | ------- | +| boolean | false | + +--- + +### `aria-checked` + +Indicates the state of a checkable element. This field can either take a boolean or the "mixed" string to represent mixed checkboxes. + +| Type | Default | +| ---------------- | ------- | +| boolean, 'mixed' | false | + +--- + +### `aria-disabled` + +Indicates that the element is perceivable but disabled, so it is not editable or otherwise operable. + +| Type | Default | +| ------- | ------- | +| boolean | false | + +--- + +### `aria-expanded` + +Indicates whether an expandable element is currently expanded or collapsed. + +| Type | Default | +| ------- | ------- | +| boolean | false | + +--- + +### `aria-hidden` + +Indicates whether the accessibility elements contained within this accessibility element are hidden. + +For example, in a window that contains sibling views `A` and `B`, setting `aria-hidden` to `true` on view `B` causes VoiceOver to ignore the elements in the view `B`. + +| Type | Default | +| ------- | ------- | +| boolean | false | + +--- + +### `aria-label` + +Defines a string value that labels an interactive element. + +| Type | +| ------ | +| string | + +--- + +### `aria-live`
Android
+ +Indicates that an element will be updated, and describes the types of updates the user agents, assistive technologies, and user can expect from the live region. + +- **off** Accessibility services should not announce changes to this view. +- **polite** Accessibility services should announce changes to this view. +- **assertive** Accessibility services should interrupt ongoing speech to immediately announce changes to this view. + +--- + +### `aria-modal`
iOS
+ +Boolean value indicating whether VoiceOver should ignore the elements within views that are siblings of the receiver. Has precedence over the `accessibilityViewIsModal` prop. + +| Type | Default | +| ------- | ------- | +| boolean | false | + +--- + +### `aria-selected` + +Indicates whether a selectable element is currently selected or not. + +| Type | +| ------- | +| boolean | + ### `onAccessibilityAction` Invoked when the user performs the accessibility actions. The only argument to this function is an event containing the name of the action to perform. diff --git a/docs/view.md b/docs/view.md index 977351cd910..ac6326c6505 100644 --- a/docs/view.md +++ b/docs/view.md @@ -287,16 +287,113 @@ Represents the textual description of the component. Has precedence over the `te | ------ | | string | +### `aria-busy` + +Indicates an element is being modified and that assistive technologies may want to wait until the changes are complete before informing the user about the update. + +| Type | Default | +| ------- | ------- | +| boolean | false | + +--- + +### `aria-checked` + +Indicates the state of a checkable element. This field can either take a boolean or the "mixed" string to represent mixed checkboxes. + +| Type | Default | +| ---------------- | ------- | +| boolean, 'mixed' | false | + +--- + +### `aria-disabled` + +Indicates that the element is perceivable but disabled, so it is not editable or otherwise operable. + +| Type | Default | +| ------- | ------- | +| boolean | false | + +--- + +### `aria-expanded` + +Indicates whether an expandable element is currently expanded or collapsed. + +| Type | Default | +| ------- | ------- | +| boolean | false | + +--- + +### `aria-hidden` + +Indicates whether the accessibility elements contained within this accessibility element are hidden. + +For example, in a window that contains sibling views `A` and `B`, setting `aria-hidden` to `true` on view `B` causes VoiceOver to ignore the elements in the view `B`. + +| Type | Default | +| ------- | ------- | +| boolean | false | + +--- + +### `aria-label` + +Defines a string value that labels an interactive element. + +| Type | +| ------ | +| string | + +--- + +### `aria-labelledby`
Android
+ +Identifies the element that labels the element it is applied to. The value of `aria-labelledby` should match the [`nativeID`](view.md#nativeid) of the related element: + +```jsx + + Label for Input Field + + +``` + +| Type | +| ------ | +| string | + +--- + +### `aria-live`
Android
+ +Indicates that an element will be updated, and describes the types of updates the user agents, assistive technologies, and user can expect from the live region. + +- **off** Accessibility services should not announce changes to this view. +- **polite** Accessibility services should announce changes to this view. +- **assertive** Accessibility services should interrupt ongoing speech to immediately announce changes to this view. + +--- + ### `aria-modal`
iOS
Boolean value indicating whether VoiceOver should ignore the elements within views that are siblings of the receiver. Has precedence over the `accessibilityViewIsModal` prop. -| Type | Default | -| ---- | ------- | -| bool | false | +| Type | Default | +| ------- | ------- | +| boolean | false | --- +### `aria-selected` + +Indicates whether a selectable element is currently selected or not. + +| Type | +| ------- | +| boolean | + ### `collapsable`
Android
Views that are only used to layout their children or otherwise don't draw anything may be automatically removed from the native hierarchy as an optimization. Set this property to `false` to disable this optimization and ensure that this `View` exists in the native view hierarchy. From 6ac0a3ccc0c64052a3059672be7e23ce28b33d97 Mon Sep 17 00:00:00 2001 From: Gabriel Donadel Dall'Agnol Date: Mon, 7 Nov 2022 09:15:06 -0300 Subject: [PATCH 2/4] chore: Update view docs to ensure props are ordered alphabetically --- docs/view.md | 78 +++++++++++++++++++++++++++------------------------- 1 file changed, 40 insertions(+), 38 deletions(-) diff --git a/docs/view.md b/docs/view.md index ac6326c6505..6bace9c61f0 100644 --- a/docs/view.md +++ b/docs/view.md @@ -249,44 +249,6 @@ When `true`, indicates that the view is an accessibility element. By default, al --- -### `aria-valuemax` - -Represents the maximum value for range-based components, such as sliders and progress bars. Has precedence over the `max` value in the `accessibilityValue` prop. - -| Type | -| ------ | -| number | - ---- - -### `aria-valuemin` - -Represents the maximum value for range-based components, such as sliders and progress bars. Has precedence over the `min` value in the `accessibilityValue` prop. - -| Type | -| ------ | -| number | - ---- - -### `aria-valuenow` - -Represents the current value for range-based components, such as sliders and progress bars. Has precedence over the `now` value in the `accessibilityValue` prop. - -| Type | -| ------ | -| number | - ---- - -### `aria-valuetext` - -Represents the textual description of the component. Has precedence over the `text` value in the `accessibilityValue` prop. - -| Type | -| ------ | -| string | - ### `aria-busy` Indicates an element is being modified and that assistive technologies may want to wait until the changes are complete before informing the user about the update. @@ -394,6 +356,46 @@ Indicates whether a selectable element is currently selected or not. | ------- | | boolean | +### `aria-valuemax` + +Represents the maximum value for range-based components, such as sliders and progress bars. Has precedence over the `max` value in the `accessibilityValue` prop. + +| Type | +| ------ | +| number | + +--- + +### `aria-valuemin` + +Represents the maximum value for range-based components, such as sliders and progress bars. Has precedence over the `min` value in the `accessibilityValue` prop. + +| Type | +| ------ | +| number | + +--- + +### `aria-valuenow` + +Represents the current value for range-based components, such as sliders and progress bars. Has precedence over the `now` value in the `accessibilityValue` prop. + +| Type | +| ------ | +| number | + +--- + +### `aria-valuetext` + +Represents the textual description of the component. Has precedence over the `text` value in the `accessibilityValue` prop. + +| Type | +| ------ | +| string | + +--- + ### `collapsable`
Android
Views that are only used to layout their children or otherwise don't draw anything may be automatically removed from the native hierarchy as an optimization. Set this property to `false` to disable this optimization and ensure that this `View` exists in the native view hierarchy. From 9f2db3395be4e625457900ef6576573fbc0f6cb6 Mon Sep 17 00:00:00 2001 From: Gabriel Donadel Dall'Agnol Date: Mon, 7 Nov 2022 10:38:12 -0300 Subject: [PATCH 3/4] Update docs/touchablewithoutfeedback.md Co-authored-by: Bartosz Kaszubowski --- docs/touchablewithoutfeedback.md | 2 -- 1 file changed, 2 deletions(-) diff --git a/docs/touchablewithoutfeedback.md b/docs/touchablewithoutfeedback.md index f2326096c4e..c4acef69870 100644 --- a/docs/touchablewithoutfeedback.md +++ b/docs/touchablewithoutfeedback.md @@ -195,8 +195,6 @@ See the [Accessibility guide](accessibility.md#accessibility-actions) for more i --- -'aria-selected'?: ?boolean, - ### `aria-busy` Indicates an element is being modified and that assistive technologies may want to wait until the changes are complete before informing the user about the update. From 78b428b8a7f202d1cb1f3220708a3b5e621fac3d Mon Sep 17 00:00:00 2001 From: Gabriel Donadel Dall'Agnol Date: Mon, 7 Nov 2022 14:17:38 -0300 Subject: [PATCH 4/4] chore: Add types table to aria-live and update aria-modal --- docs/accessibility.md | 6 ++++++ docs/touchablewithoutfeedback.md | 6 +++++- docs/view.md | 6 +++++- 3 files changed, 16 insertions(+), 2 deletions(-) diff --git a/docs/accessibility.md b/docs/accessibility.md index de91a016c42..6dc7bab6374 100644 --- a/docs/accessibility.md +++ b/docs/accessibility.md @@ -293,6 +293,12 @@ Indicates that an element will be updated, and describes the types of updates th - **polite** Accessibility services should announce changes to this view. - **assertive** Accessibility services should interrupt ongoing speech to immediately announce changes to this view. +| Type | Default | +| ---------------------------------------- | ------- | +| enum(`'assertive'`, `'off'`, `'polite'`) | `'off'` | + +--- + ### `aria-modal`
iOS
Boolean value indicating whether VoiceOver should ignore the elements within views that are siblings of the receiver. diff --git a/docs/touchablewithoutfeedback.md b/docs/touchablewithoutfeedback.md index c4acef69870..ddfd036f4e1 100644 --- a/docs/touchablewithoutfeedback.md +++ b/docs/touchablewithoutfeedback.md @@ -265,11 +265,15 @@ Indicates that an element will be updated, and describes the types of updates th - **polite** Accessibility services should announce changes to this view. - **assertive** Accessibility services should interrupt ongoing speech to immediately announce changes to this view. +| Type | Default | +| ---------------------------------------- | ------- | +| enum(`'assertive'`, `'off'`, `'polite'`) | `'off'` | + --- ### `aria-modal`
iOS
-Boolean value indicating whether VoiceOver should ignore the elements within views that are siblings of the receiver. Has precedence over the `accessibilityViewIsModal` prop. +Boolean value indicating whether VoiceOver should ignore the elements within views that are siblings of the receiver. Has precedence over the [`accessibilityViewIsModal`](#accessibilityviewismodal-ios) prop. | Type | Default | | ------- | ------- | diff --git a/docs/view.md b/docs/view.md index 6bace9c61f0..3a744116246 100644 --- a/docs/view.md +++ b/docs/view.md @@ -336,11 +336,15 @@ Indicates that an element will be updated, and describes the types of updates th - **polite** Accessibility services should announce changes to this view. - **assertive** Accessibility services should interrupt ongoing speech to immediately announce changes to this view. +| Type | Default | +| ---------------------------------------- | ------- | +| enum(`'assertive'`, `'off'`, `'polite'`) | `'off'` | + --- ### `aria-modal`
iOS
-Boolean value indicating whether VoiceOver should ignore the elements within views that are siblings of the receiver. Has precedence over the `accessibilityViewIsModal` prop. +Boolean value indicating whether VoiceOver should ignore the elements within views that are siblings of the receiver. Has precedence over the [`accessibilityViewIsModal`](#accessibilityviewismodal-ios) prop. | Type | Default | | ------- | ------- |