@intl-tel-input/react 28.0.1 → 28.0.3

package/README.md

@@ -1,9 +1,19 @@
-# IntlTelInput React Component
+# React component for intl-tel-input
 
-A React component for the [intl-tel-input](https://github.com/jackocnr/intl-tel-input) JavaScript plugin. View the [source code](https://github.com/jackocnr/intl-tel-input/blob/master/packages/react/src/IntlTelInput.tsx).
+For entering, formatting, and validating international telephone numbers.
 
 [Explore docs »](https://intl-tel-input.com/docs/react-component)
 
+<picture>
+  <source media="(prefers-color-scheme: dark)" srcset="https://raw.github.com/jackocnr/intl-tel-input/master/screenshots/iti-github-dark.png">
+  <source media="(prefers-color-scheme: light)" srcset="https://raw.github.com/jackocnr/intl-tel-input/master/screenshots/iti-github-light.png">
+  <img width="271" height="279" alt="intl-tel-input screenshot showing country dropdown open" src="https://raw.github.com/jackocnr/intl-tel-input/master/screenshots/iti-github-light.png">
+</picture>
+
+## Resources
+
+Check out the [website](https://intl-tel-input.com), where you can find [a full set of docs](https://intl-tel-input.com/docs/react-component), a [live playground](https://intl-tel-input.com/playground/) where you can try out all of the options, as well as plenty of [examples](https://intl-tel-input.com/examples/react-component/validation) of different setups.
+
 ## Running the demos locally
 
 1. Initialise the submodules: `git submodule update --init --recursive`
@@ -11,3 +21,11 @@ A React component for the [intl-tel-input](https://github.com/jackocnr/intl-tel-
 3. Build: `npm run build`
 
 You can then open `packages/react/demo/validation/index.html` in your browser to try the validation demo. View the full list of [available demos](https://github.com/jackocnr/intl-tel-input/tree/master/packages/react/demo).
+
+## Issues and contributing
+
+Please report issues and open pull requests on the [main repository](https://github.com/jackocnr/intl-tel-input).
+
+## License
+
+MIT

package/dist/IntlTelInput.js

@@ -1738,7 +1738,7 @@ var allCountries = [];
 for (const c of rawCountryData) {
   allCountries.push({
     name: "",
-    // populated in the plugin
+    // populated in the core library
     iso2: c[0],
     dialCode: c[1],
     priority: c[2] || 0,
@@ -1958,14 +1958,14 @@ var defaults = {
   geoIpLookup: null,
   //* Inject a hidden input with the name returned from this function, and on submit, populate it with the result of getNumber.
   hiddenInput: null,
-  //* Internationalise the plugin text e.g. search input placeholder, country names.
+  //* Internationalise the core library text e.g. search input placeholder, country names.
   i18n: {},
   //* Initial country.
   initialCountry: "",
   //* A function to load the utils script.
   loadUtils: null,
   //* National vs international formatting for numbers e.g. placeholders and displaying existing numbers.
-  nationalMode: true,
+  nationalMode: false,
   //* Display only these countries.
   onlyCountries: null,
   //* Number type to use for placeholders.
@@ -2447,7 +2447,7 @@ var UI = class _UI {
       );
     }
   }
-  //* Generate all of the markup for the plugin: the selected country overlay, and the dropdown.
+  //* Generate all of the markup for the core library: the selected country overlay, and the dropdown.
   buildMarkup(countries, searchTokens) {
     this.#countries = countries;
     this.#searchTokens = searchTokens;
@@ -4374,7 +4374,7 @@ var Iti = class _Iti {
   //********************
   //*  PUBLIC METHODS
   //********************
-  //* Remove plugin.
+  //* Remove core library.
   destroy() {
     if (!this.#isActive) {
       return;
@@ -4623,7 +4623,7 @@ var intlTelInput = Object.assign(
     documentReady: () => document.readyState === "complete",
     //* Get the country data object.
     getCountryData: () => data_default,
-    //* A getter for the plugin instance.
+    //* A getter for the core library instance.
     getInstance: (input) => {
       const id = input.dataset[DATA_KEYS.INSTANCE_ID];
       return id ? intlTelInput.instances.get(id) ?? null : null;
@@ -4633,7 +4633,7 @@ var intlTelInput = Object.assign(
     attachUtils,
     startedLoadingUtils: false,
     startedLoadingAutoCountry: false,
-    version: "28.0.1",
+    version: "28.0.3",
     NUMBER_FORMAT,
     NUMBER_TYPE,
     VALIDATION_ERROR
@@ -4671,7 +4671,7 @@ var IntlTelInput = forwardRef(function IntlTelInput2({
 }, ref) {
   const inputRef = useRef(null);
   const itiRef = useRef(null);
-  const pluginInputClassesRef = useRef("");
+  const libraryInputClassesRef = useRef("");
   const lastEmittedNumberRef = useRef(void 0);
   const lastEmittedCountryRef = useRef(void 0);
   const lastEmittedValidityRef = useRef(void 0);
@@ -4738,7 +4738,7 @@ var IntlTelInput = forwardRef(function IntlTelInput2({
       return void 0;
     }
     itiRef.current = intlTelInput_default(inputEl, initOptions);
-    pluginInputClassesRef.current = inputEl.className;
+    libraryInputClassesRef.current = inputEl.className;
     const handleOpen = () => onOpenCountryDropdownRef.current?.();
     const handleClose = () => onCloseCountryDropdownRef.current?.();
     const handleStrictReject = (e) => {
@@ -4802,7 +4802,7 @@ var IntlTelInput = forwardRef(function IntlTelInput2({
     if (ignoredInputProps.has(key)) {
       warnInputProp(key);
     } else if (key === "className") {
-      sanitizedInputProps[key] = `${pluginInputClassesRef.current} ${val}`;
+      sanitizedInputProps[key] = `${libraryInputClassesRef.current} ${val}`;
     } else {
       sanitizedInputProps[key] = val;
     }

package/dist/IntlTelInputWithUtils.js

@@ -1738,7 +1738,7 @@ var allCountries = [];
 for (const c of rawCountryData) {
   allCountries.push({
     name: "",
-    // populated in the plugin
+    // populated in the core library
     iso2: c[0],
     dialCode: c[1],
     priority: c[2] || 0,
@@ -1958,14 +1958,14 @@ var defaults = {
   geoIpLookup: null,
   //* Inject a hidden input with the name returned from this function, and on submit, populate it with the result of getNumber.
   hiddenInput: null,
-  //* Internationalise the plugin text e.g. search input placeholder, country names.
+  //* Internationalise the core library text e.g. search input placeholder, country names.
   i18n: {},
   //* Initial country.
   initialCountry: "",
   //* A function to load the utils script.
   loadUtils: null,
   //* National vs international formatting for numbers e.g. placeholders and displaying existing numbers.
-  nationalMode: true,
+  nationalMode: false,
   //* Display only these countries.
   onlyCountries: null,
   //* Number type to use for placeholders.
@@ -2447,7 +2447,7 @@ var UI = class _UI {
       );
     }
   }
-  //* Generate all of the markup for the plugin: the selected country overlay, and the dropdown.
+  //* Generate all of the markup for the core library: the selected country overlay, and the dropdown.
   buildMarkup(countries, searchTokens) {
     this.#countries = countries;
     this.#searchTokens = searchTokens;
@@ -4374,7 +4374,7 @@ var Iti = class _Iti {
   //********************
   //*  PUBLIC METHODS
   //********************
-  //* Remove plugin.
+  //* Remove core library.
   destroy() {
     if (!this.#isActive) {
       return;
@@ -4623,7 +4623,7 @@ var intlTelInput = Object.assign(
     documentReady: () => document.readyState === "complete",
     //* Get the country data object.
     getCountryData: () => data_default,
-    //* A getter for the plugin instance.
+    //* A getter for the core library instance.
     getInstance: (input) => {
       const id = input.dataset[DATA_KEYS.INSTANCE_ID];
       return id ? intlTelInput.instances.get(id) ?? null : null;
@@ -4633,7 +4633,7 @@ var intlTelInput = Object.assign(
     attachUtils,
     startedLoadingUtils: false,
     startedLoadingAutoCountry: false,
-    version: "28.0.1",
+    version: "28.0.3",
     NUMBER_FORMAT,
     NUMBER_TYPE,
     VALIDATION_ERROR
@@ -11025,7 +11025,7 @@ var IntlTelInput = forwardRef(function IntlTelInput2({
 }, ref) {
   const inputRef = useRef(null);
   const itiRef = useRef(null);
-  const pluginInputClassesRef = useRef("");
+  const libraryInputClassesRef = useRef("");
   const lastEmittedNumberRef = useRef(void 0);
   const lastEmittedCountryRef = useRef(void 0);
   const lastEmittedValidityRef = useRef(void 0);
@@ -11092,7 +11092,7 @@ var IntlTelInput = forwardRef(function IntlTelInput2({
       return void 0;
     }
     itiRef.current = intlTelInput_default(inputEl, initOptions);
-    pluginInputClassesRef.current = inputEl.className;
+    libraryInputClassesRef.current = inputEl.className;
     const handleOpen = () => onOpenCountryDropdownRef.current?.();
     const handleClose = () => onCloseCountryDropdownRef.current?.();
     const handleStrictReject = (e) => {
@@ -11156,7 +11156,7 @@ var IntlTelInput = forwardRef(function IntlTelInput2({
     if (ignoredInputProps.has(key)) {
       warnInputProp(key);
     } else if (key === "className") {
-      sanitizedInputProps[key] = `${pluginInputClassesRef.current} ${val}`;
+      sanitizedInputProps[key] = `${libraryInputClassesRef.current} ${val}`;
     } else {
       sanitizedInputProps[key] = val;
     }

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@intl-tel-input/react",
-  "version": "28.0.1",
-  "description": "A React component for the intl-tel-input JavaScript plugin",
+  "version": "28.0.3",
+  "description": "A React component for intl-tel-input, for entering, formatting, and validating international telephone numbers",
   "type": "module",
   "license": "MIT",
   "author": "Jack O'Connor (http://jackocnr.com)",
@@ -34,7 +34,7 @@
     "README.md"
   ],
   "dependencies": {
-    "intl-tel-input": "^28.0.1"
+    "intl-tel-input": "^28.0.3"
   },
   "peerDependencies": {
     "react": ">=18",