Merge pull request #6 from zberkom/add-variant-prop-support

Add TextField variant prop support
alexplumb · Mar 12, 2019 · fbf8ce9 · fbf8ce9
2 parents 07d7cee + 55d244f
commit fbf8ce9
Show file tree

Hide file tree

Showing 4 changed files with 16 additions and 6 deletions.
diff --git a/README.md b/README.md
@@ -169,6 +169,12 @@ function handleOnChange(value) {
     <td> boolean </td>
     <td colspan="2"> TextField error state </td>
   </tr>
+
+  <tr>
+    <td> variant </td>
+    <td> string </td>
+    <td colspan="2"> 'standard' by default </td>
+  </tr>
 </table>
 
 ### Regions

diff --git a/dist/index.js b/dist/index.js
diff --git a/package-lock.json b/package-lock.json
diff --git a/src/components/index.jsx b/src/components/index.jsx
@@ -45,6 +45,7 @@ class MaterialUiPhoneNumber extends React.Component {
     autoFocus: PropTypes.bool,
     helperText: PropTypes.string,
     error: PropTypes.bool,
+    variant: PropTypes.bool,
 
     inputClass: PropTypes.string,
     dropdownClass: PropTypes.string,
@@ -92,6 +93,7 @@ class MaterialUiPhoneNumber extends React.Component {
     label: null,
     helperText: null,
     error: false,
+    variant: 'standard',
 
     inputClass: '',
     dropdownClass: '',
@@ -108,7 +110,7 @@ class MaterialUiPhoneNumber extends React.Component {
 
     localization: {},
 
-    onEnterKeyPress: () => {},
+    onEnterKeyPress: () => { },
 
     isModernBrowser: () => (document.createElement ? Boolean(document.createElement('input').setSelectionRange) : false),
 
@@ -330,9 +332,9 @@ class MaterialUiPhoneNumber extends React.Component {
         remainingText: tail(acc.remainingText),
       };
     }, {
-      formattedText: '',
-      remainingText: text.split(''),
-    });
+        formattedText: '',
+        remainingText: text.split(''),
+      });
 
     let formattedNumber;
     if (enableLongNumbers) {
@@ -697,6 +699,7 @@ class MaterialUiPhoneNumber extends React.Component {
     const {
       classes, inputClass, helperText, required, disabled, autoFocus, error,
       name, label, dropdownClass, localization, disableDropdown, inputProps,
+      variant
     } = this.props;
 
     const inputFlagClasses = `flag ${selectedCountry.iso2}`;
@@ -767,6 +770,7 @@ class MaterialUiPhoneNumber extends React.Component {
 
     return (
       <TextField
+        variant={variant}
         placeholder={placeholder}
         value={formattedNumber}
         className={inputClass}