components
Input Phone
v.1.0.0 | Saturn
StorybookField that allows users to enter phone numbers with the appropiate format.
import { InputPhone } from '@kubit-ui-web/react-components'
12345678
<InputPhone
variant="DEFAULT"
prefix={{ content: '+34' }}
flag={{ icon: 'ICON_MOBILE' }}
label={{ content: 'Label' }}
placeholder="Placeholder"
helpMessage={{ content: 'Help message' }}
/>The InputPhone component inherits its properties of the Input component. For more information visit the Input documentation.
Variant
In Kubit Design System, users have the freedom to generate variants for each component according to their needs. While predefined variants are provided as examples, they can be modified or new ones can be added to align with the specific requirements of each project.
We have set this predefined style for its quick use, access them through the variant prop:
import { InputPhone } from '@kubit-ui-web/react-components'
12345678
<InputPhone
variant="DEFAULT"
prefix={{ content: '+34' }}
flag={{ icon: 'ICON_MOBILE' }}
label={{ content: 'Label' }}
placeholder="Placeholder"
helpMessage={{ content: 'Help message' }}
/>