{# ========================================================================== #}
{# :: Imports #}
{# ========================================================================== #}
{% import "general/building-blocks/input/input-macros.njk" as input %}
{% import "general/building-blocks/button/button-macros.njk" as button %}

{# ========================================================================== #}
{# :: Private macros #}
{# ========================================================================== #}
{% macro _top(classes, labelClasses) %}

	<div class="c-formfield {{classes}}">
		<label class="c-formfield__container {{labelClasses}}">

{% endmacro %}

{% macro _input(data,type) %}

	<input
		class="c-formfield__input"
		type="{{type}}"
		name="{{data.name}}"
		value="{{data.text}}"
		{% if data.checked %} checked {% endif %}
	/>

{% endmacro %}

{% macro _checkboxHolder() %}

	<span class="c-formfield__holder">
		<span class="fas fa-check c-formfield__icon"></span>
	</span>

{% endmacro %}

{% macro _radioHolder() %}

	<span class="c-formfield__holder">
		<span class="fa fa-circle c-formfield__icon"></span>
	</span>

{% endmacro %}

{% macro _bottom() %}

	</label>
</div>

{% endmacro %}

{# ========================================================================== #}
{# :: Default #}
{# ========================================================================== #}
{% macro default(classes, data) %}

	{% if (data.type == "checkbox") %}

		{{ checkbox(classes,data)}}

	{% elif data.type == "radio" %}

		{{ radio(classes,data)}}

	{% elif data.type == "text" %}

		{{ text(classes,data)}}

	{% elif data.type == "number" %}

		{{ number(classes,data)}}

	{% elif data.type == "select" %}

		{{ select(classes,data)}}

	{% elif data.type == "button" %}

		{{ button(classes,data)}}

	{% elif data.type == "date" %}

		{{ date(classes,data)}}

	{% endif %}

{% endmacro %}

{% macro radio(classes,data)%}

	{{ _top(classes) }}

	{{ _input(data,"radio")}}

	{{ _radioHolder()}}

	<p class="c-formfield__label">{{data.text | safe}}</p>

	{{ _bottom() }}

{% endmacro %}

{% macro checkbox(classes,data) %}

	{{ _top(classes) }}

	{{ _input(data,"checkbox")}}

	{{ _checkboxHolder()}}

	<p class="c-formfield__label">{{data.text | safe}}</p>

	{{ _bottom() }}

{% endmacro %}

{% macro text(classes,data) %}

	{{ _top(classes) }}

	{{input.default("", {
		id:data.id,
		name: data.name,
		input: {
			type: "text",
			placeholder: data.text }
		})}}

	{{ _bottom() }}

{% endmacro %}

{% macro date(classes,data) %}

	{{ _top(classes) }}

	{{input.default("", {
		id:data.id,
		name: data.name,
		input: {
			type: "date",
			placeholder: data.text
		}
	})}}

	{{ _bottom() }}

{% endmacro %}

{% macro number(classes,data) %}

	{{ _top(classes) }}

	{{input.default("", {
		id: data.id,
		name: data.name,
		input: {
			type: "number",
			min: data.min,
			max: data.max,
			step: "1",
			placeholder: data.placeholder
		}
	})}}

	{{ _bottom() }}

{% endmacro %}

{% macro select(classes,data) %}

	{{ _top(classes) }}

	{{input.select("", {
		id: data.id,
		name: data.name,
		input: data.input
	})}}

	{{ _bottom() }}

{% endmacro %}

{% macro link(classes,data)%}

	{{ _top(classes) }}

	<a class="l-form__link" href="{{data.link}}">{{data.text}}</a>

	{{ _bottom() }}

{% endmacro %}

{% macro button(classes,data) %}

	{{ _top(classes,"c-formfield--advanced js-formfield" ) }}

	{{ _input(data,"checkbox")}}

	{{ _checkboxHolder()}}

	<p class="c-formfield__label">{{data.text | safe}}</p>

	{{ _bottom() }}
{% endmacro %}
