Merge pull request #3260 from newoga/#2852/SelectField

[SelectField] Remove style-propable mixin
mui · Feb 10, 2016 · b79b2a8 · b79b2a8
2 parents 88d1af9 + 94d8e4f
commit b79b2a8
Showing 1 changed file with 23 additions and 28 deletions.
diff --git a/src/SelectField/SelectField.jsx b/src/SelectField/SelectField.jsx
@@ -1,10 +1,25 @@
 import React from 'react';
-import StylePropable from '../mixins/style-propable';
 import TextField from '../text-field';
 import DropDownMenu from '../DropDownMenu';
 import getMuiTheme from '../styles/getMuiTheme';
 import ContextPure from '../mixins/context-pure';
 
+function getStyles(props) {
+  return {
+    label: {
+      paddingLeft: 0,
+      top: props.floatingLabelText ? 6 : -4,
+    },
+    icon: {
+      right: 0,
+      top: props.floatingLabelText ? 22 : 14,
+    },
+    hideDropDownUnderline: {
+      borderTop: 'none',
+    },
+  };
+}
+
 const SelectField = React.createClass({
 
   propTypes: {
@@ -123,13 +138,11 @@ const SelectField = React.createClass({
     muiTheme: React.PropTypes.object,
   },
 
-  //for passing default theme context to children
   childContextTypes: {
     muiTheme: React.PropTypes.object,
   },
 
   mixins: [
-    StylePropable,
     ContextPure,
   ],
 
@@ -162,33 +175,13 @@ const SelectField = React.createClass({
     };
   },
 
-  //to update theme inside state whenever a new theme is passed down
-  //from the parent / owner using context
   componentWillReceiveProps(nextProps, nextContext) {
-    let newMuiTheme = nextContext.muiTheme ? nextContext.muiTheme : this.state.muiTheme;
-    this.setState({muiTheme: newMuiTheme});
-  },
-
-  getStyles() {
-    const {floatingLabelText} = this.props;
-
-    return {
-      label: {
-        paddingLeft: 0,
-        top: floatingLabelText ? 6 : -4,
-      },
-      icon: {
-        right: 0,
-        top: floatingLabelText ? 22 : 14,
-      },
-      hideDropDownUnderline: {
-        borderTop: 'none',
-      },
-    };
+    this.setState({
+      muiTheme: nextContext.muiTheme || this.state.muiTheme,
+    });
   },
 
   render() {
-    const styles = this.getStyles();
     const {
       autoWidth,
       children,
@@ -214,6 +207,8 @@ const SelectField = React.createClass({
       ...other,
     } = this.props;
 
+    const styles = getStyles(this.props, this.state);
+
     return (
       <TextField
         style={style}
@@ -233,8 +228,8 @@ const SelectField = React.createClass({
         <DropDownMenu
           disabled={disabled}
           style={selectFieldRoot}
-          labelStyle={this.mergeStyles(styles.label, labelStyle)}
-          iconStyle={this.mergeStyles(styles.icon, iconStyle)}
+          labelStyle={Object.assign(styles.label, labelStyle)}
+          iconStyle={Object.assign(styles.icon, iconStyle)}
           underlineStyle={styles.hideDropDownUnderline}
           autoWidth={autoWidth}
           value={value}