Get modal with embedded form working

website/src/ui/BoundButton.js

@@ -8,7 +8,7 @@ export default class BoundButton extends React.Component {
     name: PropTypes.string.isRequired,
     content: PropTypes.string,
     binder: PropTypes.object.isRequired,
-    submit: PropTypes.bool,
+    submit: PropTypes.string,
     onClick: PropTypes.func
   }
 

website/src/ui/Button.js

@@ -6,19 +6,25 @@ import { sizeInfo } from './style'
 
 class Button extends Component {
   static propTypes = {
-    submit: PropTypes.bool,
     children: PropTypes.node,
     visible: PropTypes.bool,
     disabled: PropTypes.bool,
     name: PropTypes.string,
     onClick: PropTypes.func,
+    submit: PropTypes.string,
+  }
+
+  static defaultProps = {
+    visible: true,
+    disabled: false,
   }
 
   render() {
     const { name, children, submit, visible, disabled, onClick } = this.props
 
     return (
-      <button name={name} type={!visible ? 'hidden' : submit ? 'submit' : 'button'} disabled={disabled}
+      <button name={name} type={!visible ? 'hidden' : submit ? 'submit' : 'button'}
+        disabled={disabled} form={submit}
         style={[style.base, { minWidth: sizeInfo.minButtonWidth }]} onClick={onClick}>
         {children}
       </button>

website/src/ui/Input.js

@@ -12,15 +12,16 @@ class Input extends Component {
     visible: PropTypes.bool,
     disabled: PropTypes.bool,
     name: PropTypes.string,
+    value: PropTypes.string,
   }
 
   render() {
-    let { name, width, password, placeholder, onChange, visible, disabled } = this.props
+    let { name, width, password, placeholder, onChange, visible, disabled, value } = this.props
 
     width = width || '100%'
 
     return (
-      <input name={name} type={!visible ? 'hidden' : password ? 'password' : 'text'} disabled={disabled}
+      <input name={name} value={value} type={!visible ? 'hidden' : password ? 'password' : 'text'} disabled={disabled}
         style={[ { width }, style.base ]} placeholder={placeholder} onChange={onChange} />
     )
   }

website/src/ui/Modal.js

@@ -9,15 +9,12 @@ class Modal extends Component {
     children: PropTypes.node,
     open: PropTypes.bool,
     width: PropTypes.oneOfType([ PropTypes.string, PropTypes.number ]),
-    // TODO: onCancel: PropTypes.func <- for handling ESC & enter key
   }
 
   static defaultProps = {
     width: '60%',
   }
 
-  // TODO: Capture ESC key https://stackoverflow.com/questions/3369593/how-to-detect-escape-key-press-with-pure-js-or-jquery
-
   render() {
     const { open, children, width } = this.props