Phone Input
An international phone number input with country selector and validation.
Parsing, formatting, and validation are handled by svelte-tel-input (a libphonenumber wrapper) — lily only styles it.
Installation
Installs the style saved in lily.json. For a new Diamond project,
run lily-svelte init --style diamond first.
Install the lily base and `utils` (run once per project).
npx lily-svelte@latest init Add the dependencies, then copy the source into $lib/components/ui/phone-input.
npm install svelte-tel-input country-flag-icons Usage
<script lang="ts">
import { PhoneInput } from '$lib/components/ui/phone-input';
let value = $state('');
let valid = $state(true);
</script>
<PhoneInput defaultCountry="US" bind:value bind:valid />