From b1e10ca30f49343c5a457b1937ed81a764190a7e Mon Sep 17 00:00:00 2001
From: ucozlab <submerged311@gmail.com>
Date: Sun, 28 Oct 2018 16:51:24 +0200
Subject: [PATCH] added onPhoneNumberFocus handler

---
 src/components/IntlTelInputApp.js | 16 ++++++++++++++++
 src/components/TelInput.js        |  2 ++
 2 files changed, 18 insertions(+)

diff --git a/src/components/IntlTelInputApp.js b/src/components/IntlTelInputApp.js
index e83281465..58d61a2cd 100644
--- a/src/components/IntlTelInputApp.js
+++ b/src/components/IntlTelInputApp.js
@@ -88,6 +88,7 @@ class IntlTelInputApp extends Component {
     this.autoCountryLoaded = this.autoCountryLoaded.bind(this);
     this.getDialCode = this.getDialCode.bind(this);
     this.handleOnBlur = this.handleOnBlur.bind(this);
+    this.handleOnFocus = this.handleOnFocus.bind(this);
     this.handleSelectedFlagKeydown = this.handleSelectedFlagKeydown.bind(this);
     this.setInitialState = this.setInitialState.bind(this);
     this.setNumber = this.setNumber.bind(this);
@@ -784,6 +785,18 @@ class IntlTelInputApp extends Component {
     }
   }
 
+  handleOnFocus() {
+    if (typeof this.props.onPhoneNumberFocus === 'function') {
+      const value = this.state.value;
+      const fullNumber = this.formatFullNumber(value);
+      const isValid = this.isValidNumber(fullNumber);
+
+      this.props.onPhoneNumberFocus(
+        isValid, value, this.selectedCountryData,
+        fullNumber, this.getExtension(value));
+    }
+  }
+
   bindDocumentClick() {
     this.isOpening = true;
     document.querySelector('html').addEventListener('click', this.handleDocumentClick);
@@ -1185,6 +1198,7 @@ class IntlTelInputApp extends Component {
           refCallback={ this.setTelRef }
           handleInputChange={ this.handleInputChange }
           handleOnBlur={ this.handleOnBlur }
+          handleOnFocus={ this.handleOnFocus }
           className={ inputClass }
           disabled={ this.state.disabled }
           readonly={ this.state.readonly }
@@ -1232,6 +1246,7 @@ IntlTelInputApp.propTypes = {
   utilsScript: PropTypes.string,
   onPhoneNumberChange: PropTypes.func,
   onPhoneNumberBlur: PropTypes.func,
+  onPhoneNumberFocus: PropTypes.func,
   onSelectFlag: PropTypes.func,
   disabled: PropTypes.bool,
   placeholder: PropTypes.string,
@@ -1283,6 +1298,7 @@ IntlTelInputApp.defaultProps = {
   utilsScript: '',
   onPhoneNumberChange: null,
   onPhoneNumberBlur: null,
+  onPhoneNumberFocus: null,
   onSelectFlag: null,
   disabled: false,
   autoFocus: false,
diff --git a/src/components/TelInput.js b/src/components/TelInput.js
index bfbfab783..1c069ae01 100644
--- a/src/components/TelInput.js
+++ b/src/components/TelInput.js
@@ -33,6 +33,7 @@ class TelInput extends Component {
         placeholder={ this.props.placeholder }
         onChange={ this.props.handleInputChange }
         onBlur={ this.props.handleOnBlur }
+        onFocus={ this.props.handleOnFocus }
         autoFocus={ this.props.autoFocus }
       />
     );
@@ -49,6 +50,7 @@ TelInput.propTypes = {
   placeholder: PropTypes.string,
   handleInputChange: PropTypes.func,
   handleOnBlur: PropTypes.func,
+  handleOnFocus: PropTypes.func,
   autoFocus: PropTypes.bool,
   autoComplete: PropTypes.string,
   inputProps: PropTypes.object, // eslint-disable-line react/forbid-prop-types