Skip to content

Commit 3e02920

Browse files
committed
Add SwitchWrapper doc
1 parent 484cc57 commit 3e02920

File tree

1 file changed

+32
-0
lines changed

1 file changed

+32
-0
lines changed
Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
import { DevOnly } from '@site/src/components';
2+
3+
# SwitchWrapper
4+
5+
The component provides built-in accessibility implementation for creating a custom switch.
6+
7+
## Usage
8+
9+
```jsx pf
10+
import {SwitchWrapper} from 'react-native-ama';
11+
12+
<SwitchWrapper
13+
accessibilityLabel={accessibilityLabel}
14+
style={[allStyles.container, style]}
15+
onPress={onValueChange}
16+
checked={value}>
17+
<CustomSwitcher checked={checked} onPress={onValueChanged}>
18+
</SwitchWrapper>
19+
```
20+
21+
## Accessibility
22+
23+
The component uses the [useSwitch](./hooks/useSwitch.md) hook under the hood and:
24+
25+
- Sets the [accessibilityRole](../../../website/guidelines/accessibility-role.md) property to **switch**
26+
- Handled the [accessibilityState](https://reactnative.dev/docs/accessibility#accessibilitystate) needed by the Screen Reader
27+
- Performs a [Minimum Size](../../../website/guidelines/minimum-size.md) check <DevOnly />
28+
- Performs a check on the [accessibilityLabel](../../../website/guidelines/accessibility-label.md) <DevOnly />
29+
30+
## Related guidelines
31+
32+
- [Forms](../../../website/guidelines/forms.md)

0 commit comments

Comments
 (0)