diff --git a/index.js b/index.js
index d65bf4c0..ef2895bc 100644
--- a/index.js
+++ b/index.js
@@ -1,18 +1,16 @@
'use strict';
-import React,{
- PropTypes
-} from 'react';
+import React, {PropTypes} from 'react';
import {
- View,
- StyleSheet,
- Dimensions,
- Modal,
- Text,
- ScrollView,
- TouchableOpacity,
- Platform
+ View,
+ StyleSheet,
+ Dimensions,
+ Modal,
+ Text,
+ ScrollView,
+ TouchableOpacity,
+ Platform,
} from 'react-native';
import styles from './style';
@@ -21,162 +19,177 @@ import BaseComponent from './BaseComponent';
let componentIndex = 0;
const propTypes = {
- data: PropTypes.array,
- onChange: PropTypes.func,
- initValue: PropTypes.string,
- style: View.propTypes.style,
- selectStyle: View.propTypes.style,
- optionStyle: View.propTypes.style,
- optionTextStyle: Text.propTypes.style,
- sectionStyle: View.propTypes.style,
- sectionTextStyle: Text.propTypes.style,
- cancelStyle: View.propTypes.style,
- cancelTextStyle: Text.propTypes.style,
- overlayStyle: View.propTypes.style,
- cancelText: PropTypes.string
+ data: PropTypes.array,
+ onChange: PropTypes.func,
+ initValue: PropTypes.string,
+ style: View.propTypes.style,
+ selectStyle: View.propTypes.style,
+ optionStyle: View.propTypes.style,
+ optionTextStyle: Text.propTypes.style,
+ sectionStyle: View.propTypes.style,
+ sectionTextStyle: Text.propTypes.style,
+ cancelStyle: View.propTypes.style,
+ cancelTextStyle: Text.propTypes.style,
+ overlayStyle: View.propTypes.style,
+ cancelText: PropTypes.string,
};
const defaultProps = {
- data: [],
- onChange: ()=> {},
- initValue: 'Select me!',
- style: {},
- selectStyle: {},
- optionStyle: {},
- optionTextStyle: {},
- sectionStyle: {},
- sectionTextStyle: {},
- cancelStyle: {},
- cancelTextStyle: {},
- overlayStyle: {},
- cancelText: 'cancel'
+ data: [],
+ onChange: () => {},
+ initValue: 'Select me!',
+ style: {},
+ selectStyle: {},
+ optionStyle: {},
+ optionTextStyle: {},
+ sectionStyle: {},
+ sectionTextStyle: {},
+ cancelStyle: {},
+ cancelTextStyle: {},
+ overlayStyle: {},
+ cancelText: 'cancel',
};
export default class ModalPicker extends BaseComponent {
-
- constructor() {
-
- super();
-
- this._bind(
- 'onChange',
- 'open',
- 'close',
- 'renderChildren'
- );
-
- this.state = {
- animationType: 'slide',
- modalVisible: false,
- transparent: false,
- selected: 'please select'
- };
+ constructor() {
+ super();
+
+ this._bind('onChange', 'open', 'close', 'renderChildren');
+
+ this.state = {
+ animationType: 'slide',
+ modalVisible: false,
+ transparent: false,
+ selected: 'please select',
+ };
+ }
+
+ componentDidMount() {
+ this.setState({selected: this.props.initValue});
+ this.setState({cancelText: this.props.cancelText});
+ }
+
+ componentWillReceiveProps(nextProps) {
+ if (nextProps.initValue != this.props.initValue) {
+ this.setState({selected: nextProps.initValue});
}
-
- componentDidMount() {
- this.setState({selected: this.props.initValue});
- this.setState({cancelText: this.props.cancelText});
- }
-
- componentWillReceiveProps(nextProps) {
- if (nextProps.initValue != this.props.initValue) {
- this.setState({selected: nextProps.initValue});
+ }
+
+ onChange(item) {
+ this.props.onChange(item);
+ this.setState({selected: item.label});
+ this.close();
+ }
+
+ close() {
+ this.setState({
+ modalVisible: false,
+ });
+ }
+
+ open() {
+ this.setState({
+ modalVisible: true,
+ });
+ }
+
+ renderSection(section) {
+ return (
+
+
+ {section.label}
+
+
+ );
+ }
+
+ renderOption(option) {
+ return (
+ this.onChange(option)}>
+
+
+ {option.label}
+
+
+
+ );
+ }
+
+ renderOptionList() {
+ var options = this.props.data.map(item => {
+ if (item.section) {
+ return this.renderSection(item);
+ } else {
+ return this.renderOption(item);
}
- }
-
- onChange(item) {
- this.props.onChange(item);
- this.setState({selected: item.label});
- this.close();
- }
-
- close() {
- this.setState({
- modalVisible: false
- });
- }
-
- open() {
- this.setState({
- modalVisible: true
- });
- }
-
- renderSection(section) {
- return (
-
- {section.label}
+ });
+
+ return (
+
+
+
+
+ {options}
- );
- }
-
- renderOption(option) {
- return (
- this.onChange(option)}>
-
- {option.label}
-
- )
- }
-
- renderOptionList() {
- var options = this.props.data.map((item) => {
- if (item.section) {
- return this.renderSection(item);
- } else {
- return this.renderOption(item);
- }
- });
-
- return (
-
-
-
-
- {options}
-
-
-
-
-
-
- {this.props.cancelText}
-
-
-
-
- );
- }
-
- renderChildren() {
-
- if(this.props.children) {
- return this.props.children;
- }
- return (
-
- {this.state.selected}
+
+
+
+
+
+
+ {this.props.cancelText}
+
- );
- }
-
- render() {
+
+
- const dp = (
-
- {this.renderOptionList()}
-
- );
+
+ );
+ }
- return (
-
- {dp}
-
- {this.renderChildren()}
-
-
- );
+ renderChildren() {
+ if (this.props.children) {
+ return this.props.children;
}
+ return (
+
+
+ {this.state.selected}
+
+
+ );
+ }
+
+ render() {
+ const dp = (
+
+ {this.renderOptionList()}
+
+ );
+
+ return (
+
+ {dp}
+
+ {this.renderChildren()}
+
+
+ );
+ }
}
ModalPicker.propTypes = propTypes;