phone editing widget works

This commit is contained in:
or-else
2023-01-25 17:08:07 -08:00
parent 34f17f45b1
commit e2f3201ddb
32 changed files with 246 additions and 106 deletions
+1 -1
View File
File diff suppressed because one or more lines are too long
+1 -1
View File
File diff suppressed because one or more lines are too long
+1 -1
View File
File diff suppressed because one or more lines are too long
+1 -1
View File
@@ -1 +1 @@
{"version":3,"file":"251.prod.js","mappings":"skNAOA,MAAMA,UAAkBC,IAAAA,cACtBC,YAAYC,GACVC,MAAMD,GAENE,KAAKC,QAAU,CAAC,EAChBC,EAAAA,SAAuBC,IAAQH,KAAKC,QAAQE,EAAGC,MAAQD,EAAGE,IAAI,IAE9DL,KAAKM,MAAQ,CACXC,YAAaT,EAAMS,aAAe,KAClCC,SAAUR,KAAKC,QAAQH,EAAMS,aAAe,MAC5CE,YAAa,IAGfT,KAAKU,aAAeV,KAAKU,aAAaC,KAAKX,MAC3CA,KAAKY,eAAiBZ,KAAKY,eAAeD,KAAKX,MAC/CA,KAAKa,cAAgBb,KAAKa,cAAcF,KAAKX,MAC7CA,KAAKc,oBAAsBd,KAAKc,oBAAoBH,KAAKX,KAC3D,CAEAU,aAAaK,GACXf,KAAKgB,SAAS,CAACP,YAAaT,KAAKiB,aAAaF,EAAEG,OAAOC,QACzD,CAEAP,eAAeG,GAEbA,EAAEK,iBACF,MAAMC,EAAU,GAAErB,KAAKM,MAAME,WAAWR,KAAKM,MAAMG,YAAYa,SAASC,QAAQ,SAAU,IAC1FvB,KAAKF,MAAM0B,SAAU,IAAGH,IAC1B,CAGAR,cAAcE,GACE,UAAVA,EAAEU,KACJzB,KAAKY,eAAeG,EAExB,CAEAD,sBACEd,KAAKF,MAAM4B,sBAAsB1B,KAAKM,MAAMC,YAAaP,KAAKM,MAAME,SACtE,CAGAS,aAAaI,GACX,OAAKA,EAKEA,EAAOE,QAAQ,eAAgB,IAJ7BF,CAKX,CAEAM,SACE,OACE,oCACE,0BAAMC,UAAU,YAAYC,QAAS7B,KAAKc,qBACxC,0BAAMc,UAAU,iBAAgBE,EAAAA,EAAAA,IAAU9B,KAAKM,MAAMC,aAAa,KAAa,IAC7EP,KAAKM,MAAME,SAAS,KACxB,2BAAOuB,KAAK,MAAMC,YAAahC,KAAKM,MAAM0B,YACtCb,MAAOnB,KAAKM,MAAMG,YAAawB,SAAUjC,KAAKU,aAC9CwB,UAAW,GAAIC,UAAWnC,KAAKa,cAAeuB,OAAQpC,KAAKY,eAC3DyB,UAAQ,EAACC,UAAWtC,KAAKF,MAAMwC,YAGzC,EAGF,SAAeC,EAAAA,EAAAA,YAAW5C,E","sources":["webpack://tinode-webapp/./src/widgets/phone-edit.jsx"],"sourcesContent":["// Editor for a phone number.\n\nimport React from 'react';\nimport { injectIntl } from 'react-intl';\nimport * as dcodes from '../dcodes.json';\nimport { flagEmoji } from '../lib/strformat';\n\nclass PhoneEdit extends React.PureComponent {\n constructor(props) {\n super(props);\n\n this.codeMap = {};\n dcodes.default.forEach(dc => { this.codeMap[dc.code] = dc.dial; });\n\n this.state = {\n countryCode: props.countryCode || 'US',\n dialCode: this.codeMap[props.countryCode || 'US'],\n localNumber: ''\n };\n\n this.handleChange = this.handleChange.bind(this);\n this.handleFinished = this.handleFinished.bind(this);\n this.handleKeyDown = this.handleKeyDown.bind(this);\n this.showCountrySelector = this.showCountrySelector.bind(this);\n }\n\n handleChange(e) {\n this.setState({localNumber: this.filterNumber(e.target.value)});\n }\n\n handleFinished(e) {\n // this.setCustomValidity(\"Mobile phone number required\");\n e.preventDefault();\n const number = `${this.state.dialCode}${this.state.localNumber.trim()}`.replace(/[^\\d]/g, '')\n this.props.onSubmit(`+${number}`);\n }\n\n\n handleKeyDown(e) {\n if (e.key === 'Enter') {\n this.handleFinished(e);\n }\n }\n\n showCountrySelector() {\n this.props.onShowCountrySelector(this.state.countryCode, this.state.dialCode);\n }\n\n // Filter out characters not permitted in a phone number.\n filterNumber(number) {\n if (!number) {\n return number;\n }\n // Leave numbers, space, (, ), -, and .\n // The + is not allowed: it's handled by the country code portion.\n return number.replace(/[^-\\s().\\d]/g, '');\n }\n\n render() {\n return (\n <>\n <span className=\"dial-code\" onClick={this.showCountrySelector}>\n <span className=\"country-flag\">{flagEmoji(this.state.countryCode)}&nbsp;</span>\n +{this.state.dialCode}&nbsp;</span>\n <input type=\"tel\" placeholder={this.state.placeholder}\n value={this.state.localNumber} onChange={this.handleChange}\n maxLength={17} onKeyDown={this.handleKeyDown} onBlur={this.handleFinished}\n required autoFocus={this.props.autoFocus} />\n </>\n );\n }\n}\n\nexport default injectIntl(PhoneEdit);\n"],"names":["PhoneEdit","React","constructor","props","super","this","codeMap","dcodes","dc","code","dial","state","countryCode","dialCode","localNumber","handleChange","bind","handleFinished","handleKeyDown","showCountrySelector","e","setState","filterNumber","target","value","preventDefault","number","trim","replace","onSubmit","key","onShowCountrySelector","render","className","onClick","flagEmoji","type","placeholder","onChange","maxLength","onKeyDown","onBlur","required","autoFocus","injectIntl"],"sourceRoot":""}
{"version":3,"file":"251.prod.js","mappings":"skNAQA,MAAMA,UAAkBC,IAAAA,cACtBC,YAAYC,GACVC,MAAMD,GAENE,KAAKC,QAAU,CAAC,EAChBC,EAAAA,SAAuBC,IAAQH,KAAKC,QAAQE,EAAGC,MAAQD,EAAGE,IAAI,IAE9DL,KAAKM,MAAQ,CACXC,YAAaT,EAAMS,aAAe,KAClCC,SAAUR,KAAKC,QAAQH,EAAMS,aAAe,MAC5CE,YAAa,IAGfT,KAAKU,aAAeV,KAAKU,aAAaC,KAAKX,MAC3CA,KAAKY,eAAiBZ,KAAKY,eAAeD,KAAKX,MAC/CA,KAAKa,cAAgBb,KAAKa,cAAcF,KAAKX,MAC7CA,KAAKc,oBAAsBd,KAAKc,oBAAoBH,KAAKX,KAC3D,CAEAU,aAAaK,GACXf,KAAKgB,SAAS,CAACP,YAAaT,KAAKiB,aAAaF,EAAEG,OAAOC,QACzD,CAEAP,eAAeG,GAEbA,EAAEK,iBACF,MAAMC,EAAU,GAAErB,KAAKM,MAAME,WAAWR,KAAKM,MAAMG,YAAYa,SAASC,QAAQ,SAAU,IAC1FvB,KAAKF,MAAM0B,SAAU,IAAGH,IAC1B,CAGAR,cAAcE,GACE,UAAVA,EAAEU,KACJzB,KAAKY,eAAeG,EAExB,CAEAD,sBACEd,KAAKF,MAAM4B,sBAAsB1B,KAAKM,MAAMC,YAAaP,KAAKM,MAAME,SACtE,CAGAS,aAAaI,GACX,OAAKA,EAKEA,EAAOE,QAAQ,eAAgB,IAJ7BF,CAKX,CAEAM,SACE,OACE,oCACE,0BAAMC,UAAU,YAAYC,QAAS7B,KAAKc,qBACxC,0BAAMc,UAAU,iBAAgBE,EAAAA,EAAAA,IAAU9B,KAAKM,MAAMC,aAAa,KAAa,IAC7EP,KAAKM,MAAME,SAAS,KACxB,2BAAOuB,KAAK,MAAMC,YAAahC,KAAKM,MAAM0B,YACtCb,MAAOnB,KAAKM,MAAMG,YAAawB,SAAUjC,KAAKU,aAC9CwB,UAAW,GAAIC,UAAWnC,KAAKa,cAAeuB,OAAQpC,KAAKY,eAC3DyB,UAAQ,EAACC,UAAWtC,KAAKF,MAAMwC,YAGzC,EAGF,SAAeC,EAAAA,EAAAA,YAAW5C,E","sources":["webpack://tinode-webapp/./src/widgets/phone-edit.jsx"],"sourcesContent":["// Editor for a phone number.\n\nimport React from 'react';\nimport { injectIntl } from 'react-intl';\n\nimport * as dcodes from '../dcodes.json';\nimport { flagEmoji } from '../lib/strformat';\n\nclass PhoneEdit extends React.PureComponent {\n constructor(props) {\n super(props);\n\n this.codeMap = {};\n dcodes.default.forEach(dc => { this.codeMap[dc.code] = dc.dial; });\n\n this.state = {\n countryCode: props.countryCode || 'US',\n dialCode: this.codeMap[props.countryCode || 'US'],\n localNumber: ''\n };\n\n this.handleChange = this.handleChange.bind(this);\n this.handleFinished = this.handleFinished.bind(this);\n this.handleKeyDown = this.handleKeyDown.bind(this);\n this.showCountrySelector = this.showCountrySelector.bind(this);\n }\n\n handleChange(e) {\n this.setState({localNumber: this.filterNumber(e.target.value)});\n }\n\n handleFinished(e) {\n // this.setCustomValidity(\"Mobile phone number required\");\n e.preventDefault();\n const number = `${this.state.dialCode}${this.state.localNumber.trim()}`.replace(/[^\\d]/g, '')\n this.props.onSubmit(`+${number}`);\n }\n\n\n handleKeyDown(e) {\n if (e.key === 'Enter') {\n this.handleFinished(e);\n }\n }\n\n showCountrySelector() {\n this.props.onShowCountrySelector(this.state.countryCode, this.state.dialCode);\n }\n\n // Filter out characters not permitted in a phone number.\n filterNumber(number) {\n if (!number) {\n return number;\n }\n // Leave numbers, space, (, ), -, and .\n // The + is not allowed: it's handled by the country code portion.\n return number.replace(/[^-\\s().\\d]/g, '');\n }\n\n render() {\n return (\n <>\n <span className=\"dial-code\" onClick={this.showCountrySelector}>\n <span className=\"country-flag\">{flagEmoji(this.state.countryCode)}&nbsp;</span>\n +{this.state.dialCode}&nbsp;</span>\n <input type=\"tel\" placeholder={this.state.placeholder}\n value={this.state.localNumber} onChange={this.handleChange}\n maxLength={17} onKeyDown={this.handleKeyDown} onBlur={this.handleFinished}\n required autoFocus={this.props.autoFocus} />\n </>\n );\n }\n}\n\nexport default injectIntl(PhoneEdit);\n"],"names":["PhoneEdit","React","constructor","props","super","this","codeMap","dcodes","dc","code","dial","state","countryCode","dialCode","localNumber","handleChange","bind","handleFinished","handleKeyDown","showCountrySelector","e","setState","filterNumber","target","value","preventDefault","number","trim","replace","onSubmit","key","onShowCountrySelector","render","className","onClick","flagEmoji","type","placeholder","onChange","maxLength","onKeyDown","onBlur","required","autoFocus","injectIntl"],"sourceRoot":""}
+1 -1
View File
File diff suppressed because one or more lines are too long
+1 -1
View File
File diff suppressed because one or more lines are too long
+1 -1
View File
File diff suppressed because one or more lines are too long
+1 -1
View File
@@ -1 +1 @@
{"version":3,"file":"290.prod.js","mappings":"uMASA,MAAMA,UAA6BC,IAAAA,cACjCC,YAAYC,GACVC,MAAMD,GAENE,KAAKC,UAAY,GACjB,MAAM,qBAACC,GAAwBJ,EAAMK,KACrCC,EAAAA,SAAuBC,IACrBL,KAAKC,UAAUK,KAAK,CAClBC,KAAMF,EAAGE,KACTC,KAAMH,EAAGG,KACTC,MAAMC,EAAAA,EAAAA,IAAUL,EAAGG,MACnBG,KAAMT,EAAqBG,EAAGG,KAAM,CAACI,KAAM,YAC3C,IAGJZ,KAAKC,UAAUY,MAAK,CAACC,EAAGC,IAAMD,EAAEH,KAAKK,cAAcD,EAAEJ,QAErDX,KAAKiB,YAAcjB,KAAKiB,YAAYC,KAAKlB,KAC3C,CAEAiB,YAAYE,GACVA,EAAEC,iBACFpB,KAAKF,MAAMuB,SAASF,EAAEG,OAAOC,QAAQf,KAAMW,EAAEG,OAAOC,QAAQhB,KAC9D,CAEAiB,SACE,MAAMvB,EAAY,GACZwB,EAAWzB,KAAKF,MAAM2B,UAAY,KAQxC,OAPAzB,KAAKC,UAAUyB,SAAQC,IACrB,MAAMC,EAASD,EAAEnB,MAAQiB,EAAW,YAAc,GAClDxB,EAAUK,KAAK,wBAAIuB,UAAWD,EAAOE,IAAKC,IAAK,YAAWJ,EAAEnB,KAAM,YAAWmB,EAAEpB,KAAMyB,QAAShC,KAAKiB,aACjG,0BAAOY,UAAU,gBAAgBF,EAAElB,MAAY,IAAOkB,EAAEhB,KAAK,IAAM,0BAAMkB,UAAU,aAAY,IAAEF,EAAEpB,OAC/F,IAIN,yBAAKsB,UAAU,oBACb,wBAAIA,UAAU,0BACX5B,GAIT,EAGF,SAAegC,EAAAA,EAAAA,YAAWtC,E","sources":["webpack://tinode-webapp/./src/widgets/phone-country-selector.jsx"],"sourcesContent":["// Selector for country dialing code.\n\nimport React from 'react';\nimport { injectIntl } from 'react-intl';\n\nimport * as dcodes from '../dcodes.json';\n\nimport { flagEmoji } from '../lib/strformat';\n\nclass PhoneCountrySelector extends React.PureComponent {\n constructor(props) {\n super(props);\n\n this.countries = [];\n const {formattedDisplayName} = props.intl;\n dcodes.default.forEach(dc => {\n this.countries.push({\n dial: dc.dial,\n code: dc.code,\n flag: flagEmoji(dc.code),\n name: formattedDisplayName(dc.code, {type: 'region'})\n });\n });\n\n this.countries.sort((a, b) => a.name.localeCompare(b.name));\n\n this.handleClick = this.handleClick.bind(this);\n }\n\n handleClick(e) {\n e.preventDefault();\n this.props.onSubmit(e.target.dataset.code, e.target.dataset.dial);\n }\n\n render() {\n const countries = [];\n const selected = this.props.selected || 'US';\n this.countries.forEach(c => {\n const style = (c.code == selected ? 'selected ' : '');\n countries.push(<li className={style} key={idx} data-code={c.code} data-dial={c.dial} onClick={this.handleClick}>\n <span className=\"country-flag\">{c.flag}</span>&nbsp;{c.name}&nbsp;<span className=\"dial-code\">+{c.dial}</span>\n </li>);\n });\n\n return (\n <div className=\"scrollable-panel\">\n <ul className=\"phone-country-selector\">\n {countries}\n </ul>\n </div>\n );\n }\n}\n\nexport default injectIntl(PhoneCountrySelector);\n"],"names":["PhoneCountrySelector","React","constructor","props","super","this","countries","formattedDisplayName","intl","dcodes","dc","push","dial","code","flag","flagEmoji","name","type","sort","a","b","localeCompare","handleClick","bind","e","preventDefault","onSubmit","target","dataset","render","selected","forEach","c","style","className","key","idx","onClick","injectIntl"],"sourceRoot":""}
{"version":3,"file":"290.prod.js","mappings":"2MASA,MAAMA,UAA6BC,IAAAA,cACjCC,YAAYC,GACVC,MAAMD,GAENE,KAAKC,UAAY,GACjB,MAAM,kBAAEC,GAAsBJ,EAAMK,KACpCC,EAAAA,SAAuBC,IACPA,EAAGC,KAAKC,MAAM,KACtBC,SAAQC,IACZT,KAAKC,UAAUS,KAAK,CAClBJ,KAAMG,EAAKE,OACXC,KAAMP,EAAGO,KACTC,MAAMC,EAAAA,EAAAA,IAAUT,EAAGO,MACnBG,KAAMb,EAAkBG,EAAGO,KAAM,CAACI,KAAM,YACxC,GACF,IAGJhB,KAAKC,UAAUgB,MAAK,CAACC,EAAGC,IAAMD,EAAEH,KAAKK,cAAcD,EAAEJ,OACvD,CAEAM,SACE,MAAMpB,EAAY,GACZqB,EAAWtB,KAAKF,MAAMwB,UAAY,KAUxC,OATAtB,KAAKC,UAAUO,SAAQ,CAACe,EAAGC,KACzB,MAAMC,EAASF,EAAEX,MAAQU,EAAW,YAAc,GAClDrB,EAAUS,KAAK,wBAAIgB,UAAWD,EAAOE,IAAKH,EAAKI,QAASC,GAAK7B,KAAKF,MAAMgC,SAASP,EAAEX,KAAMW,EAAEjB,OACzF,0BAAMoB,UAAU,gBAAgBH,EAAEV,MAClC,0BAAMa,UAAU,WAAU,IAAOH,EAAER,MACnC,0BAAMW,UAAU,aAAY,KAAQH,EAAEjB,OAClC,IAIN,yBAAKoB,UAAU,mBAAmBD,MAAO,CAACM,OAAQ,UAChD,wBAAIL,UAAU,0BACXzB,GAIT,EAGF,SAAe+B,EAAAA,EAAAA,YAAWrC,E","sources":["webpack://tinode-webapp/./src/widgets/phone-country-selector.jsx"],"sourcesContent":["// Selector for country dialing code.\n\nimport React from 'react';\nimport { injectIntl } from 'react-intl';\n\nimport * as dcodes from '../dcodes.json';\n\nimport { flagEmoji } from '../lib/strformat';\n\nclass PhoneCountrySelector extends React.PureComponent {\n constructor(props) {\n super(props);\n\n this.countries = [];\n const { formatDisplayName } = props.intl;\n dcodes.default.forEach(dc => {\n const parts = dc.dial.split(',');\n parts.forEach(part => {\n this.countries.push({\n dial: part.trim(),\n code: dc.code,\n flag: flagEmoji(dc.code),\n name: formatDisplayName(dc.code, {type: 'region'})\n });\n });\n });\n\n this.countries.sort((a, b) => a.name.localeCompare(b.name));\n }\n\n render() {\n const countries = [];\n const selected = this.props.selected || 'US';\n this.countries.forEach((c, idx) => {\n const style = (c.code == selected ? 'selected ' : '');\n countries.push(<li className={style} key={idx} onClick={_ => this.props.onSubmit(c.code, c.dial)}>\n <span className=\"country-flag\">{c.flag}</span>\n <span className=\"country\">&nbsp;{c.name}</span>\n <span className=\"dial-code\">&nbsp;+{c.dial}</span>\n </li>);\n });\n\n return (\n <div className=\"scrollable-panel\" style={{height: '30rem'}}>\n <ul className=\"phone-country-selector\">\n {countries}\n </ul>\n </div>\n );\n }\n}\n\nexport default injectIntl(PhoneCountrySelector);\n"],"names":["PhoneCountrySelector","React","constructor","props","super","this","countries","formatDisplayName","intl","dcodes","dc","dial","split","forEach","part","push","trim","code","flag","flagEmoji","name","type","sort","a","b","localeCompare","render","selected","c","idx","style","className","key","onClick","_","onSubmit","height","injectIntl"],"sourceRoot":""}
+1 -1
View File
File diff suppressed because one or more lines are too long
+1 -1
View File
File diff suppressed because one or more lines are too long
+1 -1
View File
File diff suppressed because one or more lines are too long
+1 -1
View File
File diff suppressed because one or more lines are too long
+1 -1
View File
File diff suppressed because one or more lines are too long
+1 -1
View File
File diff suppressed because one or more lines are too long
+1 -1
View File
File diff suppressed because one or more lines are too long
+1 -1
View File
File diff suppressed because one or more lines are too long
+37 -14
View File
@@ -4308,7 +4308,7 @@ __webpack_require__.r(__webpack_exports__);
const PhoneEdit = react__WEBPACK_IMPORTED_MODULE_0___default().lazy(_ => __webpack_require__.e(/*! import() */ "src_widgets_phone-edit_jsx").then(__webpack_require__.bind(__webpack_require__, /*! ../widgets/phone-edit.jsx */ "./src/widgets/phone-edit.jsx")));
const PhoneEdit = react__WEBPACK_IMPORTED_MODULE_0___default().lazy(_ => Promise.all(/*! import() */[__webpack_require__.e("vendors-node_modules_libphonenumber-js_examples_mobile_json_js-node_modules_libphonenumber-js-3ba9d5"), __webpack_require__.e("src_widgets_phone-edit_jsx")]).then(__webpack_require__.bind(__webpack_require__, /*! ../widgets/phone-edit.jsx */ "./src/widgets/phone-edit.jsx")));
@@ -4330,7 +4330,7 @@ class CreateAccountView extends (react__WEBPACK_IMPORTED_MODULE_0___default().Pu
newAvatarMime: null,
errorCleared: false,
buttonDisabled: false,
method: '',
method: 'tel',
saveToken: _lib_local_storage_js__WEBPACK_IMPORTED_MODULE_6__["default"].getObject('keep-logged-in')
};
this.handleLoginChange = this.handleLoginChange.bind(this);
@@ -4346,9 +4346,7 @@ class CreateAccountView extends (react__WEBPACK_IMPORTED_MODULE_0___default().Pu
this.handleSubmit = this.handleSubmit.bind(this);
props.tinode.connect().catch(err => {
this.props.onError(err.message, 'err');
}).finally(_ => this.setState({
method: (props.tinode.getServerParam('reqCred', {}).auth || [])[0] || 'email'
}));
});
}
handleLoginChange(e) {
this.setState({
@@ -4357,7 +4355,6 @@ class CreateAccountView extends (react__WEBPACK_IMPORTED_MODULE_0___default().Pu
}
handlePasswordChange(password) {
this.setState({
meth: 'tel',
password: password
});
}
@@ -4368,7 +4365,9 @@ class CreateAccountView extends (react__WEBPACK_IMPORTED_MODULE_0___default().Pu
});
}
handlePhoneChange(number) {
console.log('handlePhoneChange', number);
this.setState({
meth: 'tel',
tel: number
});
}
@@ -4559,8 +4558,8 @@ class CreateAccountView extends (react__WEBPACK_IMPORTED_MODULE_0___default().Pu
}))
}, react__WEBPACK_IMPORTED_MODULE_0___default().createElement(PhoneEdit, {
autoFocus: false,
onShowCountrySelector: (code, dial) => console.log('onShowCountrySelector', code, dial),
onSubmit: (code, dial) => console.log('onSubmit', code, dial)
onShowCountrySelector: this.props.onShowCountrySelector,
onSubmit: this.handlePhoneChange
})))) : null, react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", {
className: "panel-form-row"
}, react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_widgets_checkbox_jsx__WEBPACK_IMPORTED_MODULE_4__["default"], {
@@ -7170,7 +7169,7 @@ __webpack_require__.r(__webpack_exports__);
/* harmony import */ var _lib_navigation_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../lib/navigation.js */ "./src/lib/navigation.js");
const PhoneEdit = react__WEBPACK_IMPORTED_MODULE_0___default().lazy(_ => __webpack_require__.e(/*! import() */ "src_widgets_phone-edit_jsx").then(__webpack_require__.bind(__webpack_require__, /*! ../widgets/phone-edit.jsx */ "./src/widgets/phone-edit.jsx")));
const PhoneEdit = react__WEBPACK_IMPORTED_MODULE_0___default().lazy(_ => Promise.all(/*! import() */[__webpack_require__.e("vendors-node_modules_libphonenumber-js_examples_mobile_json_js-node_modules_libphonenumber-js-3ba9d5"), __webpack_require__.e("src_widgets_phone-edit_jsx")]).then(__webpack_require__.bind(__webpack_require__, /*! ../widgets/phone-edit.jsx */ "./src/widgets/phone-edit.jsx")));
class PasswordResetView extends (react__WEBPACK_IMPORTED_MODULE_0___default().PureComponent) {
@@ -7731,6 +7730,7 @@ class SidepanelView extends (react__WEBPACK_IMPORTED_MODULE_0___default().PureCo
onPersistenceChange: this.props.onPersistenceChange
}) : view === 'register' ? react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_create_account_view_jsx__WEBPACK_IMPORTED_MODULE_8__["default"], {
tinode: this.props.tinode,
onShowCountrySelector: this.props.onShowCountrySelector,
onCreateAccount: this.props.onCreateAccount,
onCancel: this.props.onCancel,
onError: this.props.onError
@@ -7854,6 +7854,7 @@ __webpack_require__.r(__webpack_exports__);
const PhoneCountrySelector = react__WEBPACK_IMPORTED_MODULE_0___default().lazy(_ => __webpack_require__.e(/*! import() */ "src_widgets_phone-country-selector_jsx").then(__webpack_require__.bind(__webpack_require__, /*! ../widgets/phone-country-selector.jsx */ "./src/widgets/phone-country-selector.jsx")));
@@ -8014,6 +8015,7 @@ class TinodeWeb extends (react__WEBPACK_IMPORTED_MODULE_0___default().Component)
this.handlePasswordResetRequest = this.handlePasswordResetRequest.bind(this);
this.handleResetPassword = this.handleResetPassword.bind(this);
this.handleContextMenuAction = this.handleContextMenuAction.bind(this);
this.handleShowCountrySelector = this.handleShowCountrySelector.bind(this);
this.handleShowForwardDialog = this.handleShowForwardDialog.bind(this);
this.handleHideForwardDialog = this.handleHideForwardDialog.bind(this);
this.handleStartVideoCall = this.handleStartVideoCall.bind(this);
@@ -9376,6 +9378,27 @@ class TinodeWeb extends (react__WEBPACK_IMPORTED_MODULE_0___default().Component)
});
}
}
handleShowCountrySelector(code, dial, selectedCallback) {
console.log('handleShowCountrySelector', code, dial);
this.handleShowAlert("Select country", react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react__WEBPACK_IMPORTED_MODULE_0__.Suspense, {
fallback: react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", null, react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_intl__WEBPACK_IMPORTED_MODULE_1__.FormattedMessage, {
id: "loading_note",
defaultMessage: [{
"type": 0,
"value": "Loading..."
}]
}))
}, react__WEBPACK_IMPORTED_MODULE_0___default().createElement(PhoneCountrySelector, {
selected: code,
onSubmit: (c, d) => {
console.log("handleShowCountrySelector click", c, d);
this.setState({
alertVisible: false
});
selectedCallback(c, d);
}
})), null, null, _ => {}, "Cancel");
}
handleStartVideoCall() {
this.setState({
callTopic: this.state.topicSelected,
@@ -9567,19 +9590,18 @@ class TinodeWeb extends (react__WEBPACK_IMPORTED_MODULE_0___default().Component)
onAcceptCall: this.handleCallAccept,
onReject: this.handleCallHangup
}) : null, this.state.alertVisible ? react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_widgets_alert_jsx__WEBPACK_IMPORTED_MODULE_5__["default"], {
visible: this.state.alertVisible,
title: this.state.alertParams.title,
content: this.state.alertParams.content,
onReject: this.state.alertParams.onReject ? _ => this.setState({
alertVisible: false
}) : null,
reject: this.state.alertParams.reject,
onConfirm: _ => {
onConfirm: this.state.alertParams.onConfirm ? _ => {
this.setState({
alertVisible: false
});
this.state.alertParams.onConfirm();
},
} : null,
confirm: this.state.alertParams.confirm
}) : null, react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_sidepanel_view_jsx__WEBPACK_IMPORTED_MODULE_11__["default"], {
tinode: this.tinode,
@@ -9640,6 +9662,7 @@ class TinodeWeb extends (react__WEBPACK_IMPORTED_MODULE_0___default().Component)
onResetPassword: this.handleResetPassword,
onShowArchive: this.handleShowArchive,
onShowBlocked: this.handleShowBlocked,
onShowCountrySelector: this.handleShowCountrySelector,
onInitFind: this.tnInitFind,
searchResults: this.state.searchResults,
onSearchContacts: this.handleSearchContacts,
@@ -9917,7 +9940,7 @@ class Alert extends (react__WEBPACK_IMPORTED_MODULE_0___default().PureComponent)
"type": 0,
"value": "Cancel"
}]
})) : null, react__WEBPACK_IMPORTED_MODULE_0___default().createElement("button", {
})) : null, this.props.onConfirm ? react__WEBPACK_IMPORTED_MODULE_0___default().createElement("button", {
className: "primary",
onClick: this.props.onConfirm
}, this.props.confirm || react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_intl__WEBPACK_IMPORTED_MODULE_1__.FormattedMessage, {
@@ -9926,7 +9949,7 @@ class Alert extends (react__WEBPACK_IMPORTED_MODULE_0___default().PureComponent)
"type": 0,
"value": "OK"
}]
})))));
})) : null)));
}
}
;
+1 -1
View File
File diff suppressed because one or more lines are too long
+1 -1
View File
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@@ -26,44 +26,45 @@ class PhoneCountrySelector extends (react__WEBPACK_IMPORTED_MODULE_0___default()
super(props);
this.countries = [];
const {
formattedDisplayName
formatDisplayName
} = props.intl;
_dcodes_json__WEBPACK_IMPORTED_MODULE_2__.forEach(dc => {
this.countries.push({
dial: dc.dial,
code: dc.code,
flag: (0,_lib_strformat__WEBPACK_IMPORTED_MODULE_3__.flagEmoji)(dc.code),
name: formattedDisplayName(dc.code, {
type: 'region'
})
const parts = dc.dial.split(',');
parts.forEach(part => {
this.countries.push({
dial: part.trim(),
code: dc.code,
flag: (0,_lib_strformat__WEBPACK_IMPORTED_MODULE_3__.flagEmoji)(dc.code),
name: formatDisplayName(dc.code, {
type: 'region'
})
});
});
});
this.countries.sort((a, b) => a.name.localeCompare(b.name));
this.handleClick = this.handleClick.bind(this);
}
handleClick(e) {
e.preventDefault();
this.props.onSubmit(e.target.dataset.code, e.target.dataset.dial);
}
render() {
const countries = [];
const selected = this.props.selected || 'US';
this.countries.forEach(c => {
this.countries.forEach((c, idx) => {
const style = c.code == selected ? 'selected ' : '';
countries.push(react__WEBPACK_IMPORTED_MODULE_0___default().createElement("li", {
className: style,
key: idx,
"data-code": c.code,
"data-dial": c.dial,
onClick: this.handleClick
onClick: _ => this.props.onSubmit(c.code, c.dial)
}, react__WEBPACK_IMPORTED_MODULE_0___default().createElement("span", {
className: "country-flag"
}, c.flag), "\xA0", c.name, "\xA0", react__WEBPACK_IMPORTED_MODULE_0___default().createElement("span", {
}, c.flag), react__WEBPACK_IMPORTED_MODULE_0___default().createElement("span", {
className: "country"
}, "\xA0", c.name), react__WEBPACK_IMPORTED_MODULE_0___default().createElement("span", {
className: "dial-code"
}, "+", c.dial)));
}, "\xA0+", c.dial)));
});
return react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", {
className: "scrollable-panel"
className: "scrollable-panel",
style: {
height: '30rem'
}
}, react__WEBPACK_IMPORTED_MODULE_0___default().createElement("ul", {
className: "phone-country-selector"
}, countries));
@@ -1 +1 @@
{"version":3,"file":"src_widgets_phone-country-selector_jsx.dev.js","mappings":";;;;;;;;;;;;;;;;;;;AAE0B;AACc;AAEC;AAEI;AAE7C,MAAMI,oBAAoB,SAASJ,4DAAmB,CAAC;EACrDM,WAAW,CAACC,KAAK,EAAE;IACjB,KAAK,CAACA,KAAK,CAAC;IAEZ,IAAI,CAACC,SAAS,GAAG,EAAE;IACnB,MAAM;MAACC;IAAoB,CAAC,GAAGF,KAAK,CAACG,IAAI;IACzCR,iDAAsB,CAACW,EAAE,IAAI;MAC3B,IAAI,CAACL,SAAS,CAACM,IAAI,CAAC;QAClBC,IAAI,EAAEF,EAAE,CAACE,IAAI;QACbC,IAAI,EAAEH,EAAE,CAACG,IAAI;QACbC,IAAI,EAAEd,yDAAS,CAACU,EAAE,CAACG,IAAI,CAAC;QACxBE,IAAI,EAAET,oBAAoB,CAACI,EAAE,CAACG,IAAI,EAAE;UAACG,IAAI,EAAE;QAAQ,CAAC;MACtD,CAAC,CAAC;IACJ,CAAC,CAAC;IAEF,IAAI,CAACX,SAAS,CAACY,IAAI,CAAC,CAACC,CAAC,EAAEC,CAAC,KAAKD,CAAC,CAACH,IAAI,CAACK,aAAa,CAACD,CAAC,CAACJ,IAAI,CAAC,CAAC;IAE3D,IAAI,CAACM,WAAW,GAAG,IAAI,CAACA,WAAW,CAACC,IAAI,CAAC,IAAI,CAAC;EAChD;EAEAD,WAAW,CAACE,CAAC,EAAE;IACbA,CAAC,CAACC,cAAc,EAAE;IAClB,IAAI,CAACpB,KAAK,CAACqB,QAAQ,CAACF,CAAC,CAACG,MAAM,CAACC,OAAO,CAACd,IAAI,EAAEU,CAAC,CAACG,MAAM,CAACC,OAAO,CAACf,IAAI,CAAC;EACnE;EAEAgB,MAAM,GAAG;IACP,MAAMvB,SAAS,GAAG,EAAE;IACpB,MAAMwB,QAAQ,GAAG,IAAI,CAACzB,KAAK,CAACyB,QAAQ,IAAI,IAAI;IAC5C,IAAI,CAACxB,SAAS,CAACI,OAAO,CAACqB,CAAC,IAAI;MAC1B,MAAMC,KAAK,GAAID,CAAC,CAACjB,IAAI,IAAIgB,QAAQ,GAAG,WAAW,GAAG,EAAG;MACrDxB,SAAS,CAACM,IAAI,CAAC;QAAI,SAAS,EAAEoB,KAAM;QAAC,GAAG,EAAEC,GAAI;QAAC,aAAWF,CAAC,CAACjB,IAAK;QAAC,aAAWiB,CAAC,CAAClB,IAAK;QAAC,OAAO,EAAE,IAAI,CAACS;MAAY,GAC7G;QAAO,SAAS,EAAC;MAAc,GAAES,CAAC,CAAChB,IAAI,CAAQ,QAAM,EAACgB,CAAC,CAACf,IAAI,EAAC,MAAM;QAAM,SAAS,EAAC;MAAW,GAAC,GAAC,EAACe,CAAC,CAAClB,IAAI,CAAQ,CAC5G,CAAC;IACR,CAAC,CAAC;IAEF,OACE;MAAK,SAAS,EAAC;IAAkB,GAC/B;MAAI,SAAS,EAAC;IAAwB,GACnCP,SAAS,CACP,CACD;EAEV;AACF;AAEA,iEAAeP,sDAAU,CAACG,oBAAoB,CAAC","sources":["webpack://tinode-webapp/./src/widgets/phone-country-selector.jsx"],"sourcesContent":["// Selector for country dialing code.\n\nimport React from 'react';\nimport { injectIntl } from 'react-intl';\n\nimport * as dcodes from '../dcodes.json';\n\nimport { flagEmoji } from '../lib/strformat';\n\nclass PhoneCountrySelector extends React.PureComponent {\n constructor(props) {\n super(props);\n\n this.countries = [];\n const {formattedDisplayName} = props.intl;\n dcodes.default.forEach(dc => {\n this.countries.push({\n dial: dc.dial,\n code: dc.code,\n flag: flagEmoji(dc.code),\n name: formattedDisplayName(dc.code, {type: 'region'})\n });\n });\n\n this.countries.sort((a, b) => a.name.localeCompare(b.name));\n\n this.handleClick = this.handleClick.bind(this);\n }\n\n handleClick(e) {\n e.preventDefault();\n this.props.onSubmit(e.target.dataset.code, e.target.dataset.dial);\n }\n\n render() {\n const countries = [];\n const selected = this.props.selected || 'US';\n this.countries.forEach(c => {\n const style = (c.code == selected ? 'selected ' : '');\n countries.push(<li className={style} key={idx} data-code={c.code} data-dial={c.dial} onClick={this.handleClick}>\n <span className=\"country-flag\">{c.flag}</span>&nbsp;{c.name}&nbsp;<span className=\"dial-code\">+{c.dial}</span>\n </li>);\n });\n\n return (\n <div className=\"scrollable-panel\">\n <ul className=\"phone-country-selector\">\n {countries}\n </ul>\n </div>\n );\n }\n}\n\nexport default injectIntl(PhoneCountrySelector);\n"],"names":["React","injectIntl","dcodes","flagEmoji","PhoneCountrySelector","PureComponent","constructor","props","countries","formattedDisplayName","intl","default","forEach","dc","push","dial","code","flag","name","type","sort","a","b","localeCompare","handleClick","bind","e","preventDefault","onSubmit","target","dataset","render","selected","c","style","idx"],"sourceRoot":""}
{"version":3,"file":"src_widgets_phone-country-selector_jsx.dev.js","mappings":";;;;;;;;;;;;;;;;;;;AAE0B;AACc;AAEC;AAEI;AAE7C,MAAMI,oBAAoB,SAASJ,4DAAmB,CAAC;EACrDM,WAAW,CAACC,KAAK,EAAE;IACjB,KAAK,CAACA,KAAK,CAAC;IAEZ,IAAI,CAACC,SAAS,GAAG,EAAE;IACnB,MAAM;MAAEC;IAAkB,CAAC,GAAGF,KAAK,CAACG,IAAI;IACxCR,iDAAsB,CAACW,EAAE,IAAI;MAC3B,MAAMC,KAAK,GAAGD,EAAE,CAACE,IAAI,CAACC,KAAK,CAAC,GAAG,CAAC;MAChCF,KAAK,CAACF,OAAO,CAACK,IAAI,IAAI;QACpB,IAAI,CAACT,SAAS,CAACU,IAAI,CAAC;UAClBH,IAAI,EAAEE,IAAI,CAACE,IAAI,EAAE;UACjBC,IAAI,EAAEP,EAAE,CAACO,IAAI;UACbC,IAAI,EAAElB,yDAAS,CAACU,EAAE,CAACO,IAAI,CAAC;UACxBE,IAAI,EAAEb,iBAAiB,CAACI,EAAE,CAACO,IAAI,EAAE;YAACG,IAAI,EAAE;UAAQ,CAAC;QACnD,CAAC,CAAC;MACJ,CAAC,CAAC;IACJ,CAAC,CAAC;IAEF,IAAI,CAACf,SAAS,CAACgB,IAAI,CAAC,CAACC,CAAC,EAAEC,CAAC,KAAKD,CAAC,CAACH,IAAI,CAACK,aAAa,CAACD,CAAC,CAACJ,IAAI,CAAC,CAAC;EAC7D;EAEAM,MAAM,GAAG;IACP,MAAMpB,SAAS,GAAG,EAAE;IACpB,MAAMqB,QAAQ,GAAG,IAAI,CAACtB,KAAK,CAACsB,QAAQ,IAAI,IAAI;IAC5C,IAAI,CAACrB,SAAS,CAACI,OAAO,CAAC,CAACkB,CAAC,EAAEC,GAAG,KAAK;MACjC,MAAMC,KAAK,GAAIF,CAAC,CAACV,IAAI,IAAIS,QAAQ,GAAG,WAAW,GAAG,EAAG;MACrDrB,SAAS,CAACU,IAAI,CAAC;QAAI,SAAS,EAAEc,KAAM;QAAC,GAAG,EAAED,GAAI;QAAC,OAAO,EAAEE,CAAC,IAAI,IAAI,CAAC1B,KAAK,CAAC2B,QAAQ,CAACJ,CAAC,CAACV,IAAI,EAAEU,CAAC,CAACf,IAAI;MAAE,GAC/F;QAAM,SAAS,EAAC;MAAc,GAAEe,CAAC,CAACT,IAAI,CAAQ,EAC9C;QAAM,SAAS,EAAC;MAAS,GAAC,MAAM,EAACS,CAAC,CAACR,IAAI,CAAQ,EAC/C;QAAM,SAAS,EAAC;MAAW,GAAC,OAAO,EAACQ,CAAC,CAACf,IAAI,CAAQ,CAC/C,CAAC;IACR,CAAC,CAAC;IAEF,OACE;MAAK,SAAS,EAAC,kBAAkB;MAAC,KAAK,EAAE;QAACoB,MAAM,EAAE;MAAO;IAAE,GACzD;MAAI,SAAS,EAAC;IAAwB,GACnC3B,SAAS,CACP,CACD;EAEV;AACF;AAEA,iEAAeP,sDAAU,CAACG,oBAAoB,CAAC","sources":["webpack://tinode-webapp/./src/widgets/phone-country-selector.jsx"],"sourcesContent":["// Selector for country dialing code.\n\nimport React from 'react';\nimport { injectIntl } from 'react-intl';\n\nimport * as dcodes from '../dcodes.json';\n\nimport { flagEmoji } from '../lib/strformat';\n\nclass PhoneCountrySelector extends React.PureComponent {\n constructor(props) {\n super(props);\n\n this.countries = [];\n const { formatDisplayName } = props.intl;\n dcodes.default.forEach(dc => {\n const parts = dc.dial.split(',');\n parts.forEach(part => {\n this.countries.push({\n dial: part.trim(),\n code: dc.code,\n flag: flagEmoji(dc.code),\n name: formatDisplayName(dc.code, {type: 'region'})\n });\n });\n });\n\n this.countries.sort((a, b) => a.name.localeCompare(b.name));\n }\n\n render() {\n const countries = [];\n const selected = this.props.selected || 'US';\n this.countries.forEach((c, idx) => {\n const style = (c.code == selected ? 'selected ' : '');\n countries.push(<li className={style} key={idx} onClick={_ => this.props.onSubmit(c.code, c.dial)}>\n <span className=\"country-flag\">{c.flag}</span>\n <span className=\"country\">&nbsp;{c.name}</span>\n <span className=\"dial-code\">&nbsp;+{c.dial}</span>\n </li>);\n });\n\n return (\n <div className=\"scrollable-panel\" style={{height: '30rem'}}>\n <ul className=\"phone-country-selector\">\n {countries}\n </ul>\n </div>\n );\n }\n}\n\nexport default injectIntl(PhoneCountrySelector);\n"],"names":["React","injectIntl","dcodes","flagEmoji","PhoneCountrySelector","PureComponent","constructor","props","countries","formatDisplayName","intl","default","forEach","dc","parts","dial","split","part","push","trim","code","flag","name","type","sort","a","b","localeCompare","render","selected","c","idx","style","_","onSubmit","height"],"sourceRoot":""}
+39 -7
View File
@@ -15,12 +15,17 @@ __webpack_require__.r(__webpack_exports__);
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var react_intl__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-intl */ "react-intl");
/* harmony import */ var react_intl__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react_intl__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var libphonenumber_js_mobile__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! libphonenumber-js/mobile */ "./node_modules/libphonenumber-js/mobile/exports/parsePhoneNumberWithError.js");
/* harmony import */ var libphonenumber_js_mobile__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! libphonenumber-js/mobile */ "./node_modules/libphonenumber-js/mobile/exports/getExampleNumber.js");
/* harmony import */ var libphonenumber_js_mobile_examples__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! libphonenumber-js/mobile/examples */ "./node_modules/libphonenumber-js/examples.mobile.json.js");
/* harmony import */ var _dcodes_json__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../dcodes.json */ "./src/dcodes.json");
/* harmony import */ var _lib_strformat__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../lib/strformat */ "./src/lib/strformat.js");
class PhoneEdit extends (react__WEBPACK_IMPORTED_MODULE_0___default().PureComponent) {
constructor(props) {
super(props);
@@ -28,10 +33,13 @@ class PhoneEdit extends (react__WEBPACK_IMPORTED_MODULE_0___default().PureCompon
_dcodes_json__WEBPACK_IMPORTED_MODULE_2__.forEach(dc => {
this.codeMap[dc.code] = dc.dial;
});
const code = props.countryCode || 'US';
const dial = this.codeMap[code];
this.state = {
countryCode: props.countryCode || 'US',
dialCode: this.codeMap[props.countryCode || 'US'],
localNumber: ''
countryCode: code,
dialCode: dial,
localNumber: '',
placeholderNumber: this.placeholderNumber(code, dial)
};
this.handleChange = this.handleChange.bind(this);
this.handleFinished = this.handleFinished.bind(this);
@@ -45,8 +53,16 @@ class PhoneEdit extends (react__WEBPACK_IMPORTED_MODULE_0___default().PureCompon
}
handleFinished(e) {
e.preventDefault();
const number = `${this.state.dialCode}${this.state.localNumber.trim()}`.replace(/[^\d]/g, '');
this.props.onSubmit(`+${number}`);
const raw = `${this.state.dialCode}${this.state.localNumber.trim()}`.replace(/[^\d]/g, '');
let number = null;
try {
number = (0,libphonenumber_js_mobile__WEBPACK_IMPORTED_MODULE_4__.parsePhoneNumberWithError)(raw);
} catch (err) {}
if (!number || !number.isValid()) {
this.inputField.setCustomValidity("Mobile phone number required");
return;
}
this.props.onSubmit(number.format('E.164'));
}
handleKeyDown(e) {
if (e.key === 'Enter') {
@@ -54,7 +70,14 @@ class PhoneEdit extends (react__WEBPACK_IMPORTED_MODULE_0___default().PureCompon
}
}
showCountrySelector() {
this.props.onShowCountrySelector(this.state.countryCode, this.state.dialCode);
this.props.onShowCountrySelector(this.state.countryCode, this.state.dialCode, (code, dial) => {
console.log('Callback', code, dial);
this.setState({
countryCode: code,
dialCode: dial,
placeholderNumber: this.placeholderNumber(code, dial)
});
});
}
filterNumber(number) {
if (!number) {
@@ -62,7 +85,13 @@ class PhoneEdit extends (react__WEBPACK_IMPORTED_MODULE_0___default().PureCompon
}
return number.replace(/[^-\s().\d]/g, '');
}
placeholderNumber(code, dial) {
console.log('In nplaceholder', code, dial);
const number = (0,libphonenumber_js_mobile__WEBPACK_IMPORTED_MODULE_5__.getExampleNumber)(code, libphonenumber_js_mobile_examples__WEBPACK_IMPORTED_MODULE_6__["default"]).formatInternational();
return number.substring(dial.length + 1).trim();
}
render() {
console.log('placeholder:', this.state.placeholderNumber);
return react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, react__WEBPACK_IMPORTED_MODULE_0___default().createElement("span", {
className: "dial-code",
onClick: this.showCountrySelector
@@ -70,7 +99,10 @@ class PhoneEdit extends (react__WEBPACK_IMPORTED_MODULE_0___default().PureCompon
className: "country-flag"
}, (0,_lib_strformat__WEBPACK_IMPORTED_MODULE_3__.flagEmoji)(this.state.countryCode), "\xA0"), "+", this.state.dialCode, "\xA0"), react__WEBPACK_IMPORTED_MODULE_0___default().createElement("input", {
type: "tel",
placeholder: this.state.placeholder,
ref: ref => {
this.inputField = ref;
},
placeholder: this.state.placeholderNumber,
value: this.state.localNumber,
onChange: this.handleChange,
maxLength: 17,
File diff suppressed because one or more lines are too long