diff --git a/lib/FloatingLabel.js b/lib/FloatingLabel.js index 5f96eab..706038c 100644 --- a/lib/FloatingLabel.js +++ b/lib/FloatingLabel.js @@ -1,11 +1,12 @@ 'use strict'; -import React, {Component, PropTypes} from "react"; -import {StyleSheet, Animated} from "react-native"; +import React, { Component } from "react"; +import { StyleSheet, Animated } from "react-native"; +import PropTypes from 'prop-types'; export default class FloatingLabel extends Component { - constructor(props: Object) { + constructor(props) { super(props); - if(props.dense) { + if (props.dense) { this.posTop = 12; this.posBottom = 32; this.fontLarge = 13; @@ -23,7 +24,7 @@ export default class FloatingLabel extends Component { fontSize: new Animated.Value(fontSize) }; } - shouldComponentUpdate(nextProps: Object, nextState: Object) : bool { + shouldComponentUpdate(nextProps, nextState) { return (this.props.hasValue !== nextProps.hasValue) ? false : true; } floatLabel() { @@ -50,7 +51,7 @@ export default class FloatingLabel extends Component { }) ]).start(); } - render() : Object { + render() { let { label, labelColor, @@ -66,7 +67,7 @@ export default class FloatingLabel extends Component { }, styles.labelText, this.props.isFocused && { color: highlightColor }, style]} - onPress={()=> { + onPress={() => { this.props.focusHandler(); }} > diff --git a/lib/TextField.js b/lib/TextField.js index d42523a..a3615a2 100644 --- a/lib/TextField.js +++ b/lib/TextField.js @@ -1,12 +1,13 @@ 'use strict'; -import React, {Component, PropTypes} from "react"; -import {View, TextInput, StyleSheet} from "react-native"; +import React, { Component } from "react"; +import { View, TextInput, StyleSheet } from "react-native"; +import PropTypes from 'prop-types'; import Underline from './Underline'; import FloatingLabel from './FloatingLabel'; export default class TextField extends Component { - constructor(props: Object, context: Object) { + constructor(props, context) { super(props, context); this.state = { isFocused: false, @@ -23,18 +24,18 @@ export default class TextField extends Component { isFocused() { return this.state.isFocused; } - measureLayout(...args){ + measureLayout(...args) { this.refs.wrapper.measureLayout(...args) } - componentWillReceiveProps(nextProps: Object){ - if(this.props.text !== nextProps.value){ + componentWillReceiveProps(nextProps) { + if (this.props.text !== nextProps.value) { nextProps.value.length !== 0 ? this.refs.floatingLabel.floatLabel() : this.refs.floatingLabel.sinkLabel(); - this.setState({text: nextProps.value}); + this.setState({ text: nextProps.value }); } - if(this.props.height !== nextProps.height){ - this.setState({height: nextProps.height}); + if (this.props.height !== nextProps.height) { + this.setState({ height: nextProps.height }); } } render() { @@ -62,7 +63,7 @@ export default class TextField extends Component { ...props } = this.props; return ( - + { - this.setState({isFocused: true}); + this.setState({ isFocused: true }); this.refs.floatingLabel.floatLabel(); this.refs.underline.expandLine(); onFocus && onFocus(); }} onBlur={() => { - this.setState({isFocused: false}); + this.setState({ isFocused: false }); !this.state.text.length && this.refs.floatingLabel.sinkLabel(); this.refs.underline.shrinkLine(); onBlur && onBlur(); }} onChangeText={(text) => { - this.setState({text}); + this.setState({ text }); onChangeText && onChangeText(text); }} onChange={(event) => { - if(autoGrow){ - this.setState({height: event.nativeEvent.contentSize.height}); + if (autoGrow) { + this.setState({ height: event.nativeEvent.contentSize.height }); } onChange && onChange(event); }} diff --git a/lib/Underline.js b/lib/Underline.js index 4368733..b8b20fd 100644 --- a/lib/Underline.js +++ b/lib/Underline.js @@ -1,9 +1,10 @@ 'use strict'; -import React, {Component, PropTypes} from "react"; -import {View, StyleSheet, Animated} from "react-native"; +import React, { Component } from "react"; +import { View, StyleSheet, Animated } from "react-native"; +import PropTypes from 'prop-types'; export default class Underline extends Component { - constructor(props: Object) { + constructor(props) { super(props); this.state = { lineLength: new Animated.Value(0),