diff --git a/lib/items.js b/lib/items.js index f2c26a7..eb780dc 100644 --- a/lib/items.js +++ b/lib/items.js @@ -1,6 +1,6 @@ -import React, { Component, } from 'react'; -const ReactNative = require('react-native'); - +import React, { Component } from "react"; +const ReactNative = require("react-native"); +import PropTypes from "prop-types"; const { Dimensions, StyleSheet, @@ -10,7 +10,7 @@ const { Text } = ReactNative; -const window = Dimensions.get('window'); +const window = Dimensions.get("window"); const styles = StyleSheet.create({ scrollView: { @@ -18,12 +18,12 @@ const styles = StyleSheet.create({ width: 198 //TODO: this needs to be dynamic }, container: { - position: 'absolute', - borderColor: '#BDBDC1', + position: "absolute", + borderColor: "#BDBDC1", borderWidth: 2 / window.scale, - borderTopColor: 'transparent', + borderTopColor: "transparent" } -}) +}); class Items extends Component { constructor(props) { @@ -31,19 +31,26 @@ class Items extends Component { } render() { - const { items, positionX, positionY, show, onPress, width, height } = this.props; + const { + items, + positionX, + positionY, + show, + onPress, + width, + height + } = this.props; if (!show) { return null; } - const renderedItems = React.Children.map(items, (item) => { - + const renderedItems = React.Children.map(items, item => { return ( - onPress(item.props.children, item.props.value) }> - - {item} - + onPress(item.props.children, item.props.value)} + > + {item} ); }); @@ -53,7 +60,8 @@ class Items extends Component { + bounces={false} + > {renderedItems} @@ -62,10 +70,10 @@ class Items extends Component { } Items.propTypes = { - positionX: React.PropTypes.number, - positionY: React.PropTypes.number, - show: React.PropTypes.bool, - onPress: React.PropTypes.func + positionX: PropTypes.number, + positionY: PropTypes.number, + show: PropTypes.bool, + onPress: PropTypes.func }; Items.defaultProps = { diff --git a/lib/option.js b/lib/option.js index 95db391..a84bf31 100644 --- a/lib/option.js +++ b/lib/option.js @@ -1,17 +1,12 @@ -import React, { Component, } from 'react'; -const ReactNative = require('react-native'); - -const { - StyleSheet, - View, - Text -} = ReactNative; - +import React, { Component } from "react"; +const ReactNative = require("react-native"); +import PropTypes from "prop-types"; +const { StyleSheet, View, Text } = ReactNative; const styles = StyleSheet.create({ container: { padding: 10, - backgroundColor: 'white', + backgroundColor: "white" } }); @@ -24,15 +19,15 @@ class Option extends Component { const { style, styleText } = this.props; return ( - - {this.props.children} + + {this.props.children} ); } } Option.propTypes = { - children: React.PropTypes.string.isRequired + children: PropTypes.string.isRequired }; module.exports = Option; diff --git a/lib/optionList.js b/lib/optionList.js index 4c211a7..8e662fc 100644 --- a/lib/optionList.js +++ b/lib/optionList.js @@ -1,19 +1,12 @@ -const Overlay = require('./overlay'); -const Items = require('./items'); +const Overlay = require("./overlay"); +const Items = require("./items"); +import PropTypes from "prop-types"; +import React, { Component } from "react"; +const ReactNative = require("react-native"); -import React, { Component, } from 'react'; -const ReactNative = require('react-native'); +const { StyleSheet, View, Text, Dimensions } = ReactNative; -const { - StyleSheet, - View, - Text, - Dimensions, -} = ReactNative; - - - -const window = Dimensions.get('window'); +const window = Dimensions.get("window"); class OptionList extends Component { constructor(props) { @@ -32,7 +25,7 @@ class OptionList extends Component { positionY: 0, items: [], - onSelect: () => { } + onSelect: () => {} }; } @@ -98,7 +91,8 @@ class OptionList extends Component { pageX={pageX} pageY={pageY} show={show} - onPress={ this._onOverlayPress.bind(this) }/> + onPress={this._onOverlayPress.bind(this)} + /> + onPress={this._onItemPress.bind(this)} + /> ); } } -OptionList.propTypes = { - -}; - -OptionList.defaultProps = { +OptionList.propTypes = {}; -}; +OptionList.defaultProps = {}; module.exports = OptionList; diff --git a/lib/overlay.js b/lib/overlay.js index 3662cee..a1be581 100644 --- a/lib/overlay.js +++ b/lib/overlay.js @@ -1,6 +1,6 @@ -import React, { Component, } from 'react'; -const ReactNative = require('react-native'); - +import React, { Component } from "react"; +const ReactNative = require("react-native"); +import PropTypes from "prop-types"; const { Dimensions, StyleSheet, @@ -10,19 +10,19 @@ const { Text } = ReactNative; -const window = Dimensions.get('window'); +const window = Dimensions.get("window"); const styles = StyleSheet.create({ container: { - position: 'absolute', + position: "absolute", top: 0, left: 0, right: 0, bottom: 0 }, overlay: { - position: 'absolute', - backgroundColor: 'transparent', + position: "absolute", + backgroundColor: "transparent", width: window.width, height: window.height } @@ -37,21 +37,21 @@ class Overlay extends Component { const { pageX, pageY, show, onPress } = this.props; if (!show) { - return null + return null; } return ( - + ); } } Overlay.propTypes = { - pageX: React.PropTypes.number, - pageY: React.PropTypes.number, - show: React.PropTypes.bool + pageX: PropTypes.number, + pageY: PropTypes.number, + show: PropTypes.bool }; Overlay.defaultProps = { diff --git a/lib/select.js b/lib/select.js index 249a3d0..12fe0d0 100644 --- a/lib/select.js +++ b/lib/select.js @@ -1,7 +1,7 @@ -const Option = require('./option'); - -import React, { Component, } from 'react'; -const ReactNative = require('react-native'); +const Option = require("./option"); +import PropTypes from "prop-types"; +import React, { Component } from "react"; +const ReactNative = require("react-native"); const { Dimensions, @@ -12,13 +12,13 @@ const { Text } = ReactNative; -const window = Dimensions.get('window'); +const window = Dimensions.get("window"); -const SELECT = 'SELECT'; +const SELECT = "SELECT"; const styles = StyleSheet.create({ container: { - borderColor: '#BDBDC1', + borderColor: "#BDBDC1", borderWidth: 2 / window.scale } }); @@ -42,7 +42,7 @@ class Select extends Component { this.state = { value: defaultValue - } + }; } reset() { @@ -62,24 +62,41 @@ class Select extends Component { return false; } - optionListRef()._show(children, this.pageX, this.pageY, width, height, (item, value=item) => { - if (item) { - onSelect(value); - this.setState({ - value: item - }); + optionListRef()._show( + children, + this.pageX, + this.pageY, + width, + height, + (item, value = item) => { + if (item) { + onSelect(value); + this.setState({ + value: item + }); + } } - }); + ); } render() { - const { width, height, children, defaultValue, style, styleOption, styleText } = this.props; + const { + width, + height, + children, + defaultValue, + style, + styleOption, + styleText + } = this.props; const dimensions = { width, height }; return ( - - + + ); @@ -87,16 +104,16 @@ class Select extends Component { } Select.propTypes = { - width: React.PropTypes.number, - height: React.PropTypes.number, - optionListRef: React.PropTypes.func.isRequired, - onSelect: React.PropTypes.func + width: PropTypes.number, + height: PropTypes.number, + optionListRef: PropTypes.func.isRequired, + onSelect: PropTypes.func }; Select.defaultProps = { width: 200, height: 40, - onSelect: () => { } + onSelect: () => {} }; module.exports = Select; diff --git a/lib/updatePosition.js b/lib/updatePosition.js index af3a2d5..779ab3c 100644 --- a/lib/updatePosition.js +++ b/lib/updatePosition.js @@ -1,12 +1,10 @@ -const ReactNative = require('react-native'); +const ReactNative = require("react-native"); const { - NativeModules: { - UIManager - } + NativeModules: { UIManager } } = ReactNative; -module.exports = function (ref, debug) { +module.exports = function(ref, debug) { const handle = ReactNative.findNodeHandle(ref); setTimeout(() => { UIManager.measure(handle, (x, y, width, height, pageX, pageY) => {