{% macro create(optionName, permission, inputId) %}

    {% set inline = getMetadata(optionName, 'INLINE')|join(' ') %}
    {% set description = getMetadata(optionName, 'DESCRIPTION') %}
    {% set elements = getMetadata(optionName, 'ELEMENTS') %}
    {% set angularAttributes = getMetadata(optionName, 'ANGULAR_ATTRIBUTES') %}
    {% set angularButtonAttributes = getMetadata(optionName, 'ANGULAR_BUTTON_ATTRIBUTES') %}
    {% set typeStructure = getMetadata(optionName, 'TYPE_STRUCTURE') %}
    {% set newNetwork = isOnNetworkDashboard() %}


    {% if permission == 2 or permission == 1 %}
        {% set  disabled = "disabled" %}
    {% else %}
        {% set disabled = "" %}
    {% endif %}

    {% if not angularAttributes is empty %}
        {% if  newNetwork %}
            {% set angularAttributes = angularAttributes ~ ' && (0))"' %}
        {% else %}
            {% set angularAttributes = angularAttributes ~ '&& (1))"' %}
        {% endif %}
    {% endif %}

    <input type="text" ng-model="new_{{ optionName }}" {{ angularAttributes|raw }} {{ disabled }}>
    <button class="button button-primary adi-btn-delete adi-button"
            ng-click="add_{{ optionName }}(new_{{ optionName }})" {{ angularAttributes|raw }} {{ angularButtonAttributes|raw }} {{ disabled }}>
        <span class="nsp_dashicons dashicons dashicons-plus adi-icon-inside-button"></span>
    </button>
    <br>

    <p>
        {% import "option/element/error-msg.twig" as errorElement %}
        {{ errorElement.create(optionName) }}
    </p>

    <ul>
        <li ng-repeat="(key, value) in option.{{ optionName }} track by key">
            <div ng-if="option.{{ optionName }}[key] != ''">
                <input type="text" ng-model="option.{{ optionName }}[key]" {{ angularAttributes|raw }} {{ disabled }} >
                <button class="button adi-btn-delete adi-button"
                        ng-click="remove_{{ optionName }}(key)" {{ angularAttributes|raw }} {{ disabled }}>
                    <span class="nsp_dashicons dashicons dashicons-no-alt adi-icon-inside-button"></span>
                </button>
            </div>
        </li>
    </ul>

    {% import "option/element/description.twig" as descriptionElement %}
    {{ descriptionElement.create(description) }}
    
{% endmacro %}