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/cjs/index.js
CHANGED
|
@@ -4053,30 +4053,11 @@ const getCountryByFilter = (onlyCountry, excludeCountry, preferredCountry) => {
|
|
|
4053
4053
|
return result;
|
|
4054
4054
|
};
|
|
4055
4055
|
|
|
4056
|
-
function useOnClickOutside(ref, handler) {
|
|
4057
|
-
React.useEffect(() => {
|
|
4058
|
-
const listener = (event) => {
|
|
4059
|
-
if (!ref.current || ref.current.contains(event.target)) {
|
|
4060
|
-
return;
|
|
4061
|
-
}
|
|
4062
|
-
handler(event);
|
|
4063
|
-
};
|
|
4064
|
-
document.addEventListener("mousedown", listener);
|
|
4065
|
-
document.addEventListener("touchstart", listener);
|
|
4066
|
-
return () => {
|
|
4067
|
-
document.removeEventListener("mousedown", listener);
|
|
4068
|
-
document.removeEventListener("touchstart", listener);
|
|
4069
|
-
};
|
|
4070
|
-
}, [ref, handler]);
|
|
4071
|
-
}
|
|
4072
|
-
|
|
4073
4056
|
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" }) => {
|
|
4074
4057
|
const [selected, setSelected] = React.useState({});
|
|
4075
4058
|
const [isDropdown, setDropdown] = React.useState(false);
|
|
4076
4059
|
const [inputValue, setInputValue] = React.useState(value || "");
|
|
4077
4060
|
const [countryDataInfo, setCountryData] = React.useState(countryData);
|
|
4078
|
-
const ref = React.useRef();
|
|
4079
|
-
useOnClickOutside(ref, () => setDropdown(false));
|
|
4080
4061
|
//Handler
|
|
4081
4062
|
const handleChange = (e) => {
|
|
4082
4063
|
const onlyNumber = e.target.value.replace(/\D/g, '');
|
|
@@ -4118,7 +4099,7 @@ const PhoneInput = ({ placeholder, country, onChange, value, iconComponent, inpu
|
|
|
4118
4099
|
}, [onlyCountries, excludeCountries, preferredCountries]);
|
|
4119
4100
|
return (React.createElement("div", { className: "simple-phone-input-sri198-container" },
|
|
4120
4101
|
React.createElement("div", { className: "simple-phone-input-sri198-main" },
|
|
4121
|
-
React.createElement("div", { className: "simple-phone-input-sri198-dropdown-container"
|
|
4102
|
+
React.createElement("div", { className: "simple-phone-input-sri198-dropdown-container" },
|
|
4122
4103
|
React.createElement("div", { onClick: () => setDropdown(!isDropdown), className: dialCodeInputField ? "simple-phone-input-sri198-dropdown-container-button dial" : "simple-phone-input-sri198-dropdown-container-button" },
|
|
4123
4104
|
React.createElement("img", { src: "https://cdn.jsdelivr.net/gh/siamahnaf198/country-flags@main/img/" + selected.countryCode + ".svg", alt: selected.country, width: "20px" }),
|
|
4124
4105
|
!dialCodeInputField &&
|