Ready to use phone input component with country code dropdown, with validation and formatting. The component extend the <BaseInput> component, so you can use all the props and events of the base component.

The component provides a country dropdown to select the country code, you can use the country prop to set the default country, otherwise it will be detected from the user's input. You can use the v-model:country notation to get the selected/detected country code.

By default, the input value will be formatted in the international format, you can change this behavior with the format prop to change it to national.

The component provides a @validation event to indicate if the input value is valid or not