{"version":3,"sources":["../source/PhoneInputWithCountry.js"],"names":["PhoneNumberInput_","props","React","createRef","country","metadata","newCountry","international","onChange","state","prevParsedInput","parsedInput","prevCountry","newParsedInput","newValue","getInputRef","current","focus","setState","hasUserSelectedACountry","value","_input","defaultCountry","addInternationalOption","limitMaxLength","countries","input","isFocused","event","_onFocus","onFocus","onBlur","_onBlur","countrySelectProps","labels","countryOptionsOrder","isCountrySupportedWithError","undefined","phoneNumber","CountryIcon","generateInitialParsedInput","onCountryChange","selectedCountry","prevProps","prevState","inputRef","name","disabled","autoComplete","style","className","inputComponent","numberInputProps","smartCaret","CountrySelectComponent","countrySelectComponent","ContainerComponent","containerComponent","flags","flagComponent","flagUrl","internationalIcon","displayInitialValueAsLocalNumber","reset","rest","InputComponent","InputSmart","InputBasic","countrySelectOptions","useMemoCountrySelectOptions","onCountryFocus","onCountryBlur","prevDefaultCountry","prevValue","prevReset","newDefaultCountry","newReset","newState","parsedCountry","indexOf","PureComponent","PhoneNumberInput","forwardRef","ref","propTypes","PropTypes","string","func","isRequired","onKeyDown","bool","arrayOf","labelsPropType","objectOf","elementType","object","metadataPropType","defaultProps","Flag","InternationalIcon","any","countrySelectOptionsMemo","countrySelectOptionsMemoDependencies","generator","dependencies","areEqualArrays","a","b","length","i"],"mappings":"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","sourcesContent":["import React from 'react'\r\nimport PropTypes from 'prop-types'\r\nimport classNames from 'classnames'\r\n\r\nimport InputSmart from './InputSmart'\r\nimport InputBasic from './InputBasic'\r\n\r\nimport Flag from './Flag'\r\nimport InternationalIcon from './InternationalIcon'\r\n\r\nimport {\r\n\tsortCountryOptions,\r\n\tisCountrySupportedWithError,\r\n\tgetSupportedCountries,\r\n\tgetSupportedCountryOptions,\r\n\tgetCountries\r\n} from './countries'\r\n\r\nimport { createCountryIconComponent } from './CountryIcon'\r\n\r\nimport {\r\n\tmetadata as metadataPropType,\r\n\tlabels as labelsPropType\r\n} from './PropTypes'\r\n\r\nimport {\r\n\tgetPreSelectedCountry,\r\n\tgetCountrySelectOptions,\r\n\tparsePhoneNumber,\r\n\tgenerateNationalNumberDigits,\r\n\tmigrateParsedInputForNewCountry,\r\n\tgetCountryForPartialE164Number,\r\n\tgetInitialParsedInput,\r\n\tparseInput,\r\n\te164\r\n} from './phoneInputHelpers'\r\n\r\nclass PhoneNumberInput_ extends React.PureComponent {\r\n\tinputRef = React.createRef()\r\n\r\n\tconstructor(props) {\r\n\t\tsuper(props)\r\n\r\n\t\tconst {\r\n\t\t\tvalue,\r\n\t\t\tlabels,\r\n\t\t\taddInternationalOption,\r\n\t\t\tmetadata,\r\n\t\t\tcountryOptionsOrder\r\n\t\t} = this.props\r\n\r\n\t\tlet {\r\n\t\t\tdefaultCountry,\r\n\t\t\tcountries\r\n\t\t} = this.props\r\n\r\n\t\t// Validate `defaultCountry`.\r\n\t\tif (defaultCountry) {\r\n\t\t\tif (!this.isCountrySupportedWithError(defaultCountry)) {\r\n\t\t\t\tdefaultCountry = undefined\r\n\t\t\t}\r\n\t\t}\r\n\r\n\t\t// Validate `countries`.\r\n\t\tcountries = getSupportedCountries(countries, metadata)\r\n\r\n\t\tconst phoneNumber = parsePhoneNumber(value, metadata)\r\n\r\n\t\tthis.CountryIcon = createCountryIconComponent(this.props)\r\n\r\n\t\tthis.state = {\r\n\t\t\t// Workaround for `this.props` inside `getDerivedStateFromProps()`.\r\n\t\t\tprops: this.props,\r\n\r\n\t\t\t// The country selected.\r\n\t\t\tcountry: getPreSelectedCountry(\r\n\t\t\t\tphoneNumber,\r\n\t\t\t\tdefaultCountry,\r\n\t\t\t\tcountries || getCountries(metadata),\r\n\t\t\t\taddInternationalOption,\r\n\t\t\t\tmetadata\r\n\t\t\t),\r\n\r\n\t\t\t// `countries` are stored in `this.state` because they're filtered.\r\n\t\t\t// For example, a developer might theoretically pass some unsupported\r\n\t\t\t// countries as part of the `countries` property, and because of that\r\n\t\t\t// the component uses `this.state.countries` (which are filtered)\r\n\t\t\t// instead of `this.props.countries`\r\n\t\t\t// (which could potentially contain unsupported countries).\r\n\t\t\tcountries,\r\n\r\n\t\t\t// `parsedInput` state property holds non-formatted user's input.\r\n\t\t\t// The reason is that there's no way of finding out\r\n\t\t\t// in which form should `value` be displayed: international or national.\r\n\t\t\t// E.g. if `value` is `+78005553535` then it could be input\r\n\t\t\t// by a user both as `8 (800) 555-35-35` and `+7 800 555 35 35`.\r\n\t\t\t// Hence storing just `value`is not sufficient for correct formatting.\r\n\t\t\t// E.g. if a user entered `8 (800) 555-35-35`\r\n\t\t\t// then value is `+78005553535` and `parsedInput` is `88005553535`\r\n\t\t\t// and if a user entered `+7 800 555 35 35`\r\n\t\t\t// then value is `+78005553535` and `parsedInput` is `+78005553535`.\r\n\t\t\tparsedInput: generateInitialParsedInput(value, phoneNumber, this.props),\r\n\r\n\t\t\t// `value` property is duplicated in state.\r\n\t\t\t// The reason is that `getDerivedStateFromProps()`\r\n\t\t\t// needs this `value` to compare to the new `value` property\r\n\t\t\t// to find out if `parsedInput` needs updating:\r\n\t\t\t// If the `value` property was changed externally\r\n\t\t\t// then it won't be equal to `state.value`\r\n\t\t\t// in which case `parsedInput` and `country` should be updated.\r\n\t\t\tvalue\r\n\t\t}\r\n\t}\r\n\r\n\tcomponentDidMount() {\r\n\t\tconst { onCountryChange } = this.props\r\n\t\tlet { defaultCountry } = this.props\r\n\t\tconst { country: selectedCountry } = this.state\r\n\t\tif (onCountryChange) {\r\n\t\t\tif (defaultCountry) {\r\n\t\t\t\tif (!this.isCountrySupportedWithError(defaultCountry)) {\r\n\t\t\t\t\tdefaultCountry = undefined\r\n\t\t\t\t}\r\n\t\t\t}\r\n\t\t\tif (selectedCountry !== defaultCountry) {\r\n\t\t\t\tonCountryChange(selectedCountry)\r\n\t\t\t}\r\n\t\t}\r\n\t}\r\n\r\n\tcomponentDidUpdate(prevProps, prevState) {\r\n\t\tconst { onCountryChange } = this.props\r\n\t\tconst { country } = this.state\r\n\t\t// Call `onCountryChange` when user selects another country.\r\n\t\tif (onCountryChange && country !== prevState.country) {\r\n\t\t\tonCountryChange(country)\r\n\t\t}\r\n\t}\r\n\r\n\t// A shorthand for not passing `metadata` as a second argument.\r\n\tisCountrySupportedWithError = (country) => {\r\n\t\tconst { metadata } = this.props\r\n\t\treturn isCountrySupportedWithError(country, metadata)\r\n\t}\r\n\r\n\t// Country `<select/>` `onChange` handler.\r\n\tonCountryChange = (newCountry) => {\r\n\t\tconst {\r\n\t\t\tinternational,\r\n\t\t\tmetadata,\r\n\t\t\tonChange\r\n\t\t} = this.props\r\n\r\n\t\tconst {\r\n\t\t\tparsedInput: prevParsedInput,\r\n\t\t\tcountry: prevCountry\r\n\t\t} = this.state\r\n\r\n\t\t// After the new `country` has been selected,\r\n\t\t// if the phone number `<input/>` holds any digits\r\n\t\t// then migrate those digits for the new `country`.\r\n\t\tconst newParsedInput = migrateParsedInputForNewCountry(\r\n\t\t\tprevParsedInput,\r\n\t\t\tprevCountry,\r\n\t\t\tnewCountry,\r\n\t\t\tmetadata,\r\n\t\t\t// Convert the phone number to \"national\" format\r\n\t\t\t// when the user changes the selected country by hand.\r\n\t\t\tinternational ? false : true\r\n\t\t)\r\n\r\n\t\tconst newValue = e164(newParsedInput, newCountry, metadata)\r\n\r\n\t\t// Focus phone number `<input/>` upon country selection.\r\n\t\tthis.getInputRef().current.focus()\r\n\r\n\t\t// If the user has already manually selected a country\r\n\t\t// then don't override that already selected country\r\n\t\t// if the `defaultCountry` property changes.\r\n\t\t// That's what `hasUserSelectedACountry` flag is for.\r\n\r\n\t\tthis.setState({\r\n\t\t\tcountry: newCountry,\r\n\t\t\thasUserSelectedACountry: true,\r\n\t\t\tparsedInput: newParsedInput,\r\n\t\t\tvalue: newValue\r\n\t\t},\r\n\t\t() => {\r\n\t\t\t// Update the new `value` property.\r\n\t\t\t// Doing it after the `state` has been updated\r\n\t\t\t// because `onChange()` will trigger `getDerivedStateFromProps()`\r\n\t\t\t// with the new `value` which will be compared to `state.value` there.\r\n\t\t\tonChange(newValue)\r\n\t\t})\r\n\t}\r\n\r\n\t/**\r\n\t * `<input/>` `onChange()` handler.\r\n\t * Updates `value` property accordingly (so that they are kept in sync).\r\n\t * @param {string?} input — Either a parsed phone number or an empty string. Examples: `\"\"`, `\"+\"`, `\"+123\"`, `\"123\"`.\r\n\t */\r\n\tonChange = (_input) => {\r\n\t\tconst {\r\n\t\t\tdefaultCountry,\r\n\t\t\tonChange,\r\n\t\t\taddInternationalOption,\r\n\t\t\tinternational,\r\n\t\t\tlimitMaxLength,\r\n\t\t\tmetadata\r\n\t\t} = this.props\r\n\r\n\t\tconst {\r\n\t\t\tinput,\r\n\t\t\tcountry,\r\n\t\t\tvalue\r\n\t\t} = parseInput(\r\n\t\t\t_input,\r\n\t\t\tthis.state.parsedInput,\r\n\t\t\tthis.state.country,\r\n\t\t\tdefaultCountry,\r\n\t\t\tthis.state.countries,\r\n\t\t\taddInternationalOption,\r\n\t\t\tinternational,\r\n\t\t\tlimitMaxLength,\r\n\t\t\tmetadata\r\n\t\t)\r\n\r\n\t\tthis.setState({\r\n\t\t\tparsedInput: input,\r\n\t\t\tvalue,\r\n\t\t\tcountry\r\n\t\t},\r\n\t\t// Update the new `value` property.\r\n\t\t// Doing it after the `state` has been updated\r\n\t\t// because `onChange()` will trigger `getDerivedStateFromProps()`\r\n\t\t// with the new `value` which will be compared to `state.value` there.\r\n\t\t() => onChange(value))\r\n\t}\r\n\r\n\t// Toggles the `--focus` CSS class.\r\n\t_onFocus = () => this.setState({ isFocused: true })\r\n\r\n\t// Toggles the `--focus` CSS class.\r\n\t_onBlur = () => this.setState({ isFocused: false })\r\n\r\n\tonFocus = (event) => {\r\n\t\tthis._onFocus()\r\n\t\tconst { onFocus } = this.props\r\n\t\tif (onFocus) {\r\n\t\t\tonFocus(event)\r\n\t\t}\r\n\t}\r\n\r\n\tonBlur = (event) => {\r\n\t\tconst { onBlur } = this.props\r\n\t\tthis._onBlur()\r\n\t\tif (onBlur) {\r\n\t\t\tonBlur(event)\r\n\t\t}\r\n\t}\r\n\r\n\tonCountryFocus = (event) => {\r\n\t\tthis._onFocus()\r\n\t\t// this.setState({ countrySelectFocused: true })\r\n\t\tconst { countrySelectProps } = this.props\r\n\t\tif (countrySelectProps) {\r\n\t\t\tconst { onFocus } = countrySelectProps\r\n\t\t\tif (onFocus) {\r\n\t\t\t\tonFocus(event)\r\n\t\t\t}\r\n\t\t}\r\n\t}\r\n\r\n\tonCountryBlur = (event) => {\r\n\t\tthis._onBlur()\r\n\t\t// this.setState({ countrySelectFocused: false })\r\n\t\tconst { countrySelectProps } = this.props\r\n\t\tif (countrySelectProps) {\r\n\t\t\tconst { onBlur } = countrySelectProps\r\n\t\t\tif (onBlur) {\r\n\t\t\t\tonBlur(event)\r\n\t\t\t}\r\n\t\t}\r\n\t}\r\n\r\n\tgetInputRef() {\r\n\t\tconst { inputRef } = this.props\r\n\t\treturn inputRef || this.inputRef\r\n\t}\r\n\r\n\t// `state` holds previous props as `props`, and also:\r\n\t// * `country` — The currently selected country, e.g. `\"RU\"`.\r\n\t// * `value` — The currently entered phone number (E.164), e.g. `+78005553535`.\r\n\t// * `parsedInput` — The parsed `<input/>` value, e.g. `8005553535`.\r\n\t// (and a couple of other less significant properties)\r\n\tstatic getDerivedStateFromProps(props, state) {\r\n\t\tconst {\r\n\t\t\tcountry,\r\n\t\t\thasUserSelectedACountry,\r\n\t\t\tvalue,\r\n\t\t\tprops: {\r\n\t\t\t\tdefaultCountry: prevDefaultCountry,\r\n\t\t\t\tvalue: prevValue,\r\n\t\t\t\treset: prevReset\r\n\t\t\t}\r\n\t\t} = state\r\n\r\n\t\tconst {\r\n\t\t\tmetadata,\r\n\t\t\tcountries,\r\n\t\t\tdefaultCountry: newDefaultCountry,\r\n\t\t\tvalue: newValue,\r\n\t\t\treset: newReset,\r\n\t\t\tinternational\r\n\t\t} = props\r\n\r\n\t\tconst newState = {\r\n\t\t\t// Emulate `prevProps` via `state.props`.\r\n\t\t\tprops,\r\n\t\t\t// If the user has already manually selected a country\r\n\t\t\t// then don't override that already selected country\r\n\t\t\t// if the `defaultCountry` property changes.\r\n\t\t\t// That's what `hasUserSelectedACountry` flag is for.\r\n\t\t\thasUserSelectedACountry\r\n\t\t}\r\n\r\n\t\t// Some users requested a way to reset the component\r\n\t\t// (both number `<input/>` and country `<select/>`).\r\n\t\t// Whenever `reset` property changes both number `<input/>`\r\n\t\t// and country `<select/>` are reset.\r\n\t\t// It's not implemented as some instance `.reset()` method\r\n\t\t// because `ref` is forwarded to `<input/>`.\r\n\t\t// It's also not replaced with just resetting `country` on\r\n\t\t// external `value` reset, because a user could select a country\r\n\t\t// and then not input any `value`, and so the selected country\r\n\t\t// would be \"stuck\", if not using this `reset` property.\r\n\t\t// https://github.com/catamphetamine/react-phone-number-input/issues/300\r\n\t\tif (newReset !== prevReset) {\r\n\t\t\treturn {\r\n\t\t\t\t...newState,\r\n\t\t\t\tparsedInput: undefined,\r\n\t\t\t\tvalue: undefined,\r\n\t\t\t\tcountry: newDefaultCountry,\r\n\t\t\t\thasUserSelectedACountry: undefined\r\n\t\t\t}\r\n\t\t}\r\n\r\n\t\t// If the default country changed.\r\n\t\t// (e.g. in case of ajax GeoIP detection after page loaded)\r\n\t\t// then select it but only if the user hasn't already manually\r\n\t\t// selected a country and no phone number has been entered so far.\r\n\t\t// Because if the user has already started inputting a phone number\r\n\t\t// then he's okay with no country being selected at all (\"International\")\r\n\t\t// and doesn't want to be disturbed, doesn't want his input to be screwed, etc.\r\n\t\tif (newDefaultCountry !== prevDefaultCountry &&\r\n\t\t\t!hasUserSelectedACountry && (\r\n\t\t\t\t(!value && !newValue) ||\r\n\t\t\t\t(international &&\r\n\t\t\t\t\tvalue === getInitialParsedInput(undefined, prevDefaultCountry, international, metadata) &&\r\n\t\t\t\t\tvalue === getInitialParsedInput(undefined, newDefaultCountry, international, metadata)\r\n\t\t\t\t)\r\n\t\t\t)\r\n\t\t) {\r\n\t\t\treturn {\r\n\t\t\t\t...newState,\r\n\t\t\t\tcountry: isCountrySupportedWithError(newDefaultCountry, metadata) ? newDefaultCountry : prevDefaultCountry,\r\n\t\t\t\t// If `parsedInput` is empty, then automatically select the new `country`\r\n\t\t\t\t// and set `parsedInput` to `+{getCountryCallingCode(newCountry)}`.\r\n\t\t\t\tparsedInput: generateInitialParsedInput(newValue, undefined, props)\r\n\t\t\t\t// `value` is `undefined`.\r\n\t\t\t\t// `parsedInput` is `undefined` because `value` is `undefined`.\r\n\t\t\t}\r\n\t\t}\r\n\t\t// If a new `value` is set externally.\r\n\t\t// (e.g. as a result of an ajax API request\r\n\t\t//  to get user's phone after page loaded)\r\n\t\t// The first part — `newValue !== prevValue` —\r\n\t\t// is basically `props.value !== prevProps.value`\r\n\t\t// so it means \"if value property was changed externally\".\r\n\t\t// The second part — `newValue !== value` —\r\n\t\t// is for ignoring the `getDerivedStateFromProps()` call\r\n\t\t// which happens in `this.onChange()` right after `this.setState()`.\r\n\t\t// If this `getDerivedStateFromProps()` call isn't ignored\r\n\t\t// then the country flag would reset on each input.\r\n\t\telse if (newValue !== prevValue && newValue !== value) {\r\n\t\t\tconst phoneNumber = parsePhoneNumber(newValue, metadata)\r\n\t\t\tlet parsedCountry\r\n\t\t\tif (phoneNumber) {\r\n\t\t\t\tconst countries = getSupportedCountries(props.countries, metadata)\r\n\t\t\t\tif (!countries || countries.indexOf(phoneNumber.country) >= 0) {\r\n\t\t\t\t\tparsedCountry = phoneNumber.country\r\n\t\t\t\t}\r\n\t\t\t}\r\n\t\t\tif (!newValue) {\r\n\t\t\t\tnewState.hasUserSelectedACountry = undefined\r\n\t\t\t}\r\n\t\t\treturn {\r\n\t\t\t\t...newState,\r\n\t\t\t\tparsedInput: generateInitialParsedInput(newValue, phoneNumber, props),\r\n\t\t\t\tvalue: newValue,\r\n\t\t\t\tcountry: newValue ? parsedCountry : newDefaultCountry\r\n\t\t\t}\r\n\t\t}\r\n\r\n\t\t// `defaultCountry` didn't change.\r\n\t\t// `value` didn't change.\r\n\t\t// `parsedInput` didn't change, because `value` didn't change.\r\n\t\t//\r\n\t\t// So no need to update state here really.\r\n\t\t// Could as well return `null` explicitly\r\n\t\t// to indicate that the `state` hasn't changed.\r\n\t\t// But just in case, returns `newState`.\r\n\t\t// (who knows if someone adds something\r\n\t\t// changing `newState` above in some future)\r\n\t\treturn newState\r\n\t}\r\n\r\n\trender() {\r\n\t\tconst {\r\n\t\t\t// Generic HTML attributes.\r\n\t\t\tname,\r\n\t\t\tdisabled,\r\n\t\t\tautoComplete,\r\n\t\t\tstyle,\r\n\t\t\tclassName,\r\n\r\n\t\t\t// Number `<input/>` properties.\r\n\t\t\tinputRef,\r\n\t\t\tinputComponent,\r\n\t\t\tnumberInputProps,\r\n\t\t\tsmartCaret,\r\n\r\n\t\t\t// Country `<select/>` properties.\r\n\t\t\tcountrySelectComponent: CountrySelectComponent,\r\n\t\t\tcountrySelectProps,\r\n\r\n\t\t\t// Container `<div/>` properties.\r\n\t\t\tcontainerComponent: ContainerComponent,\r\n\r\n\t\t\t// Get \"rest\" properties (passed through to number `<input/>`).\r\n\t\t\tdefaultCountry,\r\n\t\t\tcountries,\r\n\t\t\tcountryOptionsOrder,\r\n\t\t\tlabels,\r\n\t\t\tflags,\r\n\t\t\tflagComponent,\r\n\t\t\tflagUrl,\r\n\t\t\taddInternationalOption,\r\n\t\t\tinternationalIcon,\r\n\t\t\tdisplayInitialValueAsLocalNumber,\r\n\t\t\tonCountryChange,\r\n\t\t\tlimitMaxLength,\r\n\t\t\treset,\r\n\t\t\tmetadata,\r\n\t\t\tinternational,\r\n\t\t\t...rest\r\n\t\t} = this.props\r\n\r\n\t\tconst {\r\n\t\t\tcountry,\r\n\t\t\tparsedInput,\r\n\t\t\tisFocused\r\n\t\t} = this.state\r\n\r\n\t\tconst InputComponent = smartCaret ? InputSmart : InputBasic\r\n\r\n\t\tconst countrySelectOptions = useMemoCountrySelectOptions(() => {\r\n\t\t\treturn sortCountryOptions(\r\n\t\t\t\tgetCountrySelectOptions(\r\n\t\t\t\t\tcountries || getCountries(metadata),\r\n\t\t\t\t\tlabels,\r\n\t\t\t\t\taddInternationalOption\r\n\t\t\t\t),\r\n\t\t\t\tgetSupportedCountryOptions(countryOptionsOrder, metadata)\r\n\t\t\t)\r\n\t\t}, [\r\n\t\t\tcountries,\r\n\t\t\tcountryOptionsOrder,\r\n\t\t\taddInternationalOption,\r\n\t\t\tlabels,\r\n\t\t\tmetadata\r\n\t\t])\r\n\r\n\t\treturn (\r\n\t\t\t<ContainerComponent\r\n\t\t\t\tstyle={style}\r\n\t\t\t\tclassName={classNames(className, 'PhoneInput', {\r\n\t\t\t\t\t'PhoneInput--focus': isFocused\r\n\t\t\t\t})}>\r\n\r\n\t\t\t\t{/* Country `<select/>` */}\r\n\t\t\t\t<CountrySelectComponent\r\n\t\t\t\t\tname={name ? `${name}Country` : undefined}\r\n\t\t\t\t\taria-label={labels.country}\r\n\t\t\t\t\t{...countrySelectProps}\r\n\t\t\t\t\tvalue={country}\r\n\t\t\t\t\toptions={countrySelectOptions}\r\n\t\t\t\t\tonChange={this.onCountryChange}\r\n\t\t\t\t\tonFocus={this.onCountryFocus}\r\n\t\t\t\t\tonBlur={this.onCountryBlur}\r\n\t\t\t\t\tdisabled={disabled || (countrySelectProps && countrySelectProps.disabled)}\r\n\t\t\t\t\ticonComponent={this.CountryIcon}/>\r\n\r\n\t\t\t\t{/* Phone number `<input/>` */}\r\n\t\t\t\t<InputComponent\r\n\t\t\t\t\tref={this.getInputRef()}\r\n\t\t\t\t\ttype=\"tel\"\r\n\t\t\t\t\tautoComplete={autoComplete}\r\n\t\t\t\t\t{...numberInputProps}\r\n\t\t\t\t\t{...rest}\r\n\t\t\t\t\tname={name}\r\n\t\t\t\t\tmetadata={metadata}\r\n\t\t\t\t\tcountry={country}\r\n\t\t\t\t\tvalue={parsedInput || ''}\r\n\t\t\t\t\tonChange={this.onChange}\r\n\t\t\t\t\tonFocus={this.onFocus}\r\n\t\t\t\t\tonBlur={this.onBlur}\r\n\t\t\t\t\tdisabled={disabled}\r\n\t\t\t\t\tinputComponent={inputComponent}\r\n\t\t\t\t\tclassName={classNames(\r\n\t\t\t\t\t\t'PhoneInputInput',\r\n\t\t\t\t\t\tnumberInputProps && numberInputProps.className,\r\n\t\t\t\t\t\trest.className\r\n\t\t\t\t\t)}/>\r\n\t\t\t</ContainerComponent>\r\n\t\t)\r\n\t}\r\n}\r\n\r\n// This wrapper is only to `.forwardRef()` to the `<input/>`.\r\nconst PhoneNumberInput = React.forwardRef((props, ref) => (\r\n\t<PhoneNumberInput_ {...props} inputRef={ref}/>\r\n))\r\n\r\nPhoneNumberInput.propTypes = {\r\n\t/**\r\n\t * Phone number in `E.164` format.\r\n\t *\r\n\t * Example:\r\n\t *\r\n\t * `\"+12223333333\"`\r\n\t */\r\n\tvalue: PropTypes.string,\r\n\r\n\t/**\r\n\t * Updates the `value` as the user inputs the phone number.\r\n\t */\r\n\tonChange: PropTypes.func.isRequired,\r\n\r\n\t/**\r\n\t * Toggles the `--focus` CSS class.\r\n\t * @ignore\r\n\t */\r\n\tonFocus: PropTypes.func,\r\n\r\n\t/**\r\n\t * `onBlur` is usually passed by `redux-form`.\r\n\t * @ignore\r\n\t */\r\n\tonBlur: PropTypes.func,\r\n\r\n\t/**\r\n\t * `onKeyDown` handler (e.g. to handle Enter key press).\r\n\t * @ignore\r\n\t */\r\n\tonKeyDown: PropTypes.func,\r\n\r\n\t/**\r\n\t * Set to `true` to disable both the phone number `<input/>`\r\n\t * and the country `<select/>`.\r\n\t */\r\n\tdisabled: PropTypes.bool,\r\n\r\n\t/**\r\n\t * Sets `autoComplete` property for phone number `<input/>`.\r\n\t *\r\n\t * Web browser's \"autocomplete\" feature\r\n\t * remembers the phone number being input\r\n\t * and can also autofill the `<input/>`\r\n\t * with previously remembered phone numbers.\r\n\t *\r\n\t * https://developers.google.com\r\n\t * /web/updates/2015/06/checkout-faster-with-autofill\r\n\t *\r\n\t * For example, can be used to turn it off:\r\n\t *\r\n\t * \"So when should you use `autocomplete=\"off\"`?\r\n\t *  One example is when you've implemented your own version\r\n\t *  of autocomplete for search. Another example is any form field\r\n\t *  where users will input and submit different kinds of information\r\n\t *  where it would not be useful to have the browser remember\r\n\t *  what was submitted previously\".\r\n\t */\r\n\t// (is `\"tel\"` by default)\r\n\tautoComplete: PropTypes.string.isRequired,\r\n\r\n\t/**\r\n\t * Set to `true` to show the initial `value` in\r\n\t * \"national\" format rather than \"international\".\r\n\t *\r\n\t * For example, if this flag is set to `true`\r\n\t * and the initial `value=\"+12133734253\"` is passed\r\n\t * then the `<input/>` value will be `\"(213) 373-4253\"`.\r\n\t *\r\n\t * By default, this flag is set to `false`,\r\n\t * meaning that if the initial `value=\"+12133734253\"` is passed\r\n\t * then the `<input/>` value will be `\"+1 213 373 4253\"`.\r\n\t *\r\n\t * The reason for such default behaviour is that\r\n\t * the newer generation grows up when there are no stationary phones\r\n\t * and therefore everyone inputs phone numbers in international format\r\n\t * in their smartphones so people gradually get more accustomed to\r\n\t * writing phone numbers in international format rather than in local format.\r\n\t * Future people won't be using \"national\" format, only \"international\".\r\n\t */\r\n\t// (is `false` by default)\r\n\tdisplayInitialValueAsLocalNumber: PropTypes.bool.isRequired,\r\n\r\n\t/**\r\n\t * The country to be selected by default.\r\n\t * For example, can be set after a GeoIP lookup.\r\n\t *\r\n\t * Example: `\"US\"`.\r\n\t */\r\n\t// A two-letter country code (\"ISO 3166-1 alpha-2\").\r\n\tdefaultCountry: PropTypes.string,\r\n\r\n\t/**\r\n\t * If specified, only these countries will be available for selection.\r\n\t *\r\n\t * Example:\r\n\t *\r\n\t * `[\"RU\", \"UA\", \"KZ\"]`\r\n\t */\r\n\tcountries: PropTypes.arrayOf(PropTypes.string),\r\n\r\n\t/**\r\n\t * Custom country `<select/>` option names.\r\n\t * Also some labels like \"ext\" and country `<select/>` `aria-label`.\r\n\t *\r\n\t * Example:\r\n\t *\r\n\t * `{ \"ZZ\": \"Международный\", RU: \"Россия\", US: \"США\", ... }`\r\n\t *\r\n\t * See the `locales` directory for examples.\r\n\t */\r\n\tlabels: labelsPropType.isRequired,\r\n\r\n\t/**\r\n\t * A URL template of a country flag, where\r\n\t * \"{XX}\" is a two-letter country code in upper case,\r\n\t * or where \"{xx}\" is a two-letter country code in lower case.\r\n\t * By default it points to `country-flag-icons` gitlab pages website.\r\n\t * I imagine someone might want to download those country flag icons\r\n\t * and host them on their own servers instead\r\n\t * (all flags are available in the `country-flag-icons` library).\r\n\t * There's a catch though: new countries may be added in future,\r\n\t * so when hosting country flag icons on your own server\r\n\t * one should check the `CHANGELOG.md` every time before updating this library,\r\n\t * otherwise there's a possibility that some new country flag would be missing.\r\n\t */\r\n\tflagUrl: PropTypes.string.isRequired,\r\n\r\n\t/**\r\n\t * Custom country flag icon components.\r\n\t * These flags will be used instead of the default ones.\r\n\t * The the \"Flags\" section of the readme for more info.\r\n\t *\r\n\t * The shape is an object where keys are country codes\r\n\t * and values are flag icon components.\r\n\t * Flag icon components receive the same properties\r\n\t * as `flagComponent` (see below).\r\n\t *\r\n\t * Example:\r\n\t *\r\n\t * `{ \"RU\": (props) => <img src=\"...\"/> }`\r\n\t *\r\n\t * Example:\r\n\t *\r\n\t * `import flags from 'country-flag-icons/react/3x2'`\r\n\t *\r\n\t * `import PhoneInput from 'react-phone-number-input'`\r\n\t *\r\n\t * `<PhoneInput flags={flags} .../>`\r\n\t */\r\n\tflags: PropTypes.objectOf(PropTypes.elementType),\r\n\r\n\t/**\r\n\t * Country flag icon component.\r\n\t *\r\n\t * Takes properties:\r\n\t *\r\n\t * * `country: string` — The country code.\r\n\t * * `countryName: string` — The country name.\r\n\t * * `flagUrl: string` — The `flagUrl` property (see above).\r\n\t * * `flags: object` — The `flags` property (see above).\r\n\t */\r\n\tflagComponent: PropTypes.elementType.isRequired,\r\n\r\n\t/**\r\n\t * Set to `false` to remove the \"International\" option from country `<select/>`.\r\n\t */\r\n\taddInternationalOption: PropTypes.bool.isRequired,\r\n\r\n\t/**\r\n\t * \"International\" icon component.\r\n\t * Should have the same aspect ratio.\r\n\t *\r\n\t * Receives properties:\r\n\t *\r\n\t * * `title: string` — \"International\" country option label.\r\n\t */\r\n\tinternationalIcon: PropTypes.elementType.isRequired,\r\n\r\n\t/**\r\n\t * Can be used to place some countries on top of the list of country `<select/>` options.\r\n\t *\r\n\t * * `\"|\"` — inserts a separator.\r\n\t * * `\"...\"` — means \"the rest of the countries\" (can be omitted, in which case it will automatically be added at the end).\r\n\t *\r\n\t * Example:\r\n\t *\r\n\t * `[\"US\", \"CA\", \"AU\", \"|\", \"...\"]`\r\n\t */\r\n\tcountryOptionsOrder: PropTypes.arrayOf(PropTypes.string),\r\n\r\n\t/**\r\n\t * `<Phone/>` component CSS style object.\r\n\t */\r\n\tstyle: PropTypes.object,\r\n\r\n\t/**\r\n\t * `<Phone/>` component CSS class.\r\n\t */\r\n\tclassName: PropTypes.string,\r\n\r\n\t/**\r\n\t * Country `<select/>` component.\r\n\t *\r\n\t * Receives properties:\r\n\t *\r\n\t * * `name: string?` — HTML `name` attribute.\r\n\t * * `value: string?` — The currently selected country code.\r\n\t * * `onChange(value: string?)` — Updates the `value`.\r\n\t * * `onFocus()` — Is used to toggle the `--focus` CSS class.\r\n\t * * `onBlur()` — Is used to toggle the `--focus` CSS class.\r\n\t * * `options: object[]` — The list of all selectable countries (including \"International\") each being an object of shape `{ value: string?, label: string }`.\r\n\t * * `iconComponent: PropTypes.elementType` — React component that renders a country icon: `<Icon country={value}/>`. If `country` is `undefined` then it renders an \"International\" icon.\r\n\t * * `disabled: boolean?` — HTML `disabled` attribute.\r\n\t * * `tabIndex: (number|string)?` — HTML `tabIndex` attribute.\r\n\t * * `className: string` — CSS class name.\r\n\t */\r\n\tcountrySelectComponent: PropTypes.elementType.isRequired,\r\n\r\n\t/**\r\n\t * Country `<select/>` component props.\r\n\t * Along with the usual DOM properties such as `aria-label` and `tabIndex`,\r\n\t * some custom properties are supported, such as `arrowComponent` and `unicodeFlags`.\r\n\t */\r\n\tcountrySelectProps: PropTypes.object,\r\n\r\n\t/**\r\n\t * Phone number `<input/>` component.\r\n\t *\r\n\t * Receives properties:\r\n\t *\r\n\t * * `value: string` — The formatted `value`.\r\n\t * * `onChange(event: Event)` — Updates the formatted `value` from `event.target.value`.\r\n\t * * `onFocus()` — Is used to toggle the `--focus` CSS class.\r\n\t * * `onBlur()` — Is used to toggle the `--focus` CSS class.\r\n\t * * Other properties like `type=\"tel\"` or `autoComplete=\"tel\"` that should be passed through to the DOM `<input/>`.\r\n\t *\r\n\t * Must also either use `React.forwardRef()` to \"forward\" `ref` to the `<input/>` or implement `.focus()` method.\r\n\t */\r\n\tinputComponent: PropTypes.elementType.isRequired,\r\n\r\n\t/**\r\n\t * Wrapping `<div/>` component.\r\n\t *\r\n\t * Receives properties:\r\n\t *\r\n\t * * `style: object` — A component CSS style object.\r\n\t * * `className: string` — Classes to attach to the component, typically changes when component focuses or blurs.\r\n\t */\r\n\tcontainerComponent: PropTypes.elementType.isRequired,\r\n\r\n\t/**\r\n\t * Phone number `<input/>` component props.\r\n\t */\r\n\tnumberInputProps: PropTypes.object,\r\n\r\n\t/**\r\n\t * By default, the caret position is being \"intelligently\" managed\r\n\t * while a user inputs a phone number.\r\n\t * This \"smart\" caret behavior can be turned off\r\n\t * by passing `smartCaret={false}` property.\r\n\t * This is just an \"escape hatch\" for any possible caret position issues.\r\n\t */\r\n\t// Is `true` by default.\r\n\tsmartCaret: PropTypes.bool.isRequired,\r\n\r\n\t/**\r\n\t * Set to `true` to force \"international\" phone number format.\r\n\t */\r\n\tinternational: PropTypes.bool,\r\n\r\n\t/**\r\n\t * If set to `true`, the phone number input will get trimmed\r\n\t * if it exceeds the maximum length for the country.\r\n\t */\r\n\tlimitMaxLength: PropTypes.bool.isRequired,\r\n\r\n\t/**\r\n\t * `libphonenumber-js` metadata.\r\n\t *\r\n\t * Can be used to pass custom `libphonenumber-js` metadata\r\n\t * to reduce the overall bundle size for those who compile \"custom\" metadata.\r\n\t */\r\n\tmetadata: metadataPropType.isRequired,\r\n\r\n\t/**\r\n\t * Is called every time the selected country changes:\r\n\t * either programmatically or when user selects it manually from the list.\r\n\t */\r\n\t// People have been asking for a way to get the selected country.\r\n\t// @see  https://github.com/catamphetamine/react-phone-number-input/issues/128\r\n\t// For some it's just a \"business requirement\".\r\n\t// I guess it's about gathering as much info on the user as a website can\r\n\t// without introducing any addional fields that would complicate the form\r\n\t// therefore reducing \"conversion\" (that's a marketing term).\r\n\t// Assuming that the phone number's country is the user's country\r\n\t// is not 100% correct but in most cases I guess it's valid.\r\n\tonCountryChange: PropTypes.func\r\n}\r\n\r\nPhoneNumberInput.defaultProps = {\r\n\t/**\r\n\t * Remember (and autofill) the value as a phone number.\r\n\t */\r\n\tautoComplete: 'tel',\r\n\r\n\t/**\r\n\t * Flag icon component.\r\n\t */\r\n\tflagComponent: Flag,\r\n\r\n\t/**\r\n\t * By default, uses icons from `country-flag-icons` gitlab pages website.\r\n\t */\r\n\t// Must be equal to `flagUrl` in `./CountryIcon.js`.\r\n\tflagUrl: 'https://catamphetamine.gitlab.io/country-flag-icons/3x2/{XX}.svg',\r\n\r\n\t/**\r\n\t * Default \"International\" country `<select/>` option icon.\r\n\t */\r\n\tinternationalIcon: InternationalIcon,\r\n\r\n\t/**\r\n\t * Phone number `<input/>` component.\r\n\t */\r\n\tinputComponent: 'input',\r\n\r\n\t/**\r\n\t * Wrapping `<div/>` component.\r\n\t */\r\n\tcontainerComponent: 'div',\r\n\r\n\t/**\r\n\t * Some users requested a way to reset the component:\r\n\t * both number `<input/>` and country `<select/>`.\r\n\t * Whenever `reset` property changes both number `<input/>`\r\n\t * and country `<select/>` are reset.\r\n\t * It's not implemented as some instance `.reset()` method\r\n\t * because `ref` is forwarded to `<input/>`.\r\n\t * It's also not replaced with just resetting `country` on\r\n\t * external `value` reset, because a user could select a country\r\n\t * and then not input any `value`, and so the selected country\r\n\t * would be \"stuck\", if not using this `reset` property.\r\n\t */\r\n\t// https://github.com/catamphetamine/react-phone-number-input/issues/300\r\n\treset: PropTypes.any,\r\n\r\n\t/**\r\n\t * Don't convert the initially passed phone number `value`\r\n\t * to a national phone number for its country.\r\n\t * The reason is that the newer generation grows up when\r\n\t * there are no stationary phones and therefore everyone inputs\r\n\t * phone numbers with a `+` in their smartphones\r\n\t * so phone numbers written in international form\r\n\t * are gradually being considered more natural than local ones.\r\n\t */\r\n\tdisplayInitialValueAsLocalNumber: false,\r\n\r\n\t/**\r\n\t * Set to `false` to use \"basic\" caret instead of the \"smart\" one.\r\n\t */\r\n\tsmartCaret: true,\r\n\r\n\t/**\r\n\t * Whether to add the \"International\" option\r\n\t * to the list of countries.\r\n\t */\r\n\taddInternationalOption: true,\r\n\r\n\t/**\r\n\t * If set to `true` the phone number input will get trimmed\r\n\t * if it exceeds the maximum length for the country.\r\n\t */\r\n\tlimitMaxLength: false\r\n}\r\n\r\nexport default PhoneNumberInput\r\n\r\n/**\r\n * Gets initial `parsedInput` value.\r\n * @param  {string} [value]\r\n * @param  {PhoneNumber} [phoneNumber]\r\n * @param  {boolean} [options.international]\r\n * @param  {string} [options.defaultCountry]\r\n * @param  {boolean} options.displayInitialValueAsLocalNumber\r\n * @param  {object} options.metadata\r\n * @return {string} [parsedInput]\r\n */\r\nfunction generateInitialParsedInput(value, phoneNumber, {\r\n\tinternational,\r\n\tdefaultCountry,\r\n\tmetadata,\r\n\tdisplayInitialValueAsLocalNumber\r\n}) {\r\n\t// If the `value` (E.164 phone number)\r\n\t// belongs to the currently selected country\r\n\t// and `displayInitialValueAsLocalNumber` property is `true`\r\n\t// then convert `value` (E.164 phone number)\r\n\t// to a local phone number digits.\r\n\t// E.g. '+78005553535' -> '88005553535'.\r\n\tif (displayInitialValueAsLocalNumber && phoneNumber && phoneNumber.country) {\r\n\t\treturn generateNationalNumberDigits(phoneNumber)\r\n\t}\r\n\treturn getInitialParsedInput(value, defaultCountry, international, metadata)\r\n}\r\n\r\nlet countrySelectOptionsMemo\r\nlet countrySelectOptionsMemoDependencies\r\nfunction useMemoCountrySelectOptions(generator, dependencies) {\r\n\tif (!countrySelectOptionsMemoDependencies ||\r\n\t\t!areEqualArrays(dependencies, countrySelectOptionsMemoDependencies)) {\r\n\t\tcountrySelectOptionsMemo = generator()\r\n\t\tcountrySelectOptionsMemoDependencies = dependencies\r\n\t}\r\n\treturn countrySelectOptionsMemo\r\n}\r\n\r\nfunction areEqualArrays(a, b) {\r\n\tif (a.length !== b.length) {\r\n\t\treturn false\r\n\t}\r\n\tlet i = 0\r\n\twhile (i < a.length) {\r\n\t\tif (a[i] !== b[i]) {\r\n\t\t\treturn false\r\n\t\t}\r\n\t\ti++\r\n\t}\r\n\treturn true\r\n}"],"file":"PhoneInputWithCountry.js"}