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

Comparing version 0.4.2 to 0.4.3

components/ModalDropdown.js

@@ -13,3 +13,2 @@ /**
 import {
-  NativeModules,
   StyleSheet,
@@ -21,3 +20,3 @@ Dimensions,
   TouchableWithoutFeedback,
-  TouchableWithNativeFeedback,
+  TouchableNativeFeedback,
   TouchableOpacity,
@@ -29,3 +28,3 @@ TouchableHighlight,
 
-const TOUCHABLE_ELEMENTS = ['TouchableHighlight', 'TouchableOpacity', 'TouchableWithoutFeedback', 'TouchableWithNativeFeedback'];
+const TOUCHABLE_ELEMENTS = ['TouchableHighlight', 'TouchableOpacity', 'TouchableWithoutFeedback', 'TouchableNativeFeedback'];
 
@@ -46,2 +45,4 @@ export default class ModalDropdown extends Component {
     dropdownStyle: PropTypes.oneOfType([PropTypes.number, PropTypes.object, PropTypes.array]),
+    dropdownTextStyle: PropTypes.oneOfType([PropTypes.number, PropTypes.object, PropTypes.array]),
+    dropdownTextHighlightStyle: PropTypes.oneOfType([PropTypes.number, PropTypes.object, PropTypes.array]),
 
@@ -76,4 +77,4 @@ adjustFrame: PropTypes.func,
       disabled: props.disabled,
-      accessible: props.accessible !== false,
-      loading: props.options == null,
+      accessible: !!props.accessible,
+      loading: props.options === null || props.options === undefined,
       showDropdown: false,
@@ -194,2 +195,3 @@ buttonText: props.defaultValue,
           <TouchableWithoutFeedback accessible={this.props.accessible}
+                                    disabled={!this.state.showDropdown}
                                     onPress={this._onModalPress.bind(this)}>
@@ -286,3 +288,9 @@ <View style={styles.modal}>
     let row = !this.props.renderRow ?
-      (<Text style={[styles.rowText, highlighted && styles.highlightedRowText]}>
+      (<Text style={[
+        styles.rowText,
+        this.props.dropdownTextStyle,
+        highlighted && styles.highlightedRowText,
+        highlighted && this.props.dropdownTextHighlightStyle
+      ]}
+      >
         {rowData}
@@ -328,8 +336,8 @@ </Text>) :
           break;
-        case 'TouchableWithNativeFeedback':
+        case 'TouchableNativeFeedback':
         {
           return (
-            <TouchableWithNativeFeedback {...props}>
+            <TouchableNativeFeedback {...props}>
               {row.props.children}
-            </TouchableWithNativeFeedback>
+            </TouchableNativeFeedback>
           );
@@ -336,0 +344,0 @@ }

package.json

 {
   "name": "react-native-modal-dropdown",
-  "version": "0.4.2",
+  "version": "0.4.3",
   "description": "A react-native dropdown component for both iOS and Android.",
@@ -5,0 +5,0 @@ "keywords": [

README.md

@@ -16,5 +16,3 @@ [![npm version](https://badge.fury.io/js/react-native-modal-dropdown.svg)](https://badge.fury.io/js/react-native-modal-dropdown)
 ## Demo
-<img src="https://github.com/sohobloo/react-native-modal-dropdown/blob/master/docs/demo_1.gif?raw=true" width = "160" height = "287.5" alt="Demo 1"/>
-<img src="https://github.com/sohobloo/react-native-modal-dropdown/blob/master/docs/demo_2.gif?raw=true" width = "160" height = "287.5" alt="Demo 2"/>
-<img src="https://github.com/sohobloo/react-native-modal-dropdown/blob/master/docs/demo_3.gif?raw=true" width = "160" height = "287.5" alt="Demo 3"/>
+<img src="https://github.com/sohobloo/react-native-modal-dropdown/blob/master/docs/demo_1.gif?raw=true" width = "160" height = "287.5" alt="Demo 1"/> <img src="https://github.com/sohobloo/react-native-modal-dropdown/blob/master/docs/demo_2.gif?raw=true" width = "160" height = "287.5" alt="Demo 2"/> <img src="https://github.com/sohobloo/react-native-modal-dropdown/blob/master/docs/demo_3.gif?raw=true" width = "160" height = "287.5" alt="Demo 3"/>
 
@@ -25,37 +23,8 @@ You can find them in the example.
 
-### v0.4.2
-- Add `animated` option.
-- Add `showsVerticalScrollIndicator` option
+### v0.4.3
+- Add ability to style dropdown text. See `dropdownTextStyle` and `dropdownTextHighlightStyle`. Thanks to @evansiroky
+- Fix `TouchableWithNativeFeedback` should be `TouchableNativeFeedback`
 
-### v0.4.1
-- Fix bug: [\#27](https://github.com/sohobloo/react-native-modal-dropdown/issues/27) Fix a flex style bug.
-- Enhancement: [\#26](https://github.com/sohobloo/react-native-modal-dropdown/issues/26) Support object type of options.
+[Full update history list](https://github.com/sohobloo/react-native-modal-dropdown/wiki/Update-History)
 
-### v0.4.0
-- New feature:
-[\#10](https://github.com/sohobloo/react-native-modal-dropdown/issues/10) Support touchable component in `renderRow`.
-- New feature: [\#11](https://github.com/sohobloo/react-native-modal-dropdown/issues/11) Open `renderSeparator` prop API.
-- New feature: Add `adjustFrame` prop for user to adjust the frame style of the dropdown in case the component calculate a mistake frame. \(refer to [#9](https://github.com/sohobloo/react-native-modal-dropdown/issues/5)\) \([code sample](https://github.com/sohobloo/react-native-modal-dropdown/commit/0861d0a1bbe11c221696e8c664ef03ed475a3849#diff-f8c408fd257ff44ce4b01e5f8422b1e1)\)
-- Enhancement: Compatible with `react-native` v0.36.0 which has a [break change](https://github.com/facebook/react-native/commit/0a9b6bedb312eba22c5bc11498b1cc41363e5f27) causes the default button with zero size.
-- Enhancement: [\#16](https://github.com/sohobloo/react-native-modal-dropdown/issues/16) Prevent from warnings if array of styles is used instead of stylesheet or object. Thanks to @NikolaBorislavovHristov .
-
-### v0.3.2
-- Fix bug: [\#9](https://github.com/sohobloo/react-native-modal-dropdown/issues/9) *undefined is not an object (evaluating '_this.updatePosition.bind')* in v0.3.1.
-- Fix bug: Wrong width of dropdown in very few cases.
-
-### v0.3.1
-- Fix bug: [\#6](https://github.com/sohobloo/react-native-modal-dropdown/issues/6) Can not specify `height` style for `dropdownStyle`.
-- Remove `updatePosition` function.
-
-### v0.3.0
-- Auto update position before show.
-- Mark `updatePosition` function as depreciated. (May be removed in next version.)
-
-### v0.2.0
-- Add wrapper / container support
-
-Now you can use these component as a wrapper / container. Anything wrapped in it can be the trigger of the dropdown.
-
-<img src="https://github.com/sohobloo/react-native-modal-dropdown/blob/master/docs/demo_4.gif?raw=true" width = "120" height = "144.375" alt="Demo 4"/>
-
 ## Installation
@@ -104,2 +73,4 @@ ```sh
 `dropdownStyle`     | object   | Yes      |           | Style of the dropdown list.
+`dropdownTextStyle` | object   | Yes      |           | Style of the dropdown option text.
+`dropdownTextHighlightStyle`   | object | Yes      |  | Style of the dropdown selected option text.
 `adjustFrame`       | func     | Yes      |           | This is a callback after the frame of the dropdown have been calculated and before showing. You will receive a style object as argument with some of the props like `width` `height` `top` `left` and `right`. Change them to appropriate values that accord with your requirement and **make the new style as the return value of this function**.
@@ -106,0 +77,0 @@ `renderRow`         | func     | Yes      |           | Customize render option rows. **Will render a default row if `null`/`undefined`.**

No alert changes

Improved metrics

Lines of code

378

increased by2.16%

Worsened metrics

Total package byte prevSize

18534

decreased by-6.83%

Number of lines in readme file

90

decreased by-24.37%

No dependency changes