var React = require('react');
var ReactDOM = require('react-dom');

var sizerStyle = { position: 'absolute', visibility: 'hidden', height: 0, width: 0, overflow: 'scroll', whiteSpace: 'nowrap' };

var AutosizeInput = React.createClass({
	propTypes: {
		value: React.PropTypes.any,                 // field value
		defaultValue: React.PropTypes.any,          // default field value
		onChange: React.PropTypes.func,             // onChange handler: function(newValue) {}
		style: React.PropTypes.object,              // css styles for the outer element
		className: React.PropTypes.string,          // className for the outer element
		minWidth: React.PropTypes.oneOfType([       // minimum width for input element
			React.PropTypes.number,
			React.PropTypes.string
		]),
		inputStyle: React.PropTypes.object,         // css styles for the input element
		inputClassName: React.PropTypes.string      // className for the input element
	},
	getDefaultProps () {
		return {
			minWidth: 1
		};
	},
	getInitialState () {
		return {
			inputWidth: this.props.minWidth
		};
	},
	componentDidMount () {
		this.copyInputStyles();
		this.updateInputWidth();
	},
	componentDidUpdate () {
		this.updateInputWidth();
	},
	copyInputStyles () {
		if (!this.isMounted() || !window.getComputedStyle) {
			return;
		}
		var inputStyle = window.getComputedStyle(ReactDOM.findDOMNode(this.refs.input));
		var widthNode = ReactDOM.findDOMNode(this.refs.sizer);
		widthNode.style.fontSize = inputStyle.fontSize;
		widthNode.style.fontFamily = inputStyle.fontFamily;
		widthNode.style.letterSpacing = inputStyle.letterSpacing;
		if (this.props.placeholder) {
			var placeholderNode = ReactDOM.findDOMNode(this.refs.placeholderSizer);
			placeholderNode.style.fontSize = inputStyle.fontSize;
			placeholderNode.style.fontFamily = inputStyle.fontFamily;
			placeholderNode.style.letterSpacing = inputStyle.letterSpacing;
		}
	},
	updateInputWidth () {
		if (!this.isMounted() || typeof ReactDOM.findDOMNode(this.refs.sizer).scrollWidth === 'undefined') {
			return;
		}
		var newInputWidth;
		if (this.props.placeholder) {
			newInputWidth = Math.max(ReactDOM.findDOMNode(this.refs.sizer).scrollWidth, ReactDOM.findDOMNode(this.refs.placeholderSizer).scrollWidth) + 2;
		} else {
			newInputWidth = ReactDOM.findDOMNode(this.refs.sizer).scrollWidth + 2;
		}
		if (newInputWidth < this.props.minWidth) {
			newInputWidth = this.props.minWidth;
		}
		if (newInputWidth !== this.state.inputWidth) {
			this.setState({
				inputWidth: newInputWidth
			});
		}
	},
	getInput () {
		return this.refs.input;
	},
	focus () {
		ReactDOM.findDOMNode(this.refs.input).focus();
	},
	select () {
		ReactDOM.findDOMNode(this.refs.input).select();
	},
	render () {
		var escapedValue = (this.props.value || '').replace(/\&/g, '&amp;').replace(/ /g, '&nbsp;').replace(/\</g, '&lt;').replace(/\>/g, '&gt;');
		var wrapperStyle = this.props.style || {};
		wrapperStyle.display = 'inline-block';
		var inputStyle = Object.assign({}, this.props.inputStyle);
		inputStyle.width = this.state.inputWidth;
		inputStyle.boxSizing = 'content-box';
		var placeholder = this.props.placeholder ? <div ref="placeholderSizer" style={sizerStyle}>{this.props.placeholder}</div> : null;
		return (
			<div className={this.props.className} style={wrapperStyle}>
				<input {...this.props} ref="input" className={this.props.inputClassName} style={inputStyle} />
				<div ref="sizer" style={sizerStyle} dangerouslySetInnerHTML={{ __html: escapedValue }} />
				{placeholder}
			</div>
		);
	}
});

module.exports = AutosizeInput;

@@ -26,45 +26,8 @@
 t');
-%0Avar ReactDOM = require('react-dom');
 %0A%0Ava
@@ -1302,37 +1302,16 @@
 edStyle(
-ReactDOM.findDOMNode(
 this.ref
@@ -1318,17 +1318,16 @@
 s.input)
-)
 ;%0A%09%09var 
@@ -1338,37 +1338,16 @@
 hNode = 
-ReactDOM.findDOMNode(
 this.ref
@@ -1349,25 +1349,24 @@
 s.refs.sizer
-)
 ;%0A%09%09widthNod
@@ -1576,37 +1576,16 @@
 rNode = 
-ReactDOM.findDOMNode(
 this.ref
@@ -1602,17 +1602,16 @@
 derSizer
-)
 ;%0A%09%09%09pla
@@ -1854,37 +1854,16 @@
  typeof 
-ReactDOM.findDOMNode(
 this.ref
@@ -1861,33 +1861,32 @@
  this.refs.sizer
-)
 .scrollWidth ===
@@ -1997,37 +1997,16 @@
 ath.max(
-ReactDOM.findDOMNode(
 this.ref
@@ -2004,33 +2004,32 @@
 (this.refs.sizer
-)
 .scrollWidth, Re
@@ -2026,37 +2026,16 @@
 lWidth, 
-ReactDOM.findDOMNode(
 this.ref
@@ -2048,25 +2048,24 @@
 eholderSizer
-)
 .scrollWidth
@@ -2101,37 +2101,16 @@
 Width = 
-ReactDOM.findDOMNode(
 this.ref
@@ -2116,17 +2116,16 @@
 fs.sizer
-)
 .scrollW
@@ -2399,37 +2399,16 @@
  () %7B%0A%09%09
-ReactDOM.findDOMNode(
 this.ref
@@ -2414,17 +2414,16 @@
 fs.input
-)
 .focus()
@@ -2447,29 +2447,8 @@
 %7B%0A%09%09
-ReactDOM.findDOMNode(
 this
@@ -2458,17 +2458,16 @@
 fs.input
-)
 .select(

Drop usage of ReactDOM.findDOMNode which is no longer necessary on refs.