Form DateField

Render an input field that allow date value(s), and display a calendar using Flatpickr.

Properties

name	type	default value	description
id	?string	null	Field ID
name	?string	null	Field name
label	?string	null	Label visible on the form
errorBag	?string	null	Error field returned from the bag
disabled	bool	false	Determs if the field is disable (or not)
readOnly	bool	false	Determs if the field is read-only (or not)
value	mixed	null	Field value
placeholder	?string	null	Field placeholder
hint	?string	null	Hint text shown above the form component
help	?string	null	Hint text shown after the form component
valueFormat	?string	null	Input form value
displayFormat	?string	null	Alternative value shown to the UI
mode	?string	null	Determs if the calendar will works as single value (default), range or multiple values.
customConfig	?array	null	Allow to extend the flatpickr with custom configurations

Usage

<x-bc-form:date-field label="Date field" error-bag="dateField" value-format="Y-m-D" display-format="d/m/Y" />

If you use Laravel Livewire:

<x-bc-form:date-field label="Date field" error-bag="dateField" value-format="Y-m-D" display-format="d/m/Y" wire:model.lazy="moneyField" />

Finally, to show the time:

<x-bc-form:date-field label="Date Time field" error-bag="dateField" value-format="Y-m-D H:i" display-format="m/D/Y H:i" wire:model.lazy="moneyField" :custom-config="['enableTime' => true]" />

Scopes

• prepend
• append

Example:

<x-bc-form:date-field>
    <x-slot name="prepend">Prepend</x-slot>
    <x-slot name="append">Append</x-slot>
</x-bc-form:date-field>