Date Picker

Features

• Localisation
• Use almost any option from the Flatpickr library https://flatpickr.js.org/options/
• Themes
• Optionally auto-import external scripts
• Default value
• Range dates
• Multiple dates
• Based on Flatpickr

---

Sponsors only field, for included Html 5 Date input - see Field Input wiki page.

Please 💗 sponsor this package 🔗 in order to get access to this field. The documentation is available in the sponsor repository.

Example

DatePicker::make('Birthday')
    ->theme('dark')
    ->locale('sv')
    ->options([ //almost any flatpickr option
        'minDate' => "2020-10-01",
        'maxDate' => now()->addMonths(1),
    ])
    ->default(now()) //used when resetting the field, or if $this->model->foo = null
    ->placeholder('Select date...')
    ->includeExternalScripts() //only included once, if multiple DatePicker fields
    ->rules('required|date_format:"Y-m-d"')

Theme

    /* DatePicker */
    .tf-date-picker-clear-btn {
        @apply w-6 h-6 text-gray-400;
    }
    .tf-date-picker-clear-btn-size {
        @apply w-6 h-6;
    }
    .tf-date-picker-calendar-icon {
        @apply w-6 h-6 text-gray-600;
    }