Merge pull request #250 from Bustuk/master

Allow defaultCountry prop to accept both iso2 and dialCode

Author: iamstevendao

docs/documentation/v3.md

@@ -107,7 +107,7 @@ Read more on `vue-form-generator`'s [instruction page](https://icebob.gitbooks.i
   | -------- | ---- | ------------- | ----------- |
   | `autocomplete` | `String` | `'on'` | Native input 'autocomplete' attribute |
   | `autofocus` | `Boolean` | `false` | Native input 'autofocus' attribute |
-  | `defaultCountry` | `String` | `''` | Default country, will override the country fetched from IP address of user |
+  | `defaultCountry` | `String`  | `Number` | `''` | Default country (by iso2 or dialCode), will override the country fetched from IP address of user |
   | `disabled` | `Boolean` | `false` | Disable input field |
   | `disabledFetchingCountry` | `Boolean` | `false` | Disable fetching current country based on IP address of user |
   | `dropdownOptions` | `Object` | `{ disabledDialCode: false, tabindex: 0 }` | Options for dropdown, supporting `disabledDialCode` and `tabindex`| 

src/components/vue-tel-input.test.js

@@ -58,6 +58,17 @@ describe('Props', () => {
       expect(wrapper.find('.vti__selection > .vti__flag').classes()).toContain('au');
     });
   });
+  describe(':defaultCountryByDialCode', () => {
+    it('shows correct default country by dial code', async () => {
+      const wrapper = shallowMount(VueTelInput, {
+        propsData: {
+          defaultCountry: 48,
+        },
+      });
+      await Vue.nextTick();
+      expect(wrapper.find('.vti__selection > .vti__flag').classes()).toContain('pl');
+    });
+  });
   describe(':disabled', () => {
     it('adds disabled class to component', () => {
       const wrapper = shallowMount(VueTelInput, {

src/components/vue-tel-input.vue

@@ -110,7 +110,7 @@ export default {
     defaultCountry: {
       // Default country code, ie: 'AU'
       // Will override the current country of user
-      type: String,
+      type: [String, Number],
       default: () => getDefault('defaultCountry'),
     },
     disabled: {
@@ -351,9 +351,19 @@ export default {
          * 2. Use default country if passed from parent
          */
         if (this.defaultCountry) {
-          this.choose(this.defaultCountry);
-          resolve();
-          return;
+          if (typeof this.defaultCountry === 'string') {
+            this.choose(this.defaultCountry);
+            resolve();
+            return;
+          }
+          if (typeof this.defaultCountry === 'number') {
+            const country = this.findCountryByDialCode(this.defaultCountry);
+            if (country) {
+              this.choose(country.iso2);
+              resolve();
+              return;
+            }
+          }
         }
 
         const fallbackCountry = this.preferredCountries[0] || this.filteredCountries[0];
@@ -395,6 +405,9 @@ export default {
     findCountry(iso = '') {
       return this.filteredCountries.find((country) => country.iso2 === iso.toUpperCase());
     },
+    findCountryByDialCode(dialCode) {
+      return this.filteredCountries.find((country) => Number(country.dialCode) === dialCode);
+    },
     getItemClass(index, iso2) {
       const highlighted = this.selectedIndex === index;
       const lastPreferred = index === this.preferredCountries.length - 1;