Merge pull request #438 from thymikee/feat/accessible-pagination

feat: add accessibilityLabel to Pagination

Author: Benoît Delmaire

src/carousel/Carousel.js

@@ -126,7 +126,7 @@ export default class Carousel extends Component {
         this._scrollOffsetRef = null;
         this._onScrollTriggered = true; // used when momentum is enabled to prevent an issue with edges items
         this._lastScrollDate = 0; // used to work around a FlatList bug
-        this._scrollEnabled = props.scrollEnabled === false ? false : true;
+        this._scrollEnabled = props.scrollEnabled !== false;
 
         this._initPositionsAndInterpolators = this._initPositionsAndInterpolators.bind(this);
         this._renderItem = this._renderItem.bind(this);

src/pagination/Pagination.js

@@ -26,7 +26,8 @@ export default class Pagination extends PureComponent {
         inactiveDotStyle: ViewPropTypes ? ViewPropTypes.style : View.propTypes.style,
         renderDots: PropTypes.func,
         tappableDots: PropTypes.bool,
-        vertical: PropTypes.bool
+        vertical: PropTypes.bool,
+        accessibilityLabel: PropTypes.string
     };
 
     static defaultProps = {
@@ -123,7 +124,7 @@ export default class Pagination extends PureComponent {
     }
 
     render () {
-        const { dotsLength, containerStyle, vertical } = this.props;
+        const { dotsLength, containerStyle, vertical, accessibilityLabel } = this.props;
 
         if (!dotsLength || dotsLength < 2) {
             return false;
@@ -139,7 +140,12 @@ export default class Pagination extends PureComponent {
         ];
 
         return (
-            <View pointerEvents={'box-none'} style={style}>
+            <View
+              pointerEvents={'box-none'}
+              style={style}
+              accessible={!!accessibilityLabel}
+              accessibilityLabel={accessibilityLabel}
+            >
                 { this.dots }
             </View>
         );

src/pagination/PaginationDot.js

@@ -133,6 +133,7 @@ export default class PaginationDot extends PureComponent {
 
         return (
             <TouchableOpacity
+              accessible={false}
               style={dotContainerStyle}
               activeOpacity={tappable ? activeOpacity : 1}
               onPress={onPress}