chore: PhoneNumberInput not being used
This commit is contained in:
parent
6a82e0a085
commit
1f94d95989
1 changed files with 0 additions and 44 deletions
|
|
@ -1,44 +0,0 @@
|
||||||
import { makeStyles } from '@material-ui/core'
|
|
||||||
import React, { memo, useState } from 'react'
|
|
||||||
|
|
||||||
import TextInputFormik from './TextInput'
|
|
||||||
import { styles } from './TextInput.styles'
|
|
||||||
|
|
||||||
const useStyles = makeStyles(styles)
|
|
||||||
|
|
||||||
const mask =
|
|
||||||
/(\+)(9[976]\d|8[987530]\d|6[987]\d|5[90]\d|42\d|3[875]\d|2[98654321]\d|9[8543210]|8[6421]|6[6543210]|5[87654321]|4[987654310]|3[9643210]|2[70]|7|1)(\d{1,3}){0,1}(\d{1,3}){0,1}(\d{1,3}){0,1}(\d{1,3}){0,1}(\d{1,2}){0,1}$/
|
|
||||||
const maskValue = value =>
|
|
||||||
value ? value.replace(mask, '$1 $2 $3 $4 $5 $6') : ''
|
|
||||||
|
|
||||||
const PhoneNumberInputFormik = memo(({ ...props }) => {
|
|
||||||
const { onChange, value } = props.field
|
|
||||||
|
|
||||||
const classes = useStyles()
|
|
||||||
|
|
||||||
// Regex adapted from http://phoneregex.com/
|
|
||||||
|
|
||||||
const [maskedValue, setMaskedValue] = useState(maskValue(value))
|
|
||||||
|
|
||||||
const handleChange = event => {
|
|
||||||
setMaskedValue(maskValue(event.target.value))
|
|
||||||
|
|
||||||
onChange(event)
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<>
|
|
||||||
<span className={classes.masked} aria-hidden="true">
|
|
||||||
{maskedValue}
|
|
||||||
</span>
|
|
||||||
<TextInputFormik
|
|
||||||
inputProps={{ maxLength: 17 }}
|
|
||||||
className={classes.maskedInput}
|
|
||||||
onChange={handleChange}
|
|
||||||
{...props}
|
|
||||||
/>
|
|
||||||
</>
|
|
||||||
)
|
|
||||||
})
|
|
||||||
|
|
||||||
export { PhoneNumberInputFormik, mask, maskValue }
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue