fix forms, drop unneeded deps

Author: ShMcK

lib/components/Form/selectField.js

@@ -10,7 +10,7 @@ var __assign = (this && this.__assign) || Object.assign || function(t) {
 var React = require('react');
 var SelectField_1 = require('material-ui/SelectField');
 var selectField = function (_a, props) {
-    var children = _a.children, floatingLabelText = _a.floatingLabelText;
+    var children = _a.children, floatingLabelText = _a.floatingLabelText, id = _a.id;
     return (React.createElement(SelectField_1.default, __assign({value: props.value, floatingLabelText: floatingLabelText, errorText: props.touched && props.error}, props, {onChange: function (event, index, value) { return props.onChange(value); }}), children));
 };
 Object.defineProperty(exports, "__esModule", { value: true });

lib/components/Form/textField.js

@@ -10,8 +10,8 @@ var __assign = (this && this.__assign) || Object.assign || function(t) {
 var React = require('react');
 var TextField_1 = require('material-ui/TextField');
 var textField = function (_a, props) {
-    var hintText = _a.hintText, floatingLabelText = _a.floatingLabelText, disabled = _a.disabled;
-    return (React.createElement(TextField_1.default, __assign({className: 'native-key-bindings', hintText: hintText, floatingLabelText: floatingLabelText, disabled: disabled, errorText: props.touched && props.error}, props)));
+    var hintText = _a.hintText, floatingLabelText = _a.floatingLabelText, disabled = _a.disabled, id = _a.id;
+    return (React.createElement(TextField_1.default, __assign({id: id, className: 'native-key-bindings', hintText: hintText, floatingLabelText: floatingLabelText, disabled: disabled || false, errorText: props.touched && props.error}, props)));
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.default = textField;

lib/components/TutorialConfig/index.js

@@ -51,6 +51,12 @@ var TutorialConfig = (function (_super) {
         TopPanel_1.topElement.toggle(false);
         document.getElementsByTagName('input')[0].focus();
     };
+    TutorialConfig.prototype.shouldComponentUpdate = function () {
+        if (document.activeElement &&
+            typeof document.activeElement.value === 'string') {
+            return false;
+        }
+    };
     TutorialConfig.prototype.onSubmit = function (values) {
         var name = values.name, language = values.language, runner = values.runner;
         this.props.save(Object.assign({}, this.props.packageJson, {
@@ -65,16 +71,18 @@ var TutorialConfig = (function (_super) {
         return (React.createElement(Card_1.Card, {style: styles.card}, 
             React.createElement(Card_1.CardHeader, {title: 'Tutorial Configuration'}), 
             React.createElement("form", {onSubmit: handleSubmit(this.onSubmit.bind(this))}, 
-                React.createElement(redux_form_1.Field, {name: 'name', component: textField_1.default.bind(null, {
+                React.createElement(redux_form_1.Field, {id: 'name', name: 'name', component: textField_1.default.bind(null, {
                     hintText: 'coderoad-tutorial-name',
                 })}), 
                 React.createElement(redux_form_1.Field, {name: 'language', component: selectField_1.default.bind(null, {
                     children: languageItems_1.default(),
                     floatingLabelText: 'language',
+                    id: 'language',
                 })}), 
                 React.createElement(redux_form_1.Field, {name: 'runner', component: selectField_1.default.bind(null, {
                     children: runnerItems_1.default('JS'),
                     floatingLabelText: 'Test Runner',
+                    id: 'runner',
                 })}), 
                 React.createElement(RaisedButton_1.default, {type: 'submit', style: styles.button, label: 'Save', primary: true, disabled: invalid}), 
                 React.createElement(RaisedButton_1.default, {style: styles.button, label: 'Continue', secondary: true, disabled: invalid, onTouchTap: this.props.routeToPage.bind(this)}))));

lib/components/TutorialInfo/index.js

@@ -46,6 +46,13 @@ var TutorialInfo = (function (_super) {
     };
     TutorialInfo.prototype.componentDidMount = function () {
         TopPanel_1.topElement.toggle(false);
+        document.getElementsByTagName('input')[0].focus();
+    };
+    TutorialInfo.prototype.shouldComponentUpdate = function () {
+        if (document.activeElement &&
+            typeof document.activeElement.value === 'string') {
+            return false;
+        }
     };
     TutorialInfo.prototype.onSubmit = function (values) {
         var description = values.description, version = values.version, keywords = values.keywords;

lib/components/common/Markdown.js

@@ -25,10 +25,9 @@
   "dependencies": {
     "atom-plugin-command-line": "1.0.2",
     "coderoad-cli": "0.6.0",
-    "core-coderoad": "0.3.0",
+    "core-coderoad": "0.4.0",
     "highlights": "1.3.1",
     "lodash.debounce": "^4.0.6",
-    "marked": "0.3.5",
     "material-ui": "0.15.0",
     "node-file-exists": "1.1.0",
     "react": "15.1.0",

package.json

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import SelectField from 'material-ui/SelectField';
 
-const selectField = ({children, floatingLabelText}, props) => (
+const selectField = ({children, floatingLabelText, id}, props) => (
     <SelectField
       value={props.value}
       floatingLabelText={floatingLabelText}

src/components/Form/selectField.tsx

@@ -2,16 +2,15 @@ import * as React from 'react';
 import TextField from 'material-ui/TextField';
 
 const textField = ({
-  hintText, floatingLabelText, disabled
+  hintText, floatingLabelText, disabled, id
 }, props) => (
   <TextField
+    id={id}
     className='native-key-bindings'
     hintText={hintText}
     floatingLabelText={floatingLabelText}
-    disabled={disabled}
-    errorText={
-      props.touched && props.error
-    }
+    disabled={disabled || false}
+    errorText={props.touched && props.error}
     {...props}
   />
 );

src/components/Form/textField.tsx

@@ -55,6 +55,13 @@ class TutorialConfig extends React.Component <{
     // focus first element
     document.getElementsByTagName('input')[0].focus();
   }
+  shouldComponentUpdate() {
+    // hack to prevent lost focus on component update
+    if (document.activeElement &&
+      typeof document.activeElement.value === 'string') {
+      return false;
+    }
+  }
   onSubmit(values) {
     const {name, language, runner} = values;
     this.props.save(Object.assign(
@@ -78,6 +85,7 @@ class TutorialConfig extends React.Component <{
         <form onSubmit={handleSubmit(this.onSubmit.bind(this))}>
 
           <Field
+            id='name'
             name='name'
             component={textField.bind(null, {
               hintText: 'coderoad-tutorial-name',
@@ -89,6 +97,7 @@ class TutorialConfig extends React.Component <{
             component={selectField.bind(null, {
               children: languageItems(),
               floatingLabelText: 'language',
+              id: 'language',
             })}
           />
 
@@ -97,6 +106,7 @@ class TutorialConfig extends React.Component <{
             component={selectField.bind(null, {
               children: runnerItems('JS'),
               floatingLabelText: 'Test Runner',
+              id: 'runner',
             })}
           />
 
@@ -123,5 +133,5 @@ class TutorialConfig extends React.Component <{
 
 export default reduxForm({
   form: 'tutorialConfig',
-  validate,
+   validate,
 })(TutorialConfig);

src/components/TutorialConfig/index.tsx

@@ -40,6 +40,15 @@ class TutorialInfo extends React.Component<{
   }
   componentDidMount() {
     topElement.toggle(false);
+    // focus first element
+    document.getElementsByTagName('input')[0].focus();
+  }
+  shouldComponentUpdate() {
+    // hack to prevent lost focus on component update
+    if (document.activeElement &&
+      typeof document.activeElement.value === 'string') {
+      return false;
+    }
   }
   onSubmit(values) {
     const {description, version, keywords} = values;