-
Notifications
You must be signed in to change notification settings - Fork 1.8k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Phone number field with country selector (new component request) #3948
Comments
@carbon-design-system/design What category do you think this request would fit in, core component, community-level component, BU/application-level component? |
I'm guessing core and community-level but I'm not sure how these three options are defined. Is there any place I can refer to that explains how these categories work? |
I think it would be a core component. Not sure if it would be its own component or live as a variation under |
Thanks @aagonzales for your feedback! Technically I'm inclined to make it a separate component from text input given the additional UI the |
We've marked this issue as stale because there hasn't been any activity for a couple of weeks. If there's no further activity on this issue in the next three days then we'll close it. You can keep the conversation going with just a short comment. Thanks for your contributions. |
Hi, I'm wondering if this field will be available soon. Also just commenting to prevent the bot from closing it. |
Next steps:
|
@sstrubberg this got brought up in the IBMer Experience Library meeting with the w3 folks (aka Juan's team). They have a need for this type of input and are interested in contributing. Alicia Brooks and Juan are POCs |
The Carbon team has accepted this proposal! Our team doesn't have the capacity to work on this now, so we are requesting community contributors. Please see the labels for roles that are needed. If you are willing to help out, comment below and we will get in touch! |
Hey folks! I looked into the docs to see if I can implement this using existing carbon components like I have implemented a similar component in the past using https://www.npmjs.com/package/react-phone-number-input I'm interested in taking this up, let me know if this approach is okay with the team :) |
@AdityaPimpalkar Nice, thanks for your interest wanting to working on this! Generally Carbon input components don't include validation. Ideally the component API would be open ended so that a user could use the libraries you mention, or they could use others, or write their own custom implementation. Below are some thoughts I have on the implementation direction: Naming
Country code selector
Formatting (field masking)
Flags
In the storybook
Open questions:
|
This also should be marked experimental at first and exported as |
What package(s) are you using?
carbon-components
carbon-components-react
Detailed description
New component. I design the IBM Registration forms on the URX squad and there is no phone number field with a country code selector. This component exists in Northstar and it would be helpful to have it added to the design carbon kit and system.
Phone number field with country code
It just doesn't exist in the carbon design kit.
Designing and building for all browsers.
Version 10
Unified Registration Experience (URX), we have a release coming up in October.
Additional information
This is the phone number field in Northstar. (currently live - https://www.ibm.com/account/reg/us-en/signup?formid=urx-19774)
This is what I've created as a placeholder in my mockups
Add labels
Please choose the appropriate label(s) from our existing label list to ensure
that your issue is properly categorized. This will help us to better understand
and address your issue.
The text was updated successfully, but these errors were encountered: