- How do I install harvirsidhu/filament-timepicker?
- Install it with Composer by running composer require harvirsidhu/filament-timepicker in your Laravel project. The package's service provider is auto-discovered, so no manual registration is normally required. If the README mentions publishing assets or config, run php artisan vendor:publish for the relevant tag.
- Does this time picker work with Filament v3?
- The package is built as a Filament form field, so it targets the Filament version declared in its composer.json. Check that constraint on the GitHub repository before installing to confirm it matches your app's Filament release. If you are on an older or newer major version, verify compatibility or pin accordingly.
- What time formats can users type into the field?
- Users can type freely rather than being forced into a strict mask. Common inputs like 3p, 330, and 3:30 PM are parsed into suggestions. The dropdown filters as you type, so partial input still surfaces matching times.
- How do I add the TimePicker field to a Filament form?
- Import the field class and add it to your form schema like any other Filament field, for example TimePicker::make('starts_at'). Place it inside your resource or Livewire form schema where the time value should be edited. Refer to the README for the exact namespace and any required setup.
- Can I customize the suggested times or the interval between options?
- The field exposes configuration for the suggestion list, and the README documents the available methods. You can typically adjust the interval or the set of times offered so the dropdown matches your app's scheduling rules. Check the repository docs for the specific fluent methods supported in your version.
- Is the time picker keyboard accessible?
- Yes, the suggestion dropdown is described as keyboard-navigable. Users can arrow through filtered suggestions and select one without leaving the keyboard, while still being able to type freely. This makes it usable in fast data-entry workflows and for accessibility-conscious forms.
- How do I test a Filament form that uses this time picker?
- Use Filament's form testing helpers to fill the field, for example fillForm(['starts_at' => '3:30 PM']) and then assert the saved state. Livewire tests can also set the component property directly and assert the database value. Because input is parsed into a normalized time, assert against the format your field dehydrates.
- What format is the time stored as in the database?
- The field parses free-form input into a normalized time value before dehydration. You can control the output format using the field's standard Filament formatting and dehydration methods. Confirm the exact default in the README, and cast or format the column in your model as needed.
- Does it work with Livewire and reactive Filament forms?
- Because it is a Filament form field, it runs inside Livewire components and participates in the normal reactive lifecycle. Typing updates the field state, and dependent fields can react to the selected time. Standard Filament reactive callbacks such as live() and afterStateUpdated() apply.
- Is the package maintained, and what are the alternatives?
- Check the GitHub repository for recent commits, releases, and open issues to judge maintenance activity before adopting it. The main alternative is Filament's native date-time picker configured for time-only input. This package is worth considering when you specifically want type-ahead parsing of inputs like 3p or 330.