react-native-modal-selector - npm Package Compare versions

Comparing version 0.0.29 to 1.0.0

index.js

@@ -55,3 +55,6 @@ 'use strict';
     backdropPressToClose:           PropTypes.bool,
-    accessible:                     PropTypes.bool,
+    openButtonContainerAccessible:  PropTypes.bool,
+    listItemAccessible:             PropTypes.bool,
+    cancelButtonAccessible:         PropTypes.bool,
+    scrollViewAccessible:           PropTypes.bool,
     scrollViewAccessibilityLabel:   PropTypes.string,
@@ -96,3 +99,6 @@ cancelButtonAccessibilityLabel: PropTypes.string,
     backdropPressToClose:           false,
-    accessible:                     false,
+    openButtonContainerAccessible:     false,
+    listItemAccessible:             false,
+    cancelButtonAccessible:         false,
+    scrollViewAccessible:           false,
     scrollViewAccessibilityLabel:   undefined,
@@ -172,3 +178,3 @@ cancelButtonAccessibilityLabel: undefined,
 
-    renderOption = (option, isLastItem) => {
+    renderOption = (option, isLastItem, isFirstItem) => {
         const optionLabel = this.props.labelExtractor(option);
@@ -182,4 +188,5 @@ const isSelectedItem = optionLabel === this.state.selected;
               activeOpacity={this.props.touchableActiveOpacity}
-              accessible={this.props.accessible}
+              accessible={this.props.listItemAccessible}
               accessibilityLabel={option.accessibilityLabel || undefined}
+              importantForAccessibility={isFirstItem}
               {...this.props.passThruProps}
@@ -203,3 +210,3 @@ >
             }
-            return this.renderOption(item, index === this.props.data.length - 1);
+            return this.renderOption(item, index === this.props.data.length - 1, index === 0);
         });
@@ -215,3 +222,3 @@
                     <View style={[styles.optionContainer, this.props.optionContainerStyle]}>
-                        <ScrollView keyboardShouldPersistTaps={this.props.keyboardShouldPersistTaps} accessible={this.props.accessible} accessibilityLabel={this.props.scrollViewAccessibilityLabel}>
+                        <ScrollView keyboardShouldPersistTaps={this.props.keyboardShouldPersistTaps} accessible={this.props.scrollViewAccessible} accessibilityLabel={this.props.scrollViewAccessibilityLabel}>
                             <View style={{paddingHorizontal: 10}}>
@@ -223,3 +230,3 @@ {options}
                     <View style={[styles.cancelContainer, this.props.cancelContainerStyle]}>
-                        <TouchableOpacity onPress={this.close} activeOpacity={this.props.touchableActiveOpacity} accessible={this.props.accessible} accessibilityLabel={this.props.cancelButtonAccessibilityLabel}>
+                        <TouchableOpacity onPress={this.close} activeOpacity={this.props.touchableActiveOpacity} accessible={this.props.cancelButtonAccessible} accessibilityLabel={this.props.cancelButtonAccessibilityLabel}>
                             <View style={[styles.cancelStyle, this.props.cancelStyle]}>
@@ -274,2 +281,3 @@ <Text style={[styles.cancelTextStyle,this.props.cancelTextStyle]}>{this.props.cancelText}</Text>
                         disabled={this.props.disabled}
+                        accessible={this.props.openButtonContainerAccessible}
                     >
@@ -276,0 +284,0 @@ <View style={this.props.childrenContainerStyle} pointerEvents="none">

package.json

 {
   "name": "react-native-modal-selector",
-  "version": "0.0.29",
+  "version": "1.0.0",
   "description": "A cross-platform (iOS / Android), selector/picker component for React Native that is highly customizable and supports sections.",
@@ -5,0 +5,0 @@ "main": "index.js",

README.md

@@ -145,3 +145,6 @@ # react-native-modal-selector [![npm version](https://badge.fury.io/js/react-native-modal-selector.svg)](https://badge.fury.io/js/react-native-modal-selector)
 `passThruProps`| object   | Yes  | {}        | props to pass through to the container View and each option TouchableOpacity (e.g. testID for testing)
-`accessible`| bool   | Yes  | false        | `true` enables accessibility for modal and options. Note: data items should have an `accessibilityLabel` property if this is enabled
+`openButtonContainerAccessible`| bool   | Yes  | false        | `true` enables accessibility for the open button container. Note: if `false` be sure to define accessibility props directly in the wrapped component.
+`listItemAccessible`| bool   | Yes  | false        | `true` enables accessibility for data items. Note: data items should have an `accessibilityLabel` property if this is enabled
+`cancelButtonAccessible`| bool   | Yes  | false        | `true` enables accessibility for cancel button.
+`scrollViewAccessible`| bool   | Yes  | false        | `true` enables accessibility for the scroll view. Only enable this if you don't want to interact with individual data items.
 `scrollViewAccessibilityLabel` | string   | Yes      | undefined | Accessibility label for the modal ScrollView
@@ -148,0 +151,0 @@ `cancelButtonAccessibilityLabel` | string   | Yes      | undefined | Accessibility label for the cancel button

Fixed alerts

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

68861

increased by1.44%

Lines of code

323

increased by2.54%

Number of low quality alerts

1

decreased by-50%

Number of lines in readme file

157

increased by1.95%

No dependency changes