'use strict';
var React = require('react-native');
var {
  AppRegistry,
  StyleSheet,
  View,
  TextInput,
} = React;


class SearchBar extends React.Component {
  render() {
    return (
      <View style={styles.searchRow}>
          <TextInput
            autoCapitalize="none"
            autoCorrect={false}
            clearButtonMode="always"
            placeholder="Please input your name..."
            style={styles.searchTextInput}
          />
        </View>
      );
  }
}


class SampleApp extends React.Component {
  render() {
    return (
      <React.NavigatorIOS
        style={styles.container}
        initialRoute={{
          title: 'My App',
          component: SearchBar,
        }}/>
    );
  }
}


var styles = React.StyleSheet.create({
  container: {
    flex: 1
  },
  searchRow: {
    backgroundColor: '#eeeeee',
    paddingTop: 75,
    paddingLeft: 10,
    paddingRight: 10,
    paddingBottom: 10,
  },
  searchTextInput: {
    backgroundColor: 'white',
    borderColor: '#cccccc',
    borderRadius: 3,
    borderWidth: 1,
    height: 30,
    paddingLeft: 8,
  },
});


React.AppRegistry.registerComponent('SampleApp', function() { return SampleApp });