shaiful/phone-input

A Laravel package for phone input with flags and country codes

v1.1.4 2025-01-28 03:18 UTC

Requires

• php: ^8.1
• illuminate/support: ^8.0|^9.0|^10.0|^11.0

proprietary

• Shaiful

README

This package is used to use ITL Phone input with laravel livewire

Installation

1. Add the following into composer.json:

   composer require shaiful/phone-input
   

2. Publish the vendor files

   php artisan vendor:publish --provider="Shaiful\PhoneInput\PhoneInputServiceProvider"
   

3. Include css tags and js tags into your layout file

   {!! phone_input_css() !!}
   {!! phone_input_js() !!}
   @stack('scripts)
   

4. Usage

   <x-phone-input model="{livewire_model}" id="{livewire_model}" name="{livewire_model}" class="{any_css_class}" />
   <input type="hidden" wire:model.live="country_code">
   

5. Example

   <!-- Livewire Component -->
   <div>
    <form wire:submit.prevent="submit">
        <x-phone-input model="phone" id="phone" name="phone" class="block w-full rounded-lg border border-gray-300 bg-gray-50 p-2.5 text-sm text-gray-900 focus:border-blue-500 focus:ring-blue-500" />
        <input type="hidden" wire:model.live="country_code">
        <button type="submit">Submit</button>
    </form>
   </div>
   

   <!-- Livewire Class -->
   use Livewire\Component;
   

class PhoneInputComponent extends Component {

public $phone;
public $country_code;

public function submit()
{
    // Handle the form submission
    $this->validate([
        'phone' => 'required',
        'country_code' => 'required',
    ]);

    // Process the phone number and country code
}

public function render()
{
    return view('livewire.phone-input-component');
}

}

5. If You want to use the input in Spatie Step Wizard, Call this function to reinit on step initialization

init_itl();