input phone / react: country code not recognized

[MarekLacoAXA]

EXPECTED: country code prefix (+41 Deutschland) of value (maybe defaultValue too?) gets recognized and displayed in dropdown.

ACTUAL: dropdown stays Schweiz in all cases; Textfied contains +49 prefix on most cases, see screenshot.

Code: (spaces / no spaces):

           <AXAInputPhoneReact value="+49 123"/>
           <AXAInputPhoneReact defaultValue="+49 123"/>
           <AXAInputPhoneReact value="+49 123" defaultValue="+49 123"/>

          <AXAInputPhoneReact value="+49123"/>
          <AXAInputPhoneReact defaultValue="+49123"/>
          <AXAInputPhoneReact value="+49123" defaultValue="+49123"/>

Screen:

[markus-walther]

This is a consequence of violating https://github.com/axa-ch-webhub-cloud/pattern-library/tree/develop/src/components/20-molecules/input-phone#value requirements, i.e. no space between country code and local phone number. As such this is not a bug, since the behaviour is deliberate and documented.

Also see #2277 (comment) for deeper explanation.

[MarekLacoAXA]

SORRY, there is is typo in my OP!
Is: "country code prefix (+41 Deutschland)"
Should be: "country code prefix (+49 Deutschland)"

Question remains: why does the dropdown show "Schweiz (+41)" when "+49 " prefix is supplied in value? Screnshot

[markus-walther]

OK, I could reproduce it. Likely fix will be for the defaultValue case.

[markus-walther]

[markus-walther]

@MarekLacoAXA I intend to fix this bug by processing defaultValue once after the initial render, handling composite numbers there as well.

Note that the UI encourages a separate selection of country-code and phone number, that's almost the whole point of why we have that component in the first place. Composite numbers were added for user-pasting of existing numbers, e.g. from other web documents, they are not the main focus of this component, merely a convenience feature.

So, initializing it from a composite number is an oddity, but I am willing to make an exception here.

[MarekLacoAXA]

Hi @markus-walther !
I think this issue might be related to the Datepicker, same as in the other issue here: #2274

When datepicker is in place, then the dropdown shows "S..." (see my screenshots).
Without datepicker included, the dropdown shows "+49" (see your screenshots).

[MarekLacoAXA]

@MarekLacoAXA I intend to fix this bug by processing defaultValue once after the initial render, handling composite numbers there as well.

I think that processing "each time" when "defaultValue" changes, would be better (more natural) then processing only "once".
While processing "once" is probably mostly sufficient, still it could lead to surprises when a consumer decides to change defaultValue over time and would wonder why there is no reaction from the component.

Note that the UI encourages a separate selection of country-code and phone number, that's almost the whole point of why we have that component in the first place.

I would like to let users edit existing numbers using this component. Existing numbers means: numbers were entered PRIOR using this component: so there is no assurance that a space separator is in place between country prefix and national number.

Composite numbers were added for user-pasting of existing numbers, e.g. from other web documents, they are not the main focus of this component, merely a convenience feature.
So, initializing it from a composite number is an oddity, but I am willing to make an exception here.

Thanks!!!