Added more keyboard options, testing some CTRL+ENTER

public/input/Input.jsx

@@ -28,17 +28,39 @@ import ButtonGroup from './button/ButtonGroup';
 import Form, { FormManager } from './form/Form';
 import InputGroup from './group/InputGroup';
 import Label from './label/Label';
-
+import Keyboard from './../keyboard/Keyboard';
 
 export default class Input extends React.Component {
   constructor(props) {
     super(props);
 
     this.state = {
-      value: props.value
+      value: props.value,
+      focused: false
     };
   }
 
+  isFocused() {
+    return this.state && this.state.focused === true;
+  }
+
+  componentDidMount() {
+    if(this.props.manager) this.props.manager.addInput(this);
+    Keyboard.addListener(this);
+  }
+
+  componentWillUnmount() {
+    if(this.props.manager) this.props.manager.removeInput(this);
+    Keyboard.removeListener(this);
+  }
+
+  onKeyUp(e, k) {
+    if(!this.props.manager) return;
+    if(!this.isFocused()) return;
+    if(!k.isSubmit()) return;
+    this.props.manager.submit();
+  }
+
   onChange(e, a, b) {
     //Try my props
     if(this.props.onChange && this.props.onChange(e) === false) return false;
@@ -54,12 +76,12 @@ export default class Input extends React.Component {
     });
   }
 
-  componentDidMount() {
-    if(this.props.manager) this.props.manager.addInput(this);
+  onFocus() {
+    this.setState({ focused: true });
   }
 
-  componentWillUnmount() {
-    if(this.props.manager) this.props.manager.removeInput(this);
+  onBlur() {
+    this.setState({ focused: false });
   }
 
   render() {
@@ -119,6 +141,8 @@ export default class Input extends React.Component {
           {...this.props}
           className={innerClazzes}
           onChange={this.onChange.bind(this)}
+          onFocus={this.onFocus.bind(this)}
+          onBlur={this.onBlur.bind(this)}
         >{ this.state.value }</textarea>
       );
 
@@ -126,6 +150,8 @@ export default class Input extends React.Component {
       element = (<ElementType
         {...this.props}
         onChange={this.onChange.bind(this)}
+        onFocus={this.onFocus.bind(this)}
+        onBlur={this.onBlur.bind(this)}
         type={type}
         value={ this.state.value }
         className={innerClazzes}

public/input/form/Form.jsx

@@ -57,13 +57,25 @@ export default class Form extends React.Component {
     this.state = s;
   }
 
+  componentDidMount() {
+    if(this.props.manager) this.props.manager.addForm(this);
+  }
+
+  componentWillUnmount() {
+    if(this.props.manager) this.props.manager.removeForm(this);
+  }
+
+  submit() {
+    this.onSubmit();
+  }
+
   onSubmit(e) {
     //Is Ajax?
     if(!this.state.ajax) {
       return this.state.onSubmit ? this.state.onSubmit(e) : true;
     }
 
-    e.preventDefault();
+    if(e) e.preventDefault();
     if(!this.state.action) return console.warning("This form has no action.");
     if(this.state.submitting) return false;//Already submitting?
 
@@ -166,6 +178,7 @@ export default class Form extends React.Component {
 
     return (
       <form
+        ref="formDOM"
         className={clazz}
         method={ this.state.method }
         autoComplete={ this.props.autoComplete }
@@ -186,17 +199,27 @@ class FormManager {
     this.inputs = [];
   }
 
-  addInput(input) {
-    this.inputs.push(input);
+  addForm(form) { this.forms.push(form); }
+  addInput(input) { this.inputs.push(input); }
+
+  removeForm(form) {
+    let i = this.forms.indexOf(form);
+    if(i === -1) return;
+    this.forms.splice(i, 1);
   }
 
   removeInput(input) {
-    let i = this.forms.indexOf(input);
+    let i = this.inputs.indexOf(input);
     if(i === -1) return;
     this.inputs.splice(i, 1);
   }
 
-  onChange(input, event) {
+  onChange(input, event) {}
+
+  submit() {
+    for(let i = 0; i < this.forms.length; i++) {
+      this.forms[i].submit();
+    }
   }
 
   getFormData() {