svelte-tel-input 0.5.1 → 0.6.2

package/CHANGELOG.md

@@ -1,5 +1,23 @@
 # svelte-tel-input
 
+## 0.6.2
+
+### Patch Changes
+
+- Update readme & update packages ([#54](https://github.com/gyurielf/svelte-tel-input/pull/54))
+
+## 0.6.1
+
+### Patch Changes
+
+- Readme update ([#52](https://github.com/gyurielf/svelte-tel-input/pull/52))
+
+## 0.6.0
+
+### Minor Changes
+
+- feat: example page preparations & extend functionality (part 1) ([#50](https://github.com/gyurielf/svelte-tel-input/pull/50))
+
 ## 0.5.1
 
 ### Patch Changes

package/README.md

@@ -4,6 +4,8 @@
 
 <ins>Do not use it before 1.0, it won't works properly!</ins>
 
+Lightweight phone input standardization.
+
 ## Installation
 
 Svelte Tel Input is distributed via [npm](https://www.npmjs.com/package/svelte-tel-input).

package/assets/allCountry.d.ts

@@ -0,0 +1,3 @@
+import type { Country } from '../models/interfaces/Country.interface';
+declare const restructuredCountries: Country[];
+export default restructuredCountries;

package/assets/allCountry.js

@@ -0,0 +1,306 @@
+// Array of country objects for the flag dropdown.
+const allCountries = [
+    ['Afghanistan (‫افغانستان‬‎)', 'af', '93'],
+    ['Albania (Shqipëri)', 'al', '355'],
+    ['Algeria (‫الجزائر‬‎)', 'dz', '213'],
+    ['American Samoa', 'as', '1', 5, ['684']],
+    ['Andorra', 'ad', '376'],
+    ['Angola', 'ao', '244'],
+    ['Anguilla', 'ai', '1', 6, ['264']],
+    ['Antigua and Barbuda', 'ag', '1', 7, ['268']],
+    ['Argentina', 'ar', '54'],
+    ['Armenia (Հայաստան)', 'am', '374'],
+    ['Aruba', 'aw', '297'],
+    ['Ascension Island', 'ac', '247'],
+    ['Australia', 'au', '61', 0],
+    ['Austria (Österreich)', 'at', '43'],
+    ['Azerbaijan (Azərbaycan)', 'az', '994'],
+    ['Bahamas', 'bs', '1', 8, ['242']],
+    ['Bahrain (‫البحرين‬‎)', 'bh', '973'],
+    ['Bangladesh (বাংলাদেশ)', 'bd', '880'],
+    ['Barbados', 'bb', '1', 9, ['246']],
+    ['Belarus (Беларусь)', 'by', '375'],
+    ['Belgium (België)', 'be', '32'],
+    ['Belize', 'bz', '501'],
+    ['Benin (Bénin)', 'bj', '229'],
+    ['Bermuda', 'bm', '1', 10, ['441']],
+    ['Bhutan (འབྲུག)', 'bt', '975'],
+    ['Bolivia', 'bo', '591'],
+    ['Bosnia and Herzegovina (Босна и Херцеговина)', 'ba', '387'],
+    ['Botswana', 'bw', '267'],
+    ['Brazil (Brasil)', 'br', '55'],
+    ['British Indian Ocean Territory', 'io', '246'],
+    ['British Virgin Islands', 'vg', '1', 11, ['284']],
+    ['Brunei', 'bn', '673'],
+    ['Bulgaria (България)', 'bg', '359'],
+    ['Burkina Faso', 'bf', '226'],
+    ['Burundi (Uburundi)', 'bi', '257'],
+    ['Cambodia (កម្ពុជា)', 'kh', '855'],
+    ['Cameroon (Cameroun)', 'cm', '237'],
+    [
+        'Canada',
+        'ca',
+        '1',
+        1,
+        [
+            '204',
+            '226',
+            '236',
+            '249',
+            '250',
+            '289',
+            '306',
+            '343',
+            '365',
+            '387',
+            '403',
+            '416',
+            '418',
+            '431',
+            '437',
+            '438',
+            '450',
+            '506',
+            '514',
+            '519',
+            '548',
+            '579',
+            '581',
+            '587',
+            '604',
+            '613',
+            '639',
+            '647',
+            '672',
+            '705',
+            '709',
+            '742',
+            '778',
+            '780',
+            '782',
+            '807',
+            '819',
+            '825',
+            '867',
+            '873',
+            '902',
+            '905'
+        ]
+    ],
+    ['Cape Verde (Kabu Verdi)', 'cv', '238'],
+    ['Caribbean Netherlands', 'bq', '599', 1, ['3', '4', '7']],
+    ['Cayman Islands', 'ky', '1', 12, ['345']],
+    ['Central African Republic (République centrafricaine)', 'cf', '236'],
+    ['Chad (Tchad)', 'td', '235'],
+    ['Chile', 'cl', '56'],
+    ['China (中国)', 'cn', '86'],
+    ['Christmas Island', 'cx', '61', 2, ['89164']],
+    ['Cocos (Keeling) Islands', 'cc', '61', 1, ['89162']],
+    ['Colombia', 'co', '57'],
+    ['Comoros (‫جزر القمر‬‎)', 'km', '269'],
+    ['Congo (DRC) (Jamhuri ya Kidemokrasia ya Kongo)', 'cd', '243'],
+    ['Congo (Republic) (Congo-Brazzaville)', 'cg', '242'],
+    ['Cook Islands', 'ck', '682'],
+    ['Costa Rica', 'cr', '506'],
+    ['Côte d’Ivoire', 'ci', '225'],
+    ['Croatia (Hrvatska)', 'hr', '385'],
+    ['Cuba', 'cu', '53'],
+    ['Curaçao', 'cw', '599', 0],
+    ['Cyprus (Κύπρος)', 'cy', '357'],
+    ['Czech Republic (Česká republika)', 'cz', '420'],
+    ['Denmark (Danmark)', 'dk', '45'],
+    ['Djibouti', 'dj', '253'],
+    ['Dominica', 'dm', '1', 13, ['767']],
+    ['Dominican Republic (República Dominicana)', 'do', '1', 2, ['809', '829', '849']],
+    ['Ecuador', 'ec', '593'],
+    ['Egypt (‫مصر‬‎)', 'eg', '20'],
+    ['El Salvador', 'sv', '503'],
+    ['Equatorial Guinea (Guinea Ecuatorial)', 'gq', '240'],
+    ['Eritrea', 'er', '291'],
+    ['Estonia (Eesti)', 'ee', '372'],
+    ['Eswatini', 'sz', '268'],
+    ['Ethiopia', 'et', '251'],
+    ['Falkland Islands (Islas Malvinas)', 'fk', '500'],
+    ['Faroe Islands (Føroyar)', 'fo', '298'],
+    ['Fiji', 'fj', '679'],
+    ['Finland (Suomi)', 'fi', '358', 0],
+    ['France', 'fr', '33'],
+    ['French Guiana (Guyane française)', 'gf', '594'],
+    ['French Polynesia (Polynésie française)', 'pf', '689'],
+    ['Gabon', 'ga', '241'],
+    ['Gambia', 'gm', '220'],
+    ['Georgia (საქართველო)', 'ge', '995'],
+    ['Germany (Deutschland)', 'de', '49'],
+    ['Ghana (Gaana)', 'gh', '233'],
+    ['Gibraltar', 'gi', '350'],
+    ['Greece (Ελλάδα)', 'gr', '30'],
+    ['Greenland (Kalaallit Nunaat)', 'gl', '299'],
+    ['Grenada', 'gd', '1', 14, ['473']],
+    ['Guadeloupe', 'gp', '590', 0],
+    ['Guam', 'gu', '1', 15, ['671']],
+    ['Guatemala', 'gt', '502'],
+    ['Guernsey', 'gg', '44', 1, ['1481', '7781', '7839', '7911']],
+    ['Guinea (Guinée)', 'gn', '224'],
+    ['Guinea-Bissau (Guiné Bissau)', 'gw', '245'],
+    ['Guyana', 'gy', '592'],
+    ['Haiti', 'ht', '509'],
+    ['Honduras', 'hn', '504'],
+    ['Hong Kong (香港)', 'hk', '852'],
+    ['Hungary (Magyarország)', 'hu', '36'],
+    ['Iceland (Ísland)', 'is', '354'],
+    ['India (भारत)', 'in', '91'],
+    ['Indonesia', 'id', '62'],
+    ['Iran (‫ایران‬‎)', 'ir', '98'],
+    ['Iraq (‫العراق‬‎)', 'iq', '964'],
+    ['Ireland', 'ie', '353'],
+    ['Isle of Man', 'im', '44', 2, ['1624', '74576', '7524', '7924', '7624']],
+    ['Israel (‫ישראל‬‎)', 'il', '972'],
+    ['Italy (Italia)', 'it', '39', 0],
+    ['Jamaica', 'jm', '1', 4, ['876', '658']],
+    ['Japan (日本)', 'jp', '81'],
+    ['Jersey', 'je', '44', 3, ['1534', '7509', '7700', '7797', '7829', '7937']],
+    ['Jordan (‫الأردن‬‎)', 'jo', '962'],
+    ['Kazakhstan (Казахстан)', 'kz', '7', 1, ['33', '7']],
+    ['Kenya', 'ke', '254'],
+    ['Kiribati', 'ki', '686'],
+    ['Kosovo', 'xk', '383'],
+    ['Kuwait (‫الكويت‬‎)', 'kw', '965'],
+    ['Kyrgyzstan (Кыргызстан)', 'kg', '996'],
+    ['Laos (ລາວ)', 'la', '856'],
+    ['Latvia (Latvija)', 'lv', '371'],
+    ['Lebanon (‫لبنان‬‎)', 'lb', '961'],
+    ['Lesotho', 'ls', '266'],
+    ['Liberia', 'lr', '231'],
+    ['Libya (‫ليبيا‬‎)', 'ly', '218'],
+    ['Liechtenstein', 'li', '423'],
+    ['Lithuania (Lietuva)', 'lt', '370'],
+    ['Luxembourg', 'lu', '352'],
+    ['Macau (澳門)', 'mo', '853'],
+    ['North Macedonia (Македонија)', 'mk', '389'],
+    ['Madagascar (Madagasikara)', 'mg', '261'],
+    ['Malawi', 'mw', '265'],
+    ['Malaysia', 'my', '60'],
+    ['Maldives', 'mv', '960'],
+    ['Mali', 'ml', '223'],
+    ['Malta', 'mt', '356'],
+    ['Marshall Islands', 'mh', '692'],
+    ['Martinique', 'mq', '596'],
+    ['Mauritania (‫موريتانيا‬‎)', 'mr', '222'],
+    ['Mauritius (Moris)', 'mu', '230'],
+    ['Mayotte', 'yt', '262', 1, ['269', '639']],
+    ['Mexico (México)', 'mx', '52'],
+    ['Micronesia', 'fm', '691'],
+    ['Moldova (Republica Moldova)', 'md', '373'],
+    ['Monaco', 'mc', '377'],
+    ['Mongolia (Монгол)', 'mn', '976'],
+    ['Montenegro (Crna Gora)', 'me', '382'],
+    ['Montserrat', 'ms', '1', 16, ['664']],
+    ['Morocco (‫المغرب‬‎)', 'ma', '212', 0],
+    ['Mozambique (Moçambique)', 'mz', '258'],
+    ['Myanmar (Burma) (မြန်မာ)', 'mm', '95'],
+    ['Namibia (Namibië)', 'na', '264'],
+    ['Nauru', 'nr', '674'],
+    ['Nepal (नेपाल)', 'np', '977'],
+    ['Netherlands (Nederland)', 'nl', '31'],
+    ['New Caledonia (Nouvelle-Calédonie)', 'nc', '687'],
+    ['New Zealand', 'nz', '64'],
+    ['Nicaragua', 'ni', '505'],
+    ['Niger (Nijar)', 'ne', '227'],
+    ['Nigeria', 'ng', '234'],
+    ['Niue', 'nu', '683'],
+    ['Norfolk Island', 'nf', '672'],
+    ['North Korea (조선 민주주의 인민 공화국)', 'kp', '850'],
+    ['Northern Mariana Islands', 'mp', '1', 17, ['670']],
+    ['Norway (Norge)', 'no', '47', 0],
+    ['Oman (‫عُمان‬‎)', 'om', '968'],
+    ['Pakistan (‫پاکستان‬‎)', 'pk', '92'],
+    ['Palau', 'pw', '680'],
+    ['Palestine (‫فلسطين‬‎)', 'ps', '970'],
+    ['Panama (Panamá)', 'pa', '507'],
+    ['Papua New Guinea', 'pg', '675'],
+    ['Paraguay', 'py', '595'],
+    ['Peru (Perú)', 'pe', '51'],
+    ['Philippines', 'ph', '63'],
+    ['Poland (Polska)', 'pl', '48'],
+    ['Portugal', 'pt', '351'],
+    ['Puerto Rico', 'pr', '1', 3, ['787', '939']],
+    ['Qatar (‫قطر‬‎)', 'qa', '974'],
+    ['Réunion (La Réunion)', 're', '262', 0],
+    ['Romania (România)', 'ro', '40'],
+    ['Russia (Россия)', 'ru', '7', 0],
+    ['Rwanda', 'rw', '250'],
+    ['Saint Barthélemy', 'bl', '590', 1],
+    ['Saint Helena', 'sh', '290'],
+    ['Saint Kitts and Nevis', 'kn', '1', 18, ['869']],
+    ['Saint Lucia', 'lc', '1', 19, ['758']],
+    ['Saint Martin (Saint-Martin (partie française))', 'mf', '590', 2],
+    ['Saint Pierre and Miquelon (Saint-Pierre-et-Miquelon)', 'pm', '508'],
+    ['Saint Vincent and the Grenadines', 'vc', '1', 20, ['784']],
+    ['Samoa', 'ws', '685'],
+    ['San Marino', 'sm', '378'],
+    ['São Tomé and Príncipe (São Tomé e Príncipe)', 'st', '239'],
+    ['Saudi Arabia (‫المملكة العربية السعودية‬‎)', 'sa', '966'],
+    ['Senegal (Sénégal)', 'sn', '221'],
+    ['Serbia (Србија)', 'rs', '381'],
+    ['Seychelles', 'sc', '248'],
+    ['Sierra Leone', 'sl', '232'],
+    ['Singapore', 'sg', '65'],
+    ['Sint Maarten', 'sx', '1', 21, ['721']],
+    ['Slovakia (Slovensko)', 'sk', '421'],
+    ['Slovenia (Slovenija)', 'si', '386'],
+    ['Solomon Islands', 'sb', '677'],
+    ['Somalia (Soomaaliya)', 'so', '252'],
+    ['South Africa', 'za', '27'],
+    ['South Korea (대한민국)', 'kr', '82'],
+    ['South Sudan (‫جنوب السودان‬‎)', 'ss', '211'],
+    ['Spain (España)', 'es', '34'],
+    ['Sri Lanka (ශ්‍රී ලංකාව)', 'lk', '94'],
+    ['Sudan (‫السودان‬‎)', 'sd', '249'],
+    ['Suriname', 'sr', '597'],
+    ['Svalbard and Jan Mayen', 'sj', '47', 1, ['79']],
+    ['Sweden (Sverige)', 'se', '46'],
+    ['Switzerland (Schweiz)', 'ch', '41'],
+    ['Syria (‫سوريا‬‎)', 'sy', '963'],
+    ['Taiwan (台灣)', 'tw', '886'],
+    ['Tajikistan', 'tj', '992'],
+    ['Tanzania', 'tz', '255'],
+    ['Thailand (ไทย)', 'th', '66'],
+    ['Timor-Leste', 'tl', '670'],
+    ['Togo', 'tg', '228'],
+    ['Tokelau', 'tk', '690'],
+    ['Tonga', 'to', '676'],
+    ['Trinidad and Tobago', 'tt', '1', 22, ['868']],
+    ['Tunisia (‫تونس‬‎)', 'tn', '216'],
+    ['Turkey (Türkiye)', 'tr', '90'],
+    ['Turkmenistan', 'tm', '993'],
+    ['Turks and Caicos Islands', 'tc', '1', 23, ['649']],
+    ['Tuvalu', 'tv', '688'],
+    ['U.S. Virgin Islands', 'vi', '1', 24, ['340']],
+    ['Uganda', 'ug', '256'],
+    ['Ukraine (Україна)', 'ua', '380'],
+    ['United Arab Emirates (‫الإمارات العربية المتحدة‬‎)', 'ae', '971'],
+    ['United Kingdom', 'gb', '44', 0],
+    ['United States', 'us', '1', 0],
+    ['Uruguay', 'uy', '598'],
+    ['Uzbekistan (Oʻzbekiston)', 'uz', '998'],
+    ['Vanuatu', 'vu', '678'],
+    ['Vatican City (Città del Vaticano)', 'va', '39', 1, ['06698']],
+    ['Venezuela', 've', '58'],
+    ['Vietnam (Việt Nam)', 'vn', '84'],
+    ['Wallis and Futuna (Wallis-et-Futuna)', 'wf', '681'],
+    ['Western Sahara (‫الصحراء الغربية‬‎)', 'eh', '212', 1, ['5288', '5289']],
+    ['Yemen (‫اليمن‬‎)', 'ye', '967'],
+    ['Zambia', 'zm', '260'],
+    ['Zimbabwe', 'zw', '263'],
+    ['Åland Islands', 'ax', '358', 1, ['18']]
+];
+const restructuredCountries = allCountries.map((country) => {
+    return {
+        name: country[0],
+        iso2: country[1],
+        dialCode: country[2],
+        priority: country[3] || 0,
+        areaCodes: country[4] || null
+    };
+});
+export default restructuredCountries;

package/components/Input/TelInput.svelte

@@ -1,4 +1,4 @@
-<script >import { enteredTelInputStore } from '../../stores';
+<script>import { enteredTelInputStore } from '../../stores';
 import { parsePhoneNumberWithError, ParseError } from 'libphonenumber-js';
 export let enteredTelInput;
 const handleInput = (event) => {

package/components/Select/Select.svelte

@@ -0,0 +1,41 @@
+<script>import { clickOutsideAction } from '../../utils/directives/clickOutsideAction';
+export let selectOptions = {
+    searchInput: false,
+    flags: true
+};
+export let items;
+let isOpen = false;
+let enteredSearch;
+const toggleSelect = (e) => {
+    e === null || e === void 0 ? void 0 : e.preventDefault();
+    isOpen = !isOpen;
+};
+const closeSelect = (e) => {
+    e === null || e === void 0 ? void 0 : e.preventDefault();
+    isOpen = false;
+};
+</script>
+
+<div class="select cursor-pointer" use:clickOutsideAction={closeSelect}>
+    <div on:click={() => toggleSelect()}>CHOOSE</div>
+    {#if isOpen}
+        <ul class="border border-gray-900 max-h-40 w-fit overflow-y-scroll">
+            {#if !selectOptions.searchInput}
+                <input
+                    type="text"
+                    class="px-4 py-1 text-gray-900 focus:outline-none w-full"
+                    bind:value={enteredSearch}
+                />
+            {/if}
+            {#each items as item}
+                <li class="p-2 bg-gray-600 hover:bg-opacity-30">
+                    <span class="mr-3">{item.name}</span> +{item.dialCode}
+                </li>
+            {:else}
+                <div>List is on the way..</div>
+            {/each}
+        </ul>
+    {/if}
+</div>
+
+<style></style>

package/components/Select/Select.svelte.d.ts

@@ -0,0 +1,21 @@
+import { SvelteComponentTyped } from "svelte";
+import type { Country } from '../../models/interfaces/Country.interface';
+declare const __propDef: {
+    props: {
+        selectOptions?: {
+            searchInput: boolean;
+            flags: boolean;
+        } | undefined;
+        items: Country[];
+    };
+    events: {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {};
+};
+export declare type SelectProps = typeof __propDef.props;
+export declare type SelectEvents = typeof __propDef.events;
+export declare type SelectSlots = typeof __propDef.slots;
+export default class Select extends SvelteComponentTyped<SelectProps, SelectEvents, SelectSlots> {
+}
+export {};

package/components/Select/SelectListItem.svelte

@@ -0,0 +1,10 @@
+<script>import { createEventDispatcher } from 'svelte';
+const dispatch = createEventDispatcher();
+const setSelected = (e) => {
+    dispatch('selectedItem');
+};
+</script>
+
+<li on:click={setSelected}>
+    <slot />
+</li>

package/components/Select/SelectListItem.svelte.d.ts

@@ -0,0 +1,18 @@
+import { SvelteComponentTyped } from "svelte";
+declare const __propDef: {
+    props: {};
+    events: {
+        selectedItem: CustomEvent<any>;
+    } & {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {
+        default: {};
+    };
+};
+export declare type SelectListItemProps = typeof __propDef.props;
+export declare type SelectListItemEvents = typeof __propDef.events;
+export declare type SelectListItemSlots = typeof __propDef.slots;
+export default class SelectListItem extends SvelteComponentTyped<SelectListItemProps, SelectListItemEvents, SelectListItemSlots> {
+}
+export {};

package/components/Select/TelCountrySelect/TelCountrySelect.svelte

@@ -1,15 +1,56 @@
-<script >import { selectedCountryStore } from '../../../stores';
+<script>import { selectedCountryStore } from '../../../stores';
 export let selectedCountry;
 const setSelectedCountry = (value) => {
     selectedCountry = value;
     $selectedCountryStore = value;
 };
+// const getCountries = (list = []) => {
+//     return list.map((countryCode) => findCountry(countryCode)).filter(Boolean);
+// };
+// const findCountry = (iso: string) => {
+//     return filteredCountries.find((country) => country.iso2 === iso.toUpperCase());
+// };
+// const findCountryByDialCode = (dialCode: any) => {
+//     return filteredCountries.find((country) => Number(country.dialCode) === dialCode);
+// };
+// $: filteredCountries = () => {
+//     // List countries after filtered
+//     if (onlyCountries.length) {
+//         return allCountries.filter(({ iso2 }) =>
+//             onlyCountries.some((c) => c.toUpperCase() === iso2)
+//         );
+//     }
+//     if (ignoredCountries.length) {
+//         return allCountries.filter(
+//             ({ iso2 }) =>
+//                 !ignoredCountries.includes(iso2.toUpperCase()) &&
+//                 !ignoredCountries.includes(iso2.toLowerCase())
+//         );
+//     }
+//     return allCountries;
+// };
+// $: sortedCountries = () => {
+//     // Sort the list countries: from preferred countries to all countries
+//     const preferredCountries = getCountries(preferredCountries).map((country) => ({
+//         ...country,
+//         preferred: true
+//     }));
+//     return [...preferredCountries, ...filteredCountries];
+// };
+// const getDefault(key: string) => {
+//     const value = utils.options[key];
+//     if (typeof value === 'undefined') {
+//         return utils.options[key];
+//     }
+//     return value;
+// }
 </script>
 
 <select
     name="country_select"
     class="some-class {$$props.class}"
     on:change={(e) => setSelectedCountry(e.currentTarget.value)}
+    bind:value={selectedCountry}
 >
     <slot name="options" />
 </select>

package/components/Select/TelRegionSelect/TelRegionSelect.svelte

@@ -1,4 +1,4 @@
-<script >"use strict";
+<script>"use strict";
 let selectedTelRegion;
 </script>
 

package/components/Select/TelRegionSelect/TelRegionSelectOption.svelte

@@ -1,4 +1,4 @@
-<script >export let regionOption;
+<script>export let regionOption;
 </script>
 
 <option class={$$props.class} value={regionOption.value}>{regionOption.label}</option>

package/components/Select/TelTypeSelect/TelTypeSelect.svelte

@@ -1,4 +1,4 @@
-<script >import { selectedTelTypeStore } from '../../../stores';
+<script>import { selectedTelTypeStore } from '../../../stores';
 export let selectedTelType;
 const setSelectedCountry = (value) => {
     selectedTelType = value;

package/components/Select/TelTypeSelect/TelTypeSelectOption.svelte

@@ -1,4 +1,4 @@
-<script >export let typeOption;
+<script>export let typeOption;
 </script>
 
 <option class={$$props.class} value={typeOption.value}>{typeOption.label}</option>

package/index.d.ts

@@ -1,6 +1,8 @@
 export { default as TelCountrySelect } from "./components/Select/TelCountrySelect/TelCountrySelect.svelte";
+export { default as SelectListItem } from "./components/Select/SelectListItem.svelte";
 export { default as TelTypeSelect } from "./components/Select/TelTypeSelect/TelTypeSelect.svelte";
 export { default as TelTypeSelectOption } from "./components/Select/TelTypeSelect/TelTypeSelectOption.svelte";
+export { default as Select } from "./components/Select/Select.svelte";
 export { default as TelRegionSelect } from "./components/Select/TelRegionSelect/TelRegionSelect.svelte";
 export { default as TelRegionSelectOption } from "./components/Select/TelRegionSelect/TelRegionSelectOption.svelte";
 export { default as TelInput } from "./components/Input/TelInput.svelte";

package/index.js

@@ -1,6 +1,8 @@
 export { default as TelCountrySelect } from './components/Select/TelCountrySelect/TelCountrySelect.svelte';
+export { default as SelectListItem } from './components/Select/SelectListItem.svelte';
 export { default as TelTypeSelect } from './components/Select/TelTypeSelect/TelTypeSelect.svelte';
 export { default as TelTypeSelectOption } from './components/Select/TelTypeSelect/TelTypeSelectOption.svelte';
+export { default as Select } from './components/Select/Select.svelte';
 export { default as TelRegionSelect } from './components/Select/TelRegionSelect/TelRegionSelect.svelte';
 export { default as TelRegionSelectOption } from './components/Select/TelRegionSelect/TelRegionSelectOption.svelte';
 export { default as TelInput } from './components/Input/TelInput.svelte';

package/models/interfaces/Country.interface.d.ts

@@ -0,0 +1,7 @@
+export interface Country {
+    name: string;
+    iso2: string | number | string[];
+    dialCode: string | number | string[];
+    priority: string | number | string[];
+    areaCodes: string | number | string[] | null;
+}

package/models/interfaces/Country.interface.js

@@ -0,0 +1 @@
+export {};

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "svelte-tel-input",
   "description": "svelte-tel-input",
-  "version": "0.5.1",
+  "version": "0.6.2",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/gyurielf/svelte-tel-input.git"
@@ -21,50 +21,50 @@
     "node": ">= 16"
   },
   "dependencies": {
-    "libphonenumber-js": "^1.9.47"
+    "libphonenumber-js": "^1.9.52"
   },
   "devDependencies": {
-    "@babel/core": "^7.17.0",
+    "@babel/core": "^7.17.9",
     "@babel/preset-env": "^7.16.11",
-    "@changesets/cli": "^2.20.0",
+    "@changesets/cli": "^2.22.0",
     "@changesets/get-github-info": "^0.5.0",
-    "@changesets/types": "^4.0.2",
-    "@sveltejs/adapter-static": "^1.0.0-next.26",
-    "@sveltejs/kit": "^1.0.0-next.260",
-    "@testing-library/jest-dom": "^5.16.2",
-    "@testing-library/svelte": "^3.0.3",
-    "@types/jest": "^27.4.0",
-    "@typescript-eslint/eslint-plugin": "^5.10.2",
-    "@typescript-eslint/parser": "^5.10.2",
-    "autoprefixer": "^10.4.2",
-    "babel-jest": "^27.4.6",
-    "babel-loader": "^8.2.3",
-    "cssnano": "^5.0.16",
+    "@changesets/types": "^5.0.0",
+    "@sveltejs/adapter-static": "^1.0.0-next.29",
+    "@sveltejs/kit": "^1.0.0-next.320",
+    "@testing-library/jest-dom": "^5.16.4",
+    "@testing-library/svelte": "^3.1.1",
+    "@types/jest": "^27.4.1",
+    "@typescript-eslint/eslint-plugin": "^5.20.0",
+    "@typescript-eslint/parser": "^5.20.0",
+    "autoprefixer": "^10.4.4",
+    "babel-jest": "^27.5.1",
+    "babel-loader": "^8.2.5",
+    "cssnano": "^5.1.7",
     "dotenv": "^16.0.0",
-    "eslint": "^8.8.0",
-    "eslint-config-prettier": "^8.3.0",
-    "eslint-plugin-jest": "^26.0.0",
-    "eslint-plugin-svelte3": "^3.4.0",
+    "eslint": "^8.14.0",
+    "eslint-config-prettier": "^8.5.0",
+    "eslint-plugin-jest": "^26.1.5",
+    "eslint-plugin-svelte3": "^3.4.1",
     "husky": "^7.0.4",
-    "jest": "^27.4.7",
+    "jest": "^27.5.1",
     "jest-matchmedia-mock": "^1.1.0",
-    "micromatch": "^4.0.4",
-    "postcss": "^8.4.6",
-    "postcss-load-config": "^3.1.1",
-    "prettier": "^2.5.1",
-    "prettier-plugin-svelte": "^2.6.0",
-    "svelte": "^3.46.4",
-    "svelte-check": "^2.4.2",
-    "svelte-inview": "^2.1.1",
-    "svelte-jester": "^2.3.1",
+    "micromatch": "^4.0.5",
+    "postcss": "^8.4.12",
+    "postcss-load-config": "^3.1.4",
+    "prettier": "^2.6.2",
+    "prettier-plugin-svelte": "^2.7.0",
+    "svelte": "^3.47.0",
+    "svelte-check": "^2.7.0",
+    "svelte-inview": "^3.0.0",
+    "svelte-jester": "^2.3.2",
     "svelte-loader": "^3.1.2",
-    "svelte-preprocess": "^4.10.2",
-    "svelte2tsx": "^0.5.2",
-    "tailwindcss": "^3.0.18",
-    "ts-jest": "^27.1.3",
+    "svelte-preprocess": "^4.10.6",
+    "svelte2tsx": "^0.5.9",
+    "tailwindcss": "^3.0.24",
+    "ts-jest": "^27.1.4",
     "tsconfig-paths-webpack-plugin": "^3.5.2",
-    "tslib": "^2.3.1",
-    "typescript": "^4.5.5"
+    "tslib": "^2.4.0",
+    "typescript": "^4.6.3"
   },
   "standard-version": {
     "skip": {
@@ -138,9 +138,12 @@
   "license": "MIT",
   "exports": {
     "./package.json": "./package.json",
+    "./assets/allCountry": "./assets/allCountry.js",
     "./assets/countries": "./assets/countries.js",
     "./assets/regions": "./assets/regions.js",
     "./components/Input/TelInput.svelte": "./components/Input/TelInput.svelte",
+    "./components/Select/Select.svelte": "./components/Select/Select.svelte",
+    "./components/Select/SelectListItem.svelte": "./components/Select/SelectListItem.svelte",
     "./components/Select/TelCountrySelect/TelCountrySelect.svelte": "./components/Select/TelCountrySelect/TelCountrySelect.svelte",
     "./components/Select/TelRegionSelect/TelRegionSelect.svelte": "./components/Select/TelRegionSelect/TelRegionSelect.svelte",
     "./components/Select/TelRegionSelect/TelRegionSelectOption.svelte": "./components/Select/TelRegionSelect/TelRegionSelectOption.svelte",
@@ -150,10 +153,12 @@
     "./models/enums/PhoneType.enum": "./models/enums/PhoneType.enum.js",
     "./models/enums": "./models/enums/index.js",
     "./models": "./models/index.js",
+    "./models/interfaces/Country.interface": "./models/interfaces/Country.interface.js",
     "./models/interfaces/Select.interface": "./models/interfaces/Select.interface.js",
     "./models/types/DynamicSvelteComponent.type": "./models/types/DynamicSvelteComponent.type.js",
     "./models/types/Select.type": "./models/types/Select.type.js",
     "./stores": "./stores/index.js",
+    "./utils/api": "./utils/api.js",
     "./utils/directives/clickOutsideAction": "./utils/directives/clickOutsideAction.js",
     "./utils/helpers": "./utils/helpers.js",
     "./utils/simulator": "./utils/simulator.js",

package/utils/api.d.ts

@@ -0,0 +1,28 @@
+export declare const get: (base: string, path: string) => Promise<{
+    response: Response;
+    json?: undefined;
+} | {
+    response: Response;
+    json: Record<string, any>;
+}>;
+export declare const del: (base: string, path: string, data?: any) => Promise<{
+    response: Response;
+    json?: undefined;
+} | {
+    response: Response;
+    json: Record<string, any>;
+}>;
+export declare const post: (base: string, path: string, data?: any) => Promise<{
+    response: Response;
+    json?: undefined;
+} | {
+    response: Response;
+    json: Record<string, any>;
+}>;
+export declare const put: (base: string, path: string, data?: any) => Promise<{
+    response: Response;
+    json?: undefined;
+} | {
+    response: Response;
+    json: Record<string, any>;
+}>;

package/utils/api.js

@@ -0,0 +1,30 @@
+const send = async ({ method, path, data, base }) => {
+    const opts = { method, headers: {}, credentials: 'include' };
+    if (data) {
+        opts.headers['content-type'] = 'application/json';
+        opts.body = JSON.stringify(data);
+    }
+    const fullPath = encodeURI(`${base}${path}`);
+    const response = await fetch(fullPath, opts);
+    if (response.status === 204) {
+        return { response };
+    }
+    if (response.headers.get('content-type') === 'application/json') {
+        const json = await response.json();
+        return { response, json };
+    }
+    return { response };
+};
+// Shortcut methods
+export const get = (base, path) => {
+    return send({ method: 'GET', path, base });
+};
+export const del = (base, path, data) => {
+    return send({ method: 'DELETE', path, data, base });
+};
+export const post = (base, path, data) => {
+    return send({ method: 'POST', path, data, base });
+};
+export const put = (base, path, data) => {
+    return send({ method: 'PUT', path, data, base });
+};

package/utils/helpers.d.ts

@@ -1 +1,2 @@
 export declare const capitalize: (str: string) => string;
+export declare const getCurrentCountry: () => Promise<string>;

package/utils/helpers.js

@@ -1,3 +1,11 @@
 export const capitalize = (str) => {
     return (str && str[0].toUpperCase() + str.slice(1).toLowerCase()) || '';
 };
+export const getCurrentCountry = async () => {
+    const response = await (await fetch('https://ip2c.org/s')).text();
+    const result = (response || '').toString();
+    if (!result || result[0] !== '1') {
+        throw new Error('Unable to fetch the country');
+    }
+    return result.substring(2, 4);
+};