svelte cmp fix: usePreciseValidation prop instead of strictMode

Author: jackocnr

grunt/watch.js

@@ -27,6 +27,10 @@ module.exports = function(grunt) {
       files: ["vue/src/intl-tel-input/IntlTelInput.vue"],
       tasks: "build:vue"
     },
+    svelte: {
+      files: ["svelte/src/intl-tel-input/IntlTelInput.svelte"],
+      tasks: "build:svelte"
+    },
     angular: {
       files: [
         "angular/src/intl-tel-input/angular.tsx",

site/src/docs/svelte_component.md

@@ -96,6 +96,12 @@ Default: `null`
 
 A handler to be called when the number validity changes, e.g. to true/false. It will be passed the new isValid boolean.
 
+###### usePreciseValidation
+Type: `Boolean`
+Default: `false`  
+
+By default, we use `isValidNumber` for validation, but if you'd rather use `isValidNumberPrecise`, you can set this to `true`.
+
 ## Accessing Instance Methods
 
 You can access all of the plugin's [instance methods](/docs/methods#instance-methods) (`setNumber`, `setCountry`, `setPlaceholderNumberType`, etc.) by passing a ref into the IntlTelInput component (using `bind:this`), and then calling the `getInstance()` method, e.g. `ref.getInstance().setNumber(...);`. See the [Set Number demo](https://github.com/jackocnr/intl-tel-input/blob/master/svelte/demo/set-number/App.svelte) for a full example. You can also access the input DOM element via: `ref.getInput()`.

svelte/src/intl-tel-input/IntlTelInput.svelte

@@ -9,6 +9,7 @@
     disabled = false,
     inputProps = {},
     options = {},
+    usePreciseValidation = false,
     value = "",
     onChangeNumber,
     onChangeCountry,
@@ -19,6 +20,7 @@
     inputProps?: Record<string, unknown>;
     options?: SomeOptions;
     value?: string;
+    usePreciseValidation?: boolean;
     onChangeNumber?: (number: string) => void;
     onChangeCountry?: (country: string) => void;
     onChangeValidity?: (valid: boolean) => void;
@@ -34,7 +36,7 @@
   // Validation helper
   const isValid = (): boolean | null => {
     if (!instance) return null;
-    return options.strictMode
+    return usePreciseValidation
       ? instance.isValidNumberPrecise()
       : instance.isValidNumber();
   };

svelte/src/intl-tel-input/IntlTelInputWithUtils.svelte

@@ -10,6 +10,7 @@ import intlTelInput from "./intlTelInputWithUtils";
     disabled = false,
     inputProps = {},
     options = {},
+    usePreciseValidation = false,
     value = "",
     onChangeNumber,
     onChangeCountry,
@@ -20,6 +21,7 @@ import intlTelInput from "./intlTelInputWithUtils";
     inputProps?: Record<string, unknown>;
     options?: SomeOptions;
     value?: string;
+    usePreciseValidation?: boolean;
     onChangeNumber?: (number: string) => void;
     onChangeCountry?: (country: string) => void;
     onChangeValidity?: (valid: boolean) => void;
@@ -35,7 +37,7 @@ import intlTelInput from "./intlTelInputWithUtils";
   // Validation helper
   const isValid = (): boolean | null => {
     if (!instance) return null;
-    return options.strictMode
+    return usePreciseValidation
       ? instance.isValidNumberPrecise()
       : instance.isValidNumber();
   };