1 files changed, 53 insertions, 0 deletions
diff --git a/third_party/webkit/PerformanceTests/Speedometer/resources/todomvc/architecture-examples/react-redux/src/components/TodoTextInput.js b/third_party/webkit/PerformanceTests/Speedometer/resources/todomvc/architecture-examples/react-redux/src/components/TodoTextInput.js
new file mode 100644
index 0000000000..cc09a3b0bb
--- /dev/null
+++ b/third_party/webkit/PerformanceTests/Speedometer/resources/todomvc/architecture-examples/react-redux/src/components/TodoTextInput.js
@@ -0,0 +1,53 @@
+import React, { Component, PropTypes } from 'react'
+import classnames from 'classnames'
+
+export default class TodoTextInput extends Component {
+  static propTypes = {
+    onSave: PropTypes.func.isRequired,
+    text: PropTypes.string,
+    placeholder: PropTypes.string,
+    editing: PropTypes.bool,
+    newTodo: PropTypes.bool
+  }
+
+  state = {
+    text: this.props.text || ''
+  }
+
+  handleSubmit = e => {
+    const text = e.target.value.trim()
+    if (e.which === 13) {
+      this.props.onSave(text)
+      if (this.props.newTodo) {
+        this.setState({ text: '' })
+      }
+    }
+  }
+
+  handleChange = e => {
+    this.setState({ text: e.target.value })
+  }
+
+  handleBlur = e => {
+    if (!this.props.newTodo) {
+      this.props.onSave(e.target.value)
+    }
+  }
+
+  render() {
+    return (
+      <input className={
+        classnames({
+          edit: this.props.editing,
+          'new-todo': this.props.newTodo
+        })}
+        type="text"
+        placeholder={this.props.placeholder}
+        autoFocus="true"
+        value={this.state.text}
+        onBlur={this.handleBlur}
+        onChange={this.handleChange}
+        onKeyDown={this.handleSubmit} />
+    )
+  }
+}