- How do I install the Filament DateRangePicker in my Laravel project?
- Run `composer require malzariey/filament-daterangepicker-filter` to install the package. If you need localization, publish translations with `php artisan vendor:publish --tag="filament-daterangepicker-filter-translations"`. No additional setup is required for basic usage.
- Does this package work with Filament v3.x or only v4?
- This package is explicitly built for **Filament v4** and fully supports its architecture. Limited support exists for v3.x, but manual adjustments may be required if migrating from v3.x. Check the changelog for migration notes.
- Can I use this for month/year ranges instead of just days?
- Yes! The package supports **day, month, and year picker modes**. Use `monthPicker()` for month ranges or `yearPicker()` for year ranges. Each mode includes presets and customizable formats like `'F Y'` for months or `'Y'` for years.
- How do I customize the SQL query for filtering dates?
- Use the `modifyQueryUsing` callback to inject custom SQL logic. For example, override the default `whereBetween` to handle overlapping ranges or custom date logic. This is useful for complex filtering scenarios beyond simple range queries.
- Will this work with Livewire and reactive updates?
- Yes, the package integrates natively with Livewire. It emits custom events like `apply.daterangepicker` and `cancel.daterangepicker`, allowing you to react to changes in your Livewire components. Dual-state mode also syncs with Livewire properties like `start_date` and `end_date`.
- Does the date picker support time selection (e.g., 12/24-hour format)?
- Yes, time selection is optional. Enable it with `->withTime()` on the field or filter. You can choose between 12-hour or 24-hour formats using `->timeFormat('H:i')` or `->timeFormat('h:i A')`.
- How does localization work, and can I translate it to other languages?
- Localization is built-in via Day.js locales. Publish translations first, then set the locale in your app (e.g., `app()->setLocale('fr')`). The package aligns with Laravel’s localization system, so you can use any supported locale.
- Are there performance concerns with large datasets?
- The picker itself is lightweight (Alpine.js + Day.js), but client-side validation (e.g., disabled dates) runs in the browser. For large datasets, ensure your backend query logic in `modifyQueryUsing` is optimized. Default `whereBetween` is efficient for most use cases.
- Can I use this in a modal or slide-over without z-index issues?
- Yes, the picker teleports to `<body>` by default, solving z-index conflicts. This ensures it works seamlessly in modals, slide-overs, or nested Filament panels without overlapping issues.
- What alternatives exist for Filament date range pickers?
- Alternatives include jQuery-based plugins like `daterangepicker` (legacy) or custom solutions using Alpine.js + Flatpickr. However, this package is the **only native Filament v4-compatible** option with built-in filter support, presets, and full UI alignment. It avoids jQuery/Moment.js dependencies for a modern stack.