Merge e0a684b into ea1c29f

patw0929 · Jan 29, 2019 · ad60b8f · ad60b8f
2 parents ea1c29f + e0a684b
commit ad60b8f
Show file tree

Hide file tree

Showing 2 changed files with 23 additions and 8 deletions.
diff --git a/src/components/IntlTelInputApp.js b/src/components/IntlTelInputApp.js
@@ -806,7 +806,7 @@ class IntlTelInputApp extends Component {
     this.processPreferredCountries.call(this);
   };
 
-  handleOnBlur = (event) => {
+  handleOnBlur = e => {
     this.removeEmptyDialCode();
     if (typeof this.props.onPhoneNumberBlur === 'function') {
       const value = this.state.value;
@@ -819,7 +819,7 @@ class IntlTelInputApp extends Component {
         this.selectedCountryData,
         fullNumber,
         this.getExtension(value),
-        event
+        e
       );
     }
   };
@@ -1217,6 +1217,12 @@ class IntlTelInputApp extends Component {
     }
   };
 
+  handlePaste = e => {
+    if (e.clipboardData) {
+      this.updateFlagFromNumber(e.clipboardData.getData('Text'), false);
+    }
+  };
+
   changeHighlightCountry = (showDropdown, selectedIndex) => {
     this.setState({
       showDropdown,
@@ -1282,6 +1288,7 @@ class IntlTelInputApp extends Component {
           refCallback={this.setTelRef}
           handleInputChange={this.handleInputChange}
           handleOnBlur={this.handleOnBlur}
+          handlePaste={this.handlePaste}
           className={inputClass}
           disabled={this.state.disabled}
           readonly={this.state.readonly}

diff --git a/src/components/TelInput.js b/src/components/TelInput.js
@@ -11,6 +11,7 @@ export default class TelInput extends Component {
     value: PropTypes.string,
     placeholder: PropTypes.string,
     handleInputChange: PropTypes.func,
+    handlePaste: PropTypes.func,
     handleOnBlur: PropTypes.func,
     autoFocus: PropTypes.bool,
     autoComplete: PropTypes.string,
@@ -37,18 +38,24 @@ export default class TelInput extends Component {
     this.props.refCallback(element);
   };
 
-  inputOnBlur = event => {
+  handleBlur = e => {
     this.setState({ hasFocus: false });
 
-    if (this.props.handleOnBlur) {
-      this.props.handleOnBlur(event);
+    if (typeof this.props.handleOnBlur === 'function') {
+      this.props.handleOnBlur(e);
     }
   };
 
-  inputOnFocus = () => {
+  handleFocus = () => {
     this.setState({ hasFocus: true });
   };
 
+  handlePaste = e => {
+    if (typeof this.props.handlePaste === 'function') {
+      this.props.handlePaste(e);
+    }
+  };
+
   render() {
     return (
       <input
@@ -64,8 +71,9 @@ export default class TelInput extends Component {
         value={this.props.value}
         placeholder={this.props.placeholder}
         onChange={this.props.handleInputChange}
-        onBlur={this.inputOnBlur}
-        onFocus={this.inputOnFocus}
+        onPaste={this.handlePaste}
+        onBlur={this.handleBlur}
+        onFocus={this.handleFocus}
         autoFocus={this.props.autoFocus}
       />
     );