Format output of serialized value

[reintroducing]

I'm using the Input component (no country select) for only US numbers with country="US" set. When I input the number, its formatted correctly (example: 5551234567 formats to (555) 123-4567 visually in the input) but when the data is submitted and serialized as part of a form, the number is coming through as +15551234567. I'd like to only get 5551234567 without the +1 at the beginning. Is there a way to format the serialized output when submitting the form without having to manually grab the data of the phone input, remove the +1 doing something like phone.replace('+1', ''), and then adding that back to the submit data? I'd love to make this part of the component itself not have to manually alter form data everywhere that we use a PhoneInput.

[reintroducing]

And actually, if a default value is set, it also has to include the +1 for it to show up in the input, just passing the number itself 5551234567 will also not have any impact. Would be great to handle that as well if possible. For cases where the phone input doesn't care about internationalization this should not hinder usage.

[catamphetamine]

but when the data is submitted and serialized as part of a form, the number is coming through as +15551234567.

Correct.

I'd like to only get 5551234567 without the +1 at the beginning.

Then you'd have to strip it.

Is there a way to format the serialized output when submitting the form without having to manually grab the data of the phone input, remove the +1 doing something like phone.replace('+1', '').

No

And actually, if a default value is set, it also has to include the +1 for it to show up in the input, just passing the number itself 5551234567 will also not have any impact.

Correct.

Would be great to handle that as well if possible. For cases where the phone input doesn't care about internationalization this should not hinder usage.

Care about internationalization.

[reintroducing]

@catamphetamine lol, i understand your sentiment and caring about internationalization, but certain applications, like ours for instance, are not internationalized as they are very specific to the health care sector in the united states. it would be nice if this component gave the flexibility to do this, but as i've told you in the past when filing issues, this is your library and you can and will do as you please with it.

that being said, i'd just urge you to think about more customization possibilities to allow not just what you believe is the right way to code but from a developer experience perspective and realize that not everyone has the same exact needs and beliefs as you do. and yes, i realize i can simply fork this repo and add what i need, but that would just bring more fracture to the work and others would not be able to use it either. just simply asking for you to keep an open mind is all.

[catamphetamine]

certain applications, like ours for instance, are not internationalized as they are very specific to the health care sector in the united states.

Then simply trim or re-add the +1 part.

[reintroducing]

absolutely, we will do that, but its an extra step we have to do wherever we have a form that uses a phone input whereas all the other fields we can just use the serialized data straight from the submit and pass to the endpoint. additionally any numbers coming in from an API that need to pre-populate a form need to also be altered before setting the default values on the form to add the +1 to the phone number fields or else they won't show up at all. it can be avoided by allowing the component the flexibility by adding a prop not to have to do all of that work on every form that uses the phone input is all i'm saying.

[catamphetamine]

but its an extra step we have to do wherever we have a form that uses a phone input

Then create a custom component wrapping this library's component. Do I really have to explain such basic stuff to a "React developer"?

[catamphetamine]

I don't care about your custom hacky case btw