inputRef es el número que estoy ingresando en el cuadro de entrada. solo consta de números sin código de país. en primer lugar, tengo que elegir o escribir el código de país y lo hará . Lo que estoy tratando de hacer es usar expresiones regulares para verificar si el número es correcto para cada país individualmente. No sé cómo tengo que fusionar el código de país y el número de teléfono del valor ingresado por el usuario y luego verificarlo todo junto. Digamos que si es para Estados Unidos tiene que validar número por número de EE. UU., si es para Suiza tiene que verificarlo para Suiza. Puedo agregar una expresión regular general usando pattern:// pero no sé cómo puedo hacerlo para cada país por separado. en el código dado, solo prueba la entrada con el código de país, pero no debería hacerlo porque el código de país debe tenerse en cuenta desde CountryCodeSelector y luego regex debe verificarlo. Sé que este problema no es tan fácil, pero ¿alguien puede ayudarme a resolverlo? Gracias por adelantado

 <div className={classes.phoneInputs} id="phone"> <FormControl className={classes.phoneSuffix}> <Controller name="phoneSuffix" control={control} render={({ onChange, value }) => ( <CountryCodeSelector value={value} onChange={onChange} /> )} /> </FormControl> <Input inputRef={register({ required:true, pattern:/^\+(?:[0-9] ?){6,12}[0-9]$/im })} name="phone" placeholder="XXX XXX XXX" className={classes.phoneInput} error={!!errors?.phone} onBlur={handleBlurPhone} data-test="form-phone" /> </div>

Estoy agregando algunas fotos aquí para expresar el problema mucho más detalladamente: [

solo debe consistir en números, no en ningún signo porque el código de país debe verificarse mediante expresiones regulares, pero no sé cómo puedo hacerlo para cada país por separado

[regex tiene que tener en cuenta que el código de país ya está allí y no debería funcionar y tiene que dar error pero no está dando error