react-simple-phone-input 1.0.10-beta → 1.0.11-beta
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/index.js +1 -20
- package/dist/cjs/index.js.map +1 -1
- package/dist/esm/index.js +1 -20
- package/dist/esm/index.js.map +1 -1
- package/package.json +1 -1
package/dist/esm/index.js
CHANGED
|
@@ -4051,30 +4051,11 @@ const getCountryByFilter = (onlyCountry, excludeCountry, preferredCountry) => {
|
|
|
4051
4051
|
return result;
|
|
4052
4052
|
};
|
|
4053
4053
|
|
|
4054
|
-
function useOnClickOutside(ref, handler) {
|
|
4055
|
-
React.useEffect(() => {
|
|
4056
|
-
const listener = (event) => {
|
|
4057
|
-
if (!ref.current || ref.current.contains(event.target)) {
|
|
4058
|
-
return;
|
|
4059
|
-
}
|
|
4060
|
-
handler(event);
|
|
4061
|
-
};
|
|
4062
|
-
document.addEventListener("mousedown", listener);
|
|
4063
|
-
document.addEventListener("touchstart", listener);
|
|
4064
|
-
return () => {
|
|
4065
|
-
document.removeEventListener("mousedown", listener);
|
|
4066
|
-
document.removeEventListener("touchstart", listener);
|
|
4067
|
-
};
|
|
4068
|
-
}, [ref, handler]);
|
|
4069
|
-
}
|
|
4070
|
-
|
|
4071
4054
|
const PhoneInput = ({ placeholder, country, onChange, value, iconComponent, inputProps, onlyCountries, excludeCountries, preferredCountries, showDropdownIcon = true, dialCodeInputField = false, search = true, searchPlaceholder = "Search country", showSearchIcon = true, searchIconComponent, searchProps, searchNotFound = "Not found" }) => {
|
|
4072
4055
|
const [selected, setSelected] = React.useState({});
|
|
4073
4056
|
const [isDropdown, setDropdown] = React.useState(false);
|
|
4074
4057
|
const [inputValue, setInputValue] = React.useState(value || "");
|
|
4075
4058
|
const [countryDataInfo, setCountryData] = React.useState(countryData);
|
|
4076
|
-
const ref = React.useRef();
|
|
4077
|
-
useOnClickOutside(ref, () => setDropdown(false));
|
|
4078
4059
|
//Handler
|
|
4079
4060
|
const handleChange = (e) => {
|
|
4080
4061
|
const onlyNumber = e.target.value.replace(/\D/g, '');
|
|
@@ -4116,7 +4097,7 @@ const PhoneInput = ({ placeholder, country, onChange, value, iconComponent, inpu
|
|
|
4116
4097
|
}, [onlyCountries, excludeCountries, preferredCountries]);
|
|
4117
4098
|
return (React.createElement("div", { className: "simple-phone-input-sri198-container" },
|
|
4118
4099
|
React.createElement("div", { className: "simple-phone-input-sri198-main" },
|
|
4119
|
-
React.createElement("div", { className: "simple-phone-input-sri198-dropdown-container"
|
|
4100
|
+
React.createElement("div", { className: "simple-phone-input-sri198-dropdown-container" },
|
|
4120
4101
|
React.createElement("div", { onClick: () => setDropdown(!isDropdown), className: dialCodeInputField ? "simple-phone-input-sri198-dropdown-container-button dial" : "simple-phone-input-sri198-dropdown-container-button" },
|
|
4121
4102
|
React.createElement("img", { src: "https://cdn.jsdelivr.net/gh/siamahnaf198/country-flags@main/img/" + selected.countryCode + ".svg", alt: selected.country, width: "20px" }),
|
|
4122
4103
|
!dialCodeInputField &&
|