diff --git a/README.md b/README.md index c074bec..0eb6249 100644 --- a/README.md +++ b/README.md @@ -89,6 +89,27 @@ public function form(Form $form): Form } ``` + +## Input type +By default, the input type is set to "number". If you need to change it to "password" or "text", you can use the following methods: +```php +use HasanAhani\FilamentOtpInput\Components; +use Filament\Forms\Form; + +public function form(Form $form): Form +{ + return $form + ->schema([ + // ... + OtpInput::make('otp') + ->password() + // or + ->text() + ->label('Otp'), + ]); +} +``` + ## Testing ```bash diff --git a/resources/views/components/otp-input.blade.php b/resources/views/components/otp-input.blade.php index 7a50d6a..fb389a8 100644 --- a/resources/views/components/otp-input.blade.php +++ b/resources/views/components/otp-input.blade.php @@ -14,6 +14,7 @@ $statePath = $getStatePath(); $numberInput = $getNumberInput(); $isAutofocused = $isAutofocused(); + $inputType = $getType(); @endphp numberInput = $number; @@ -35,4 +38,22 @@ public function getNumberInput():int return $this->evaluate($this->numberInput); } + + public function password(): static + { + $this->type = 'password'; + return $this; + } + + public function text(): static + { + $this->type = 'text'; + return $this; + } + + public function getType(): string + { + return $this->evaluate($this->type); + } + }