Weave Code
Livewire Datepicker Laravel Package
karnoweb/livewire-datepicker
Laravel Livewire datepicker component package. Provides an interactive date picker UI for Livewire forms with easy Blade integration and configurable options for formatting, localization, and styling. Suitable for building date inputs quickly in Laravel apps.
Jalali/Gregorian datepicker for Livewire 3 & 4 with Alpine.js
Frequently asked questions about Livewire Datepicker
- Does this package work with Livewire 3.x or only Livewire 2.x?
- The package is designed for Livewire 2.x and may require updates for full Livewire 3.x compatibility. Check the GitHub repository for version-specific notes or test with Livewire 3.x in a staging environment before full adoption. If issues arise, verify the `wire:model` binding syntax and Livewire’s property handling changes.
- How do I install and use this datepicker in a Laravel Livewire component?
- Install via Composer with `composer require karnoweb/livewire-datepicker`, then include the component in your Blade view using `<livewire:datepicker wire:model='selectedDate' />`. Ensure your Livewire component has a public property (e.g., `public $selectedDate`) to bind the date. No additional JS is needed for basic functionality.
- Can I customize the datepicker’s appearance or localization (e.g., Persian/Jalali calendar)?
- Yes, the package supports both Gregorian and Jalali calendars out of the box. Localization can be adjusted via Alpine.js or Livewire properties, though advanced theming may require manual CSS or JS overrides. Refer to the README for available configuration options, such as `locale` or `calendar` attributes.
- Is this package compatible with Laravel 9/10, and what about older Laravel versions?
- The package aligns with Livewire’s supported versions, so it should work with Laravel 9/10. For older Laravel versions (e.g., 8.x), ensure Livewire 2.x is installed and test thoroughly, as dependencies like PHP or Blade syntax may differ. No explicit Laravel versioning is documented, so verify compatibility in a test environment.
- How does the performance compare to native HTML5 `<input type='date'>` or JavaScript alternatives like Flatpickr?
- This package is lightweight and server-driven, avoiding heavy JS bundles like Flatpickr. Performance is comparable to native HTML5 inputs but offers more customization and Livewire reactivity. For large-scale apps, it’s ideal if you prioritize simplicity and Laravel-native solutions over standalone JS libraries.
- What happens if a user’s browser doesn’t support Alpine.js or modern JavaScript features?
- The package relies on Alpine.js for interactivity, so older browsers (e.g., IE11) may not work without polyfills. For critical applications, implement a fallback like Flatpickr or a native HTML5 input. Test in mobile Safari or legacy browsers to ensure graceful degradation.
- Can I use this datepicker with Laravel validation (e.g., `validateDateFormat`)?
- Yes, the datepicker outputs formatted dates (e.g., Y-m-d) that can be validated using Laravel’s built-in validation rules like `date` or `after:today`. Ensure your Livewire property (e.g., `$selectedDate`) is bound correctly and matches the expected format in your validation logic.
- Are there any known issues with accessibility (WCAG) or RTL languages?
- The package supports RTL languages like Persian (Jalali) but may require manual adjustments for full WCAG compliance. Test keyboard navigation, screen reader compatibility, and ARIA attributes in your specific use case. If issues arise, consider wrapping the component in additional Alpine.js or custom JS for accessibility enhancements.
- What alternatives exist if I need more advanced features (e.g., date ranges, custom UI)?
- For advanced features, consider standalone JS libraries like Flatpickr, Tempus Dominus (Bootstrap 5), or Pikaday. If you’re already using Livewire, you could also build a custom component with Alpine.js and a lightweight library. However, this package is optimized for simplicity and Livewire integration.
- How can I contribute or report bugs if the package lacks maintenance (no stars/commits visible)?
- Since the package has limited activity, start by opening an issue on GitHub with clear reproduction steps. For urgent fixes, fork the repository and submit a pull request. Alternatively, reach out to the Laravel/Livewire communities for workarounds or consider maintaining a fork if the package aligns with your needs.
Weaver
How can I help you explore Laravel packages today?