{% extends "forms/field.html.twig" %}

{% set value = (value is null ? field.default : value) %}
{% set default_php_dateformat = admin.guessDateFormat(value) %}
{% set php_dateformat = field.format ?: admin.page.dateformat ?: config.system.pages.dateformat.default ?: default_php_dateformat %}
{% set js_dateformat = admin.dateformatToMomentJS(php_dateformat) %}
{% set value = (value is null ? value : value|date(php_dateformat)) %}

{% block input %}
<div class="form-input-wrapper datetime-picker-wrapper {{ field.size }}">
    <input
            name="{{ (scope ~ field.name)|fieldName }}"
            value="{{ value|raw|join(', ') }}"
            {% block input_attributes %}
                type="text"
                data-grav-datetime="{{ {'format': js_dateformat} | json_encode | e('html_attr') }}"
                {% if field.validate.min %}min="{{ (field.validate.min is null ? field.validate.min : field.validate.min|date(php_dateformat)) }}"{% endif %}
                {% if field.validate.max %}max="{{ (field.validate.max is null ? field.validate.max : field.validate.max|date(php_dateformat)) }}"{% endif %}
                {{ parent() }}
            {% endblock %}
    />
    <span class="field-icons">
        <i class="fa fa-fw fa-calendar"></i>
    </span>
</div>
{% endblock %}