{% if name is defined and name %}
    <input type="hidden" name="{{ name }}" value="">
{% endif -%}

{% set elements = (elements is defined and elements ? elements : []) -%}
{% set jsClass = (jsClass is defined and jsClass ? jsClass : 'Craft.BaseElementSelectInput') -%}
{% set sources = (sources is defined and sources ? sources : null) -%}
{% set criteria = (criteria is defined and criteria ? criteria : null) -%}
{% set sourceElementId = (sourceElementId is defined and sourceElementId ? sourceElementId : null) -%}
{% set storageKey = (storageKey is defined and storageKey ? storageKey : null) -%}
{% set viewMode = (viewMode is defined ? viewMode : 'list') %}
{% set sortable = (sortable is defined ? sortable : true) %}
{% set fieldId = (fieldId is defined ? fieldId : null) %}

<div id="{{ id }}" class="elementselect"
        {%- if block('attr') is defined %} {{ block('attr') }}{% endif %}>
    <div class="elements">
        {% for element in elements %}
            {% include "_elements/element" with {
                context: 'field',
                size: (viewMode == 'large' ? 'large' : 'small')
            } %}
        {% endfor %}
    </div>

    <div class="btn add icon dashed">{{ selectionLabel is defined ? selectionLabel : "Choose"|t('app') }}</div>
</div>

{% set jsSettings = {
    id: id|namespaceInputId,
    name: name|namespaceInputName,
    elementType: elementType,
    sources: sources,
    criteria: criteria,
    sourceElementId: sourceElementId,
    viewMode: viewMode,
    limit: limit ?? null,
    showSiteMenu: showSiteMenu ?? false,
    modalStorageKey: storageKey,
    fieldId: fieldId,
    sortable: sortable
} %}

{% js %}
    new {{ jsClass }}({{ jsSettings|json_encode|raw }});
{% endjs %}
