Input Tel
A telephone number input. Triggers the numeric keypad on mobile devices and supports autocomplete for phone numbers.
Default
Telephone input that triggers the numeric keypad on mobile.
<diwa-input-tel label="Phone number" placeholder="+1 (555) 000-0000"></diwa-input-tel>Error state
Validation error with descriptive message.
<diwa-input-tel label="Phone number" value="123" state="error" message="Please enter a valid phone number."></diwa-input-tel>Compact
<diwa-input-tel label="Phone number" placeholder="+1 (555) 000-0000" compact></diwa-input-tel>Disabled
<diwa-input-tel label="Phone number" value="+1 (555) 123-4567" disabled></diwa-input-tel>Slots
Use start to prepend a country code inside the input border, and label-after to place contextual icons or links after the label.
<diwa-input-tel label="Phone number" placeholder="555 000 0000">
<span slot="start">+1</span>
<diwa-icon slot="label-after" name="info" size="16"></diwa-icon>
</diwa-input-tel>